obsidian外观
Obsidian 样式 - 全宽的图谱搜索框样式
插件ID:obsidian%E6%A0%B7%E5%BC%8F-%E5%85%A8%E5%AE%BD%E7%9A%84%E5%9B%BE%E8%B0%B1%E6%90%9C%E7%B4%A2%E6%A1%86%E6%A0%B7%E5%BC%8F
obsidian%E6%A0%B7%E5%BC%8F-%E5%85%A8%E5%AE%BD%E7%9A%84%E5%9B%BE%E8%B0%B1%E6%90%9C%E7%B4%A2%E6%A1%86%E6%A0%B7%E5%BC%8F
obsidian%E6%A0%B7%E5%BC%8F %E5%85%A8%E5%AE%BD%E7%9A%84%E5%9B%BE%E8%B0%B1%E6%90%9C%E7%B4%A2%E6%A1%86%E6%A0%B7%E5%BC%8F:全宽的图谱搜索框样式
Obsidian 样式 - 全宽的图谱搜索框样式
/* 图谱搜索框的调整 */
.view-content:has(div.graph-controls) {
padding: 0;
margin: 0;
/* 嵌套语法 ref: https://segmentfault.com/a/1190000044029087 or https://www.w3.org/TR/css-nesting-1/ */
/* 也可以用Less预处理器编译为正常CSS */
.graph-controls:not(.is-close) {
border-width: 0;
border-bottom-width: 1px;
margin: 0;
padding: 0;
left: 0;
top: 0;
width: 100%;
display: flex;
position: absolute;
border-radius: 0;
/* 使子元素自动换行 */
flex-wrap: wrap;
/* 毛玻璃效果 */
backdrop-filter: blur(2px);
/* 半透明背景 */
background-color: rgba(255, 255, 255, 0.1);
box-shadow: none !important;
}
/* !控件设置 打开自动扩大 */
.graph-control-section {
/* margin-right: 10px; */
border: none;
}
/* 打开时,界面宽度为100% */
.graph-control-section:not(.is-collapsed) {
border-bottom: 1px solid var(--background-modifier-border);
width: 100%;
}
/*避免线重合 */
.graph-control-section:is(.is-collapsed)+.graph-control-section:not(.is-collapsed) {
border-top: 1px solid var(--background-modifier-border);
}
/* !开关选项设置 */
/* & .setting-item.mod-slider, */
.setting-item.mod-toggle {
display: inline-flex;
grid-template-columns: auto;
grid-column: auto;
flex-wrap: wrap;
margin-left: 0px;
margin-right: 25px;
border: 0;
/* width: auto; */
justify-items: start;
justify-content: space-between;
}
/* & .setting-item.mod-slider{
min-width: 20%;
} */
}
/* 提示建议宽度设置 */
.suggestion-container.mod-search-suggestion {
max-width: 400px;
}
讨论
若阁下有独到的见解或新颖的想法,诚邀您在文章下方留言,与大家共同探讨。
反馈交流
其他渠道
版权声明
版权声明:所有 PKMer 文章如果需要转载,请附上原文出处链接。