参照 obsidian-minimal 主题制作的默认 dark 主题代码片段

本贴最后更新于 197 天前,其中的信息可能已经事过景迁

图片.png

图片.png

图片.png

谢谢制作 minimal 主题的大佬(kepano)

使用方式:切换到默认主题的 dark 配色模式,然后在设置-外观-代码片段中添加如下代码。

:root {
  /**直接在此修改变量数值**/
  --display-c: none; /**控制元素的开关**/
  /**颜色**/
  --base-h: 0; /* Base hue 色相 */
  --base-s: 0%; /* Base saturation 饱和度 */
  --base-l: 15%; /* Base lightness - 100 is white 亮度*/
  --base-d: 0;
  --accent-h: 201; /* Accent hue 强调色色相*/
  --accent-s: 17%; /* Accent saturation  强调色饱和度*/
  --accent-l: 60%; /* Accent lightness 强调色亮度*/
  /**字体**/
  --font-small: 13px;
  --font-smaller: 11px;
  --font-normal: 16px;
  --font-large: 20px;
  /* Font weights */
  --normal-weight: 400;
  --medium-weight: 600;
  --bold-weight: 700;
  --link-weight: inherit;
  /**标题**/
  --h1-size: 1.25em;
  --h2-size: 1.15em;
  --h3-size: 1.05em;
  --h4-size: 1em;
  --h5-size: 1em;
  --h6-size: 0.95em;
  --h1-weight: 600;
  --h2-weight: 600;
  --h3-weight: 500;
  --h4-weight: 500;
  --h5-weight: 500;
  --h6-weight: 400;
  --h-n-margin: 0;
}

:root {
  /* 主色 */
  --b3-theme-primary: hsla(
    var(--base-h),
    var(--base-s),
    calc(var(--base-l) + 40%),
    0.12
  );
  --b3-theme-primary-light: hsl(
    var(--accent-h),
    var(--accent-s),
    calc(var(--accent-l) - 5%)
  );
  --b3-theme-primary-lighter: hsl(
    var(--accent-h),
    var(--accent-s),
    calc(var(--accent-l) - 33%)
  );
  --b3-theme-primary-lightest: hsla(
    var(--base-h),
    var(--base-s),
    calc(var(--base-l) + 40%),
    0.12
  );
  --b3-theme-secondary: #f3a92f;
  --b3-theme-background: hsl(0, 0%, 15%);
  --b3-theme-background-light: hsl(
    var(--b-h),
    var(--b-s),
    calc(var(--b-d) + 23%)
  );
  --b3-theme-surface: hsl(0, 0%, calc(15% - 2%));
  --b3-theme-surface-light: hsl(
    var(--base-h),
    calc(var(--base-s) - 20%),
    calc(var(--base-l) + 45%)
  );
  --b3-theme-surface-lighter: rgba(230, 230, 230, 0.15);
  --b3-theme-error: black;
  --b3-theme-success: hsl(
    calc(var(--base-h)+107),
    calc(var(--base-s)+43%),
    calc(var(var(--base-l) + 36%))
  );
  /* 文字颜色 */
  --b3-theme-on-primary: white;
  --b3-theme-on-secondary: white;
  --b3-theme-on-background: hsl(
    var(--base-h),
    calc(var(--base-s) - 10%),
    calc(var(--base-l) + 67%)
  );
  --b3-theme-on-surface: hsl(
    var(--base-h),
    calc(var(--base-s) - 10%),
    calc(var(--base-l) + 57%)
  );
  --b3-theme-on-surface-light: hsl(
    var(--base-h),
    calc(var(--base-s) - 20%),
    calc(var(--base-l) + 45%)
  );
  --b3-theme-on-surface-status: hsl(
    var(--base-h),
    calc(var(--base-s) - 10%),
    calc(var(--base-l) + 20%)
  );
  --b3-theme-on-error: white;

  /* 字体 */
  --b3-font-family: "更纱黑体 SC", "Helvetica Neue", "Luxi Sans", "DejaVu Sans",
    "Hiragino Sans GB", "Microsoft Yahei", sans-serif, "Apple Color Emoji",
    "Noto Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Android Emoji",
    "EmojiSymbols";
  --b3-font-family-protyle: var(--b3-font-family);
  --b3-font-family-code: "JetBrainsMono-Regular", mononoki, Consolas,
    "Liberation Mono", Menlo, Courier, monospace, var(--b3-font-family);
  --b3-font-family-graph: mononoki;
  --b3-font-family-emoji: "Segoe UI Emoji", "Segoe UI Symbol", "Segoe UI",
    "Apple Color Emoji", "Twemoji Mozilla", "Noto Color Emoji", "Android Emoji";
  --b3-font-family-math: KaTeX_Math;

  /* 顶部工具栏 */
  --b3-toolbar-background: var(--b3-theme-surface);
  --b3-toolbar-blur-background: var(--b3-border-color);
  --b3-toolbar-color: var(--b3-theme-on-surface);
  --b3-toolbar-hover: var(--b3-theme-background-light);
  --b3-toolbar-left-mac: 69px;

  /* 线条 */
  --b3-border-color: hsl(
    var(--base-h),
    var(--base-s),
    calc(var(--base-l) + 6%)
  );
  --b3-border-radius: 5px;
  --b3-border-radius-b: 8px;

  /* 滚动条 */
  --b3-scroll-color: rgba(230, 230, 230, 0.2);

  /* 列表 */
  --b3-list-hover: var(--b3-border-color);
  --b3-list-icon-hover: rgba(201, 209, 217, 0.1);

  /* 菜单 */
  --b3-menu-background: var(--b3-theme-surface);

  /* 提示 */
  --b3-tooltips-background: #000000;
  --b3-tooltips-color: #ffffff;
  --b3-tooltips-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);

  /* av */
  --b3-av-hover: #2a2a2a;
  --b3-av-background-hl: var(--b3-theme-surface-lighter);

  /* 为空提示 */
  --b3-empty-color: var(--b3-theme-on-surface);

  /* 遮罩 */
  --b3-mask-background: rgba(0, 0, 0, 0.75);

  /* 卡片背景 */
  --b3-card-error-color: #d69595;
  --b3-card-error-background: var(--b3-font-background13);
  --b3-card-warning-color: rgb(255, 213, 153);
  --b3-card-warning-background: var(--b3-font-background5);
  --b3-card-info-color: rgb(166, 213, 250);
  --b3-card-info-background: var(--b3-font-background10);
  --b3-card-success-color: rgb(183, 223, 185);
  --b3-card-success-background: var(--b3-font-background8);

  /* 自定义文字 */
  --b3-font-color1: #fff;
  --b3-font-color2: #6f7477;
  --b3-font-color3: #937264;
  --b3-font-color4: #fda244;
  --b3-font-color5: #e5b567;
  --b3-font-color6: #ffdc49;
  --b3-font-color7: #a8c373;
  --b3-font-color8: #73bbb2;
  --b3-font-color9: #6c99bb;
  --b3-font-color10: #9e86c8;
  --b3-font-color11: #d04255;
  --b3-font-color12: #d5763f;
  --b3-font-color13: #b05279;

  --b3-font-background2: rgb(63, 68, 71);
  --b3-font-background3: rgb(69, 75, 78);
  --b3-font-background4: rgb(67, 64, 64);
  --b3-font-background5: rgb(89, 74, 58);
  --b3-font-background6: rgb(89, 79, 59);
  --b3-font-background7: rgb(89, 86, 59);
  --b3-font-background8: rgba(53, 76, 75);
  --b3-font-background9: rgb(54, 79, 84);
  --b3-font-background10: rgb(54, 73, 84);
  --b3-font-background11: rgb(68, 63, 87);
  --b3-font-background12: rgb(83, 59, 76);
  --b3-font-background13: rgb(89, 65, 65);

  /* 动画效果 */
  --b3-transition: all 0.2s cubic-bezier(0, 0, 0.2, 1) 0ms;
  --b3-width-transition: width 0.2s cubic-bezier(0, 0, 0.2, 1) 0ms;
  --b3-color-transition: color 0.2s cubic-bezier(0, 0, 0.2, 1) 0ms;
  --b3-background-transition: background 20ms ease-in 0s;
  --bs-wbk: inset 0 0 0 0.3px var(--b3-border-color);

  /* 下拉菜单 */
  --b3-select-background: url("data:image/svg+xml;utf8,<svg fill='rgba(154, 160, 166, .68)' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>")
    no-repeat right 2px center var(--b3-theme-background);

  /* 阴影 */
  --b3-point-shadow: inset 0 0.5px 0.5px 0.5px rgba(255, 255, 255, 0.09),
    0 3px 6px rgba(0, 0, 0, 0.04), 0 0 0 0 transparent;
  --b3-dialog-shadow: 0 8px 24px #010409;
  --b3-button-shadow: 0 5px 5px -3px rgb(0 0 0 / 0.2),
    0 8px 10px 1px rgb(0 0 0 / 0.14), 0 3px 14px 2px rgb(0 0 0 / 0.12);

  /* 图表颜色 */
  --b3-graph-p-point: #076f7e;
  --b3-graph-heading-point: hsl(254, 80%, 74.8%);
  --b3-graph-math-point: #80ffa5;
  --b3-graph-code-point: #00ddff;
  --b3-graph-table-point: #37a2ff;
  --b3-graph-list-point: #ff0087;
  --b3-graph-todo-point: #ffbf00;
  --b3-graph-olist-point: #b3005f;
  --b3-graph-listitem-point: #f65b00;
  --b3-graph-bq-point: #8d48e3;
  --b3-graph-super-point: #dd79ff;
  --b3-graph-doc-point: #e8eaed;
  --b3-graph-tag-point: #dbf32f;
  --b3-graph-asset-point: #05c091;
  --b3-graph-line: #9aa0a6;
  --b3-graph-ref-line: #d23f31;
  --b3-graph-tag-line: #5f6b06;
  --b3-graph-tag-tag-line: #dbf32f;
  --b3-graph-asset-line: #037457;
  --b3-graph-hl-point: #f3a92f;
  --b3-graph-hl-line: #4285f4;

  /* 编辑器搜索颜色 */
  --b3-protyle-search-background: #32593c;
  --b3-protyle-search-border-color: #486a51;
  --b3-protyle-search-current-background: #204282;

  /* 代码片段背景 */
  --b3-protyle-code-background: hsl(
    var(--base-h),
    var(--base-s),
    calc(var(--base-l) - 6%)
  );
  --b3-protyle-code-linenumber-hl: hsl(
    var(--base-h),
    var(--base-s),
    calc(var(--base-l) - 2%)
  );
  /* 所见即所得行内元素颜色 */
  --b3-protyle-inline-strong-color: #e8eaed;
  --b3-protyle-inline-em-color: #e8eaed;
  --b3-protyle-inline-s-color: #e8eaed;
  --b3-protyle-inline-link-color: hsl(
    var(--accent-h),
    var(--accent-s),
    var(--accent-l)
  );
  --b3-protyle-inline-mark-background: hsla(
      calc(var(--base-h) + 50),
      calc(var(--base-s) + 100%),
      calc(var(--base-l) + 35%),
      0.8
    ),
    hsla(
      calc(var(--base-h) + 50),
      calc(var(--base-s) + 100%),
      calc(var(--base-l) + 35%),
      0.4
    );
  --b3-protyle-inline-mark-color: hsla(
    calc(var(--base-h) + 50),
    calc(var(--base-s) + 100%),
    calc(var(--base-l) + 35%),
    0.6
  );
  --b3-protyle-inline-tag-color: #9aa0a6;
  --b3-protyle-inline-blockref-color: hsl(
    var(--accent-h),
    var(--accent-s),
    var(--accent-l)
  );
  --b3-protyle-inline-blockref-color-hover: hsl(
    var(--accent-h),
    var(--accent-s),
    calc(var(--accent-l) + 8%)
  );
  --b3-protyle-inline-fileref-color: var(--b3-theme-secondary);

  /* PDF */
  --b3-pdf-selection: #779170;
  --b3-pdf-sidebar-width: 200px;
  --b3-pdf-offset: 0;
  --b3-pdf-background1: var(--b3-theme-error);
  --b3-pdf-background2: #f5822e;
  --b3-pdf-background3: #faca5a;
  --b3-pdf-background4: #7cc868;
  --b3-pdf-background5: #fc5c88;
  --b3-pdf-background6: #69b0f2;
  --b3-pdf-background7: #c885da;
  --b3-pdf-dark: var(--b3-theme-background);

  /* 标题后面的圆点符号*/
  --h1-r-graphic: url("data:image/svg+xml;utf8,<svg fill='%23999' height='24' viewBox='0 0 32 32' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M4.8 29.714v0c-1.371 0-2.514-1.143-2.514-2.514v0c0-1.371 1.143-2.514 2.514-2.514v0c1.371 0 2.514 1.143 2.514 2.514v0c0.114 1.371-1.029 2.514-2.514 2.514z'/></svg>")
    no-repeat center;
  --h2-r-graphic: url("data:image/svg+xml;utf8,<svg fill='%23999' height='24' viewBox='0 0 32 32' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M11.429 25.143c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM4.571 18.286c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286z'/></svg>")
    no-repeat center;
  --h3-r-graphic: url("data:image/svg+xml;utf8,<svg fill='%23999' height='24' viewBox='0 0 32 32' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M4.571 25.143c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM4.571 18.286c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM11.429 25.143c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286z'/></svg>")
    no-repeat center;
  --h4-r-graphic: url("data:image/svg+xml;utf8,<svg fill='%23999' height='24' viewBox='0 0 32 32' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M4.571 25.143c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM4.571 18.286c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM11.429 25.143c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM11.429 22.857c1.257 0 2.286-1.029 2.286-2.286s-1.029-2.286-2.286-2.286-2.286 1.029-2.286 2.286 1.029 2.286 2.286 2.286z'/></svg>")
    no-repeat center;
  --h5-r-graphic: url("data:image/svg+xml;utf8,<svg fill='%23999' height='24' viewBox='0 0 32 32' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M4.571 18.286c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM11.429 22.857c1.257 0-2.286 1.029-2.286 2.286s-1.029-2.286-2.286-2.286-2.286 1.029-2.286 2.286 1.029 2.286 2.286 2.286zM4.571 25.143c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM11.429 25.143c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM4.571 11.429c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286z'/></svg>")
    no-repeat center;
  --h6-r-graphic: url("data:image/svg+xml;utf8,<svg fill='%23999' height='24' viewBox='0 0 32 32' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M4.571 25.143c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM4.571 18.286c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM4.571 11.429c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM11.429 18.286c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM11.429 25.143c-1.257 0-2.286 1.029-2.286 2.286s1.029 2.286 2.286 2.286 2.286-1.029 2.286-2.286-1.029-2.286-2.286-2.286zM11.429 16c1.257 0 2.286-1.029 2.286-2.286s-1.029-2.286-2.286-2.286-2.286 1.029-2.286 2.286 1.029 2.286 2.286 2.286z'/></svg>")
    no-repeat center;
}

body {
  font-weight: var(--normal-weight);
  text-rendering: optimizeLegibility;
}

/* https://github.com/siyuan-note/siyuan/issues/6440 */
.protyle-action--order:after {
  mix-blend-mode: screen;
}
.protyle-gutters {
  transition: all 200ms ease-out;
}
.b3-text-field::-webkit-calendar-picker-indicator {
  filter: invert(1);
}

/**编辑区 行内元素**/
/**列表项目的名称**/
.b3-list-item__text {
  color: var(--b3-theme-on-surface-light);
  font-size: var(--font-small);
}
/*引用块*/
.protyle-wysiwyg
  [data-node-id]
  span[data-type*="block-ref"]:not([data-type="virtual-block-ref"]):not(
    [data-type*="sup"]
  ):not([data-type*="sub"]):not(.av__celltext--ref) {
  cursor: pointer;
  padding: 0px 1px 0px 1px;
  color: var(--b3-protyle-inline-blockref-color);
  opacity: 1;
  font-weight: var(--normal-weight);
}
.protyle-wysiwyg
  [data-node-id]
  span[data-type*="block-ref"]:not([data-type="virtual-block-ref"]):not(
    [data-type*="sup"]
  ):not([data-type*="sub"]):not(.av__celltext--ref):hover {
  color: var(--b3-protyle-inline-blockref-color-hover) !important;
  text-decoration-line: underline !important;
  cursor: pointer;
  font-weight: var(--normal-weight);
  background-color: transparent;
}
/**嵌入块**/
.protyle-wysiwyg [data-node-id].render-node[data-type="NodeBlockQueryEmbed"] {
  border-left: transparent;
}
/**行内代码**/
.hljs {
  color: var(--b3-theme-on-background);
  background: var(--b3-protyle-code-background);
}
/**键盘快捷键**/
.b3-typography kbd,
.b3-typography span[data-type~="kbd"],
.protyle-wysiwyg kbd,
.protyle-wysiwyg span[data-type~="kbd"] {
  background-color: var(--b3-protyle-code-background);
}
/**标题**/
.protyle-title__input {
  font-size: var(--h1-size);
  font-weight: var(--h1-weight);
}
.b3-typography .h1,
.b3-typography h1,
.protyle-wysiwyg .h1,
.protyle-wysiwyg h1 {
  font-weight: var(--h1-weight);
  font-size: var(--h1-size);
}
.b3-typography .h2,
.b3-typography h2,
.protyle-wysiwyg .h2,
.protyle-wysiwyg h2 {
  font-weight: var(--h2-weight);
  font-size: var(--h2-size);
}
.b3-typography .h3,
.b3-typography h3,
.protyle-wysiwyg .h3,
.protyle-wysiwyg h3 {
  font-weight: var(--h3-weight);
  font-size: var(--h3-size);
}
.b3-typography .h4,
.b3-typography h4,
.protyle-wysiwyg .h4,
.protyle-wysiwyg h4 {
  font-weight: var(--h4-weight);
  font-size: var(--h4-size);
}
.b3-typography .h5,
.b3-typography h5,
.protyle-wysiwyg .h5,
.protyle-wysiwyg h5 {
  font-weight: var(--h5-weight);
  font-size: var(--h5-size);
}
.b3-typography .h6,
.b3-typography h6,
.protyle-wysiwyg .h6,
.protyle-wysiwyg h6 {
  font-weight: var(--h6-weight);
  font-size: var(--h6-size);
}
/**段落**/
.b3-typography p,
.b3-typography [data-node-id],
.protyle-wysiwyg p,
.protyle-wysiwyg [data-node-id] {
  margin: var(--h-n-margin);
}
/**标题后面圆点**/
.protyle-wysiwyg .h1 > [spellcheck]:not(:empty)::after {
  background: var(--h1-r-graphic);
}
.protyle-wysiwyg .h2 > [spellcheck]:not(:empty)::after {
  background: var(--h2-r-graphic);
}
.protyle-wysiwyg .h3 > [spellcheck]:not(:empty)::after {
  background: var(--h3-r-graphic);
}
.protyle-wysiwyg .h4 > [spellcheck]:not(:empty)::after {
  background: var(--h4-r-graphic);
}
.protyle-wysiwyg .h5 > [spellcheck]:not(:empty)::after {
  background: var(--h5-r-graphic);
}
.protyle-wysiwyg .h6 > [spellcheck]:not(:empty)::after {
  background: var(--h6-r-graphic);
}
.protyle-wysiwyg .h1 > [spellcheck]:not(:empty)::after,
.protyle-wysiwyg .h2 > [spellcheck]:not(:empty)::after,
.protyle-wysiwyg .h3 > [spellcheck]:not(:empty)::after,
.protyle-wysiwyg .h4 > [spellcheck]:not(:empty)::after,
.protyle-wysiwyg .h5 > [spellcheck]:not(:empty)::after,
.protyle-wysiwyg .h6 > [spellcheck]:not(:empty)::after {
  content: "";
  position: absolute;
  float: left;
  margin-left: 0.2em;
  height: 1.2em;
  width: 1.2em;
  background-size: 100% 100%;
}
/**段落高亮**/
.protyle-wysiwyg
  [data-type]:hover:not(.protyle-wysiwyg [data-type="NodeList"]):not(
    .protyle-wysiwyg [data-type="NodeListItem"]
  ):not(.protyle-wysiwyg [data-type="img"]) {
  background-color: hsla(0, 0%, 77%, 0.1);
  box-shadow: 0 0 5px 0 hsla(0, 0%, 77%, 0.1);
  transition: all 0.5s ease-out 0ms;
}
.protyle-wysiwyg [data-type]:not(.protyle-wysiwyg [data-type="img"]) {
  transition: all 0.35s ease-out 0ms;
}
/* 不让超级块内部出现重叠的样式 */
.protyle-wysiwyg [data-node-id].sb[data-sb-layout="col"] .sb:hover,
.protyle-wysiwyg [data-node-id].sb[data-sb-layout="row"] .sb:hover,
.protyle-wysiwyg [data-type="NodeSuperBlock"]:hover {
  background: none !important;
  box-shadow: none !important;
  transition: none !important;
}
/**有序列表 无序列表**/
.protyle-wysiwyg [data-node-id].li > .protyle-action {
  color: var(--b3-theme-on-surface-status);
}
.protyle-wysiwyg [data-node-id].li > .protyle-action:after {
  height: 18px;
  width: 18px;
  margin: -9.5px 0 0 -9.5px;
}
/**索引线**/
.protyle-wysiwyg [data-node-id].li:before {
  content: "";
  position: absolute;
  border-left: 2px solid rgba(255, 255, 255, 0.03);
  left: 17px;
  height: calc(100% - 35px);
  top: 35px;
}
/**加粗**/
.b3-typography strong,
.b3-typography span[data-type~="strong"],
.protyle-wysiwyg strong,
.protyle-wysiwyg span[data-type~="strong"] {
  font-weight: var(--bold-weight);
  color: inherit;
}
/**分割线 分隔线**/
.protyle-wysiwyg [data-node-id].hr > div:after {
  height: 1.5px;
  background-color: var(--b3-border-color);
}

/**侧边栏文件树+顶栏+工具栏**/
/**文件树**/
/* 大纲块标隐藏样式 */
/* 为大纲块标和折叠按钮调整位置 */
ul.b3-list.b3-list--background [data-subtype="h1"] .b3-list-item__toggle,
ul.b3-list.b3-list--background [data-subtype="h2"] .b3-list-item__toggle,
ul.b3-list.b3-list--background [data-subtype="h3"] .b3-list-item__toggle,
ul.b3-list.b3-list--background [data-subtype="h4"] .b3-list-item__toggle,
ul.b3-list.b3-list--background [data-subtype="h5"] .b3-list-item__toggle,
ul.b3-list.b3-list--background [data-subtype="h6"] .b3-list-item__toggle {
  position: relative;
  left: 20px;
}
ul.b3-list.b3-list--background [data-subtype="h1"] svg.b3-list-item__graphic,
ul.b3-list.b3-list--background [data-subtype="h2"] svg.b3-list-item__graphic,
ul.b3-list.b3-list--background [data-subtype="h3"] svg.b3-list-item__graphic,
ul.b3-list.b3-list--background [data-subtype="h4"] svg.b3-list-item__graphic,
ul.b3-list.b3-list--background [data-subtype="h5"] svg.b3-list-item__graphic,
ul.b3-list.b3-list--background [data-subtype="h6"] svg.b3-list-item__graphic {
  opacity: 0;
  position: relative;
  left: -20px;
  margin: 0 0 0 4px;
  transition: all 300ms ease-out;
}
/*----------------------*/
/* 为大纲块标添加悬停显示效果 */
.b3-list--background .b3-list-item:hover .b3-list-item__graphic.popover__block {
  opacity: 1 !important;
}
ul.b3-list.b3-list--background
  [data-subtype="h1"]
  svg.b3-list-item__graphic:hover,
ul.b3-list.b3-list--background
  [data-subtype="h2"]
  svg.b3-list-item__graphic:hover,
ul.b3-list.b3-list--background
  [data-subtype="h3"]
  svg.b3-list-item__graphic:hover,
ul.b3-list.b3-list--background
  [data-subtype="h4"]
  svg.b3-list-item__graphic:hover,
ul.b3-list.b3-list--background
  [data-subtype="h5"]
  svg.b3-list-item__graphic:hover,
ul.b3-list.b3-list--background
  [data-subtype="h6"]
  svg.b3-list-item__graphic:hover {
  color: red;
}
/*----------------------*/
/* 为大纲标题项添加背景过渡效果 */
.b3-list--background .b3-list-item {
  transition: all 0.3s ease-out;
}

/**状态栏+外观说明文字**/
.ft__on-surface {
  color: var(--b3-theme-on-surface-light);
  font-size: var(--font-small);
}
.status__counter {
  color: var(--b3-theme-surface-light);
  transition: color 0.2s linear;
}
.status__counter:hover {
  color: var(--b3-theme-on-background);
}

/**图标**/
/**隐藏图标**/
.b3-list-item__icon {
  display: var(--display-c);
}
.block__logoicon {
  color: var(--b3-theme-on-surface);
}
.block__logo {
  color: var(--b3-theme-on-surface);
}
/**反链面板字体大小**/
.protyle-wysiwyg .protyle-breadcrumb__bar {
  font-size: var(--font-small);
}

/**菜单说明文字**/
.b3-label__text {
  color: var(--b3-theme-on-surface-light);
  font-size: 11px !important;
  overflow: hidden !important;
}
/**菜单下拉选框**/
.b3-select {
  box-shadow: inset 0 0.5px 0.5px 0.5px rgba(255, 255, 255, 0.09),
    0 2px 4px 0 rgba(0, 0, 0, 0.15), 0 1px 1.5px 0 rgba(0, 0, 0, 0.1),
    0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 0 0 0 transparent;
  background: var(--b3-theme-primary) !important;
}
.b3-text-field:not(.b3-text-field--text):hover,
.pcr-app .pcr-interaction .pcr-result:not(.b3-text-field--text):hover {
  box-shadow: var(--bs-wbk);
}
.b3-button--outline {
  box-shadow: var(--bs-wbk);
}
.b3-button--outline:hover {
  box-shadow: var(--bs-wbk);
  color: var(--b3-theme-on-background);
}

/**集市**/
.config-bazaar__title {
  padding: 16px;
  backdrop-filter: blur(8px);
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--b3-theme-background);
}
.layout-tab-bar .item--full.item--focus:after {
  border-bottom: 2px solid var(--b3-theme-primary-light);
}

/**文本输入框边框**/
.b3-text-field,
.pcr-app .pcr-interaction .pcr-result {
  box-shadow: var(--bs-wbk);
}

/**快捷键插件plugin**/
.config-keymap__key {
  border: solid 1px var(--b3-border-color);
}
.repeated-key {
  border: 2px solid var(--b3-border-color);
}

/**工具栏图标**/
.toolbar__item {
  color: var(--b3-theme-on-surface-light);
}
/**菜单左侧图标**/
.b3-list-item__graphic {
  color: var(--b3-theme-on-surface-light);
}
/**菜单搜索框图标**/
.toolbar__item svg {
  color: var(--b3-theme-on-surface-light);
}

/**面包屑栏**/
.protyle-breadcrumb {
  opacity: 0;
  transition: opacity 0.5s, transform 0.5s;
}
.protyle-breadcrumb:hover {
  opacity: 1;
  transform: translateY(0);
}

/**标签栏**/
/**标签栏下划线**/
.layout-tab-bar .item {
  border-bottom: 1px solid var(--b3-border-color);
}
.layout__wnd--active .layout-tab-bar .item--focus:after {
  border-bottom: 2px solid var(--b3-theme-primary-light);
}
/**标签栏文字**/
.layout-tab-bar .item__text {
  color: var(--b3-theme-on-surface-light);
}
/**标签栏下拉列表**/
.block__icon--show {
  transition: transform 0.15s cubic-bezier(0, 0, 0.2, 1),
    opacity 1s cubic-bezier(0, 0, 0.2, 1);
}
/**标签栏下拉列表文字**/
.b3-menu__item--selected {
  color: var(--b3-theme-on-surface) !important;
}
.b3-menu__item {
  background-color: var(--b3-menu-background);
  color: var(--b3-theme-on-surface);
}
/**固定标签**/
.layout-tab-bar .item--pin {
  flex: none;
  min-width: 42px;
  background-color: rgba(255, 255, 255, 0.08);
  /**  border-radius: var(--b3-border-radius);**/
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
  transition: background-color 0.5s ease, backdrop-filter 0.5s ease;
}

/**图片**/
.b3-typography img,
.protyle-wysiwyg img {
  opacity: 0.65;
  max-width: 500px;
  min-width: auto;
}
.b3-typography img,
.protyle-wysiwyg img:hover {
  opacity: 1;
}
/**题头图**/
.protyle-background__img {
  width: 100%;
  opacity: 0.65;
}
.protyle-background__img:hover {
  opacity: 1;
}
/**网络图片资源标记**/
.protyle-wysiwyg [data-node-id] .img__net {
  color: var(--b3-theme-primary-light);
  background-color: var(--b3-theme-surface-lighter);
}

/**设置-资源-删除按钮**/
.b3-button--outline {
  color: var(--b3-theme-on-surface);
}
a {
  color: var(--b3-theme-on-background);
}
/**按钮-确定**/
.b3-button--text,
.b3-button--cancel {
  color: var(--b3-theme-on-background);
}

/**侧边工具栏**/
.dock#dockLeft {
  border-right: unset;
}

/**编辑工具栏高亮**/
.protyle-toolbar__item--current {
  color: var(--b3-theme-on-error);
}

/**删除线**/
.b3-typography s,
.b3-typography span[data-type~="s"],
.protyle-wysiwyg s,
.protyle-wysiwyg span[data-type~="s"] {
  color: var(--b3-theme-on-surface-light);
  text-decoration: 2px line-through;
}

/**标签**/
.protyle-wysiwyg [data-node-id] span[data-type~="tag"] {
  position: relative;
  color: var(--b3-protyle-inline-blockref-color);
  transition: var(--b3-transition);
  border-bottom: unset;
  font-size: 90%;
}
.protyle-wysiwyg [data-node-id] span[data-type~="tag"]::before {
  content: "#";
  font-weight: var(--medium-weight);
  margin-right: 1px; /* 可根据需要调整间距 */
}

/**高亮**/
.b3-typography mark,
.b3-typography span[data-type~="mark"],
.protyle-wysiwyg mark,
.protyle-wysiwyg span[data-type~="mark"] {
  background: var(--b3-protyle-inline-mark-background);
  background-color: var(--b3-protyle-inline-mark-color);
  color: var(--b3-theme-background);
  font-weight: var(--medium-weight);
  box-shadow: 0 0 2px
    hsla(
      calc(var(--base-h) + 50),
      calc(var(--base-s) + 100%),
      calc(var(--base-l) + 40%),
      0.6
    );
  border-radius: 3px;
}
.b3-typography mark,
.b3-typography span[data-type~="mark"],
.protyle-wysiwyg mark,
.protyle-wysiwyg span[data-type~="mark"]:hover {
  background: inherit;
  background-color: inherit;
  color: inherit;
  box-shadow: inherit;
}

/**隐藏块滚动条**/
.protyle-scroll__bar .b3-slider {
  width: var(--b3-dynamicscroll-width);
  display: var(--display-c);
}

/**功能切换开关**/
.b3-switch:checked:after {
  background-color: var(--b3-theme-on-primary);
}

/**上标**/
.b3-typography span[data-type~="sup"],
.protyle-wysiwyg span[data-type~="sup"] {
  bottom: unset;
  font-size: 70%;
  position: static;
  display: inline-block;
  line-height: 1;
  vertical-align: super;
  color: var(--b3-theme-on-surface-light);
  font-size: 70%;
}
.b3-typography span[data-type~="sup"],
.protyle-wysiwyg span[data-type~="sup"]::before {
  content: "^";
  margin-left: 0.5px;
}
.b3-typography span[data-type~="sup"],
.b3-typography span[data-type~="sub"],
.protyle-wysiwyg span[data-type~="sup"],
.protyle-wysiwyg span[data-type~="sub"] {
  line-height: 1;
}

/**下标**/
.b3-typography span[data-type~="sub"],
.protyle-wysiwyg span[data-type~="sub"] {
  bottom: unset;
  font-size: 70%;
  position: relative;
  display: inline-block;
  vertical-align: baseline;
  line-height: 1;
  color: var(--b3-theme-on-surface-light);
  margin-left: 0.5px;
}

/**标题后面的符号**/
.protyle-wysiwyg .h1 > [spellcheck]:not(:empty)::after {
  background: var(--h1-r-graphic);
}
.protyle-wysiwyg .h2 > [spellcheck]:not(:empty)::after {
  background: var(--h2-r-graphic);
}
.protyle-wysiwyg .h3 > [spellcheck]:not(:empty)::after {
  background: var(--h3-r-graphic);
}
.protyle-wysiwyg .h4 > [spellcheck]:not(:empty)::after {
  background: var(--h4-r-graphic);
}
.protyle-wysiwyg .h5 > [spellcheck]:not(:empty)::after {
  background: var(--h5-r-graphic);
}
.protyle-wysiwyg .h6 > [spellcheck]:not(:empty)::after {
  background: var(--h6-r-graphic);
}

/**PDF 浏览**/
.textLayer span,
.textLayer br {
  color: transparent;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.toolbarButton.toggled,
.secondaryToolbarButton.toggled {
  color: var(--b3-theme-on-primary);
}
/**pdf左侧边框**/
.layout__resize--lr:after {
  width: 1px;
  cursor: col-resize;
  height: 100%;
}

/**取消钉住侧栏**/
.layout--float.layout__dockl {
  box-shadow: var(--b3-dialog-shadow);
}
.layout--float.layout__dockr {
  box-shadow: var(--b3-dialog-shadow);
}

/**数据库**/
.b3-chip--info {
  color: var(--b3-card-info-color);
  background-color: var(--b3-card-info-background);
}

/**隐藏元素**/
/* 隐藏题头图 */
.protyle-background__img img {
  /**  display: none;**/
}
/* 隐藏图标 */
.protyle-background__icon {
  /**  display: none;
**/
}
.b3-list-item__icon {
  display: var(--display-c);
}
/* 隐藏同步 */
#barSync {
  display: var(--display-c);
}
/*piggo插件*/
#plugin_siyuan-plugin-picgo_0 {
  display: var(--display-c);
}
/*搜索*/
#barSearch {
  display: var(--display-c);
}
/*命令*/
#barCommand {
  display: var(--display-c);
}
#plugin_siyuan-center-width_0 {
  display: var(--display-c);
}
#plugin_siyuan-plugins-index_0 {
  display: var(--display-c);
}
#plugin_plugin-add-shortcut-to-topbar_0 {
  display: var(--display-c);
}

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    22340 引用 • 89396 回帖 • 1 关注
3 操作
Adaxi 在 2024-05-08 23:45:41 更新了该帖
Adaxi 在 2024-05-08 23:31:55 更新了该帖
Adaxi 在 2024-05-08 23:08:23 更新了该帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • Adaxi
    作者

    谢谢提醒 我改一下

  • 其他回帖
  • Adaxi
    作者

    可以结合全屏功能和取消钉住面板的功能使用,效果更好。

    图片.png

    图片.png

  • Adaxi
    作者

    隐藏了一些图标,需要恢复直接搜索代码删除即可

    底部状态栏被隐藏,搜索如下代码可恢复。

    #status {
      display: none;
    }
    
    1 回复
  • 底部状态栏不是可以直接设置吗?这个就没必要用代码片段隐藏了吧

    image.png

    1 回复
  • 查看全部回帖

推荐标签 标签

  • jsoup

    jsoup 是一款 Java 的 HTML 解析器,可直接解析某个 URL 地址、HTML 文本内容。它提供了一套非常省力的 API,可通过 DOM,CSS 以及类似于 jQuery 的操作方法来取出和操作数据。

    6 引用 • 1 回帖 • 477 关注
  • 面试

    面试造航母,上班拧螺丝。多面试,少加班。

    325 引用 • 1395 回帖
  • Hadoop

    Hadoop 是由 Apache 基金会所开发的一个分布式系统基础架构。用户可以在不了解分布式底层细节的情况下,开发分布式程序。充分利用集群的威力进行高速运算和存储。

    86 引用 • 122 回帖 • 625 关注
  • Lute

    Lute 是一款结构化的 Markdown 引擎,支持 Go 和 JavaScript。

    25 引用 • 191 回帖 • 16 关注
  • 心情

    心是产生任何想法的源泉,心本体会陷入到对自己本体不能理解的状态中,因为心能产生任何想法,不能分出对错,不能分出自己。

    59 引用 • 369 回帖
  • SVN

    SVN 是 Subversion 的简称,是一个开放源代码的版本控制系统,相较于 RCS、CVS,它采用了分支管理系统,它的设计目标就是取代 CVS。

    29 引用 • 98 回帖 • 680 关注
  • SSL

    SSL(Secure Sockets Layer 安全套接层),及其继任者传输层安全(Transport Layer Security,TLS)是为网络通信提供安全及数据完整性的一种安全协议。TLS 与 SSL 在传输层对网络连接进行加密。

    70 引用 • 193 回帖 • 431 关注
  • Ubuntu

    Ubuntu(友帮拓、优般图、乌班图)是一个以桌面应用为主的 Linux 操作系统,其名称来自非洲南部祖鲁语或豪萨语的“ubuntu”一词,意思是“人性”、“我的存在是因为大家的存在”,是非洲传统的一种价值观,类似华人社会的“仁爱”思想。Ubuntu 的目标在于为一般用户提供一个最新的、同时又相当稳定的主要由自由软件构建而成的操作系统。

    125 引用 • 169 回帖 • 1 关注
  • Postman

    Postman 是一款简单好用的 HTTP API 调试工具。

    4 引用 • 3 回帖 • 2 关注
  • 游戏

    沉迷游戏伤身,强撸灰飞烟灭。

    176 引用 • 815 回帖
  • 禅道

    禅道是一款国产的开源项目管理软件,她的核心管理思想基于敏捷方法 scrum,内置了产品管理和项目管理,同时又根据国内研发现状补充了测试管理、计划管理、发布管理、文档管理、事务管理等功能,在一个软件中就可以将软件研发中的需求、任务、bug、用例、计划、发布等要素有序的跟踪管理起来,完整地覆盖了项目管理的核心流程。

    6 引用 • 15 回帖 • 113 关注
  • Ant-Design

    Ant Design 是服务于企业级产品的设计体系,基于确定和自然的设计价值观上的模块化解决方案,让设计者和开发者专注于更好的用户体验。

    17 引用 • 23 回帖
  • Maven

    Maven 是基于项目对象模型(POM)、通过一小段描述信息来管理项目的构建、报告和文档的软件项目管理工具。

    186 引用 • 318 回帖 • 303 关注
  • 百度

    百度(Nasdaq:BIDU)是全球最大的中文搜索引擎、最大的中文网站。2000 年 1 月由李彦宏创立于北京中关村,致力于向人们提供“简单,可依赖”的信息获取方式。“百度”二字源于中国宋朝词人辛弃疾的《青玉案·元夕》词句“众里寻他千百度”,象征着百度对中文信息检索技术的执著追求。

    63 引用 • 785 回帖 • 175 关注
  • 创业

    你比 99% 的人都优秀么?

    84 引用 • 1399 回帖
  • Vditor

    Vditor 是一款浏览器端的 Markdown 编辑器,支持所见即所得、即时渲染(类似 Typora)和分屏预览模式。它使用 TypeScript 实现,支持原生 JavaScript、Vue、React 和 Angular。

    351 引用 • 1814 回帖
  • 程序员

    程序员是从事程序开发、程序维护的专业人员。

    567 引用 • 3532 回帖
  • 资讯

    资讯是用户因为及时地获得它并利用它而能够在相对短的时间内给自己带来价值的信息,资讯有时效性和地域性。

    55 引用 • 85 回帖 • 2 关注
  • Node.js

    Node.js 是一个基于 Chrome JavaScript 运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动, 非阻塞 I/O 模型而得以轻量和高效。

    139 引用 • 269 回帖 • 43 关注
  • 开源中国

    开源中国是目前中国最大的开源技术社区。传播开源的理念,推广开源项目,为 IT 开发者提供了一个发现、使用、并交流开源技术的平台。目前开源中国社区已收录超过两万款开源软件。

    7 引用 • 86 回帖
  • Firefox

    Mozilla Firefox 中文俗称“火狐”(正式缩写为 Fx 或 fx,非正式缩写为 FF),是一个开源的网页浏览器,使用 Gecko 排版引擎,支持多种操作系统,如 Windows、OSX 及 Linux 等。

    8 引用 • 30 回帖 • 407 关注
  • Wide

    Wide 是一款基于 Web 的 Go 语言 IDE。通过浏览器就可以进行 Go 开发,并有代码自动完成、查看表达式、编译反馈、Lint、实时结果输出等功能。

    欢迎访问我们运维的实例: https://wide.b3log.org

    30 引用 • 218 回帖 • 628 关注
  • 负能量

    上帝为你关上了一扇门,然后就去睡觉了....努力不一定能成功,但不努力一定很轻松 (° ー °〃)

    88 引用 • 1235 回帖 • 411 关注
  • Rust

    Rust 是一门赋予每个人构建可靠且高效软件能力的语言。Rust 由 Mozilla 开发,最早发布于 2014 年 9 月。

    58 引用 • 22 回帖
  • 深度学习

    深度学习(Deep Learning)是机器学习的分支,是一种试图使用包含复杂结构或由多重非线性变换构成的多个处理层对数据进行高层抽象的算法。

    53 引用 • 40 回帖 • 2 关注
  • 学习

    “梦想从学习开始,事业从实践起步” —— 习近平

    169 引用 • 506 回帖
  • WebClipper

    Web Clipper 是一款浏览器剪藏扩展,它可以帮助你把网页内容剪藏到本地。

    3 引用 • 9 回帖