参照 obsidian-minimal 主题制作的 savor 主题代码片段

图片.png

图片.png

图片.png

图片.png

谢谢制作这两个主题的大佬(Roy 和 kepano)

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

:root {
    /* 主色 */
    --b3-theme-primary: #7E97A4 !important;
    --b3-theme-primary-light: #889eaa7f !important;
    --b3-theme-primary-lighter: #889eaa43 !important;
    --b3-theme-primary-lightest: #889eaa23 !important;
    --b3-theme-secondary: #889EAA !important;
    --b3-theme-secondary-light: #a0b2bb !important;
    --b3-theme-background: rgb(38, 38, 38) !important;
    --b3-theme-background-light: #36363681 !important;
    --b3-theme-surface: #212121 !important;
    --b3-theme-surface-light: #21212192 !important;
    --b3-theme-surface-lighter: #21212148 !important;
    --b3-theme-error:  #d04255c0 !important;

    /* 字体 */
    --b3-font-family: "更纱黑体 SC" !important;
    --b3-font-family-protyle: var(--b3-font-family);
    --b3-font-family-code: "更纱黑体 SC" !important;

    /* 文字颜色 */
    --b3-theme-on-primary: #ffffff !important;
    --b3-theme-on-secondary: #d1d1d1 !important;
    --b3-theme-on-background: #d1d1d1 !important;
    --b3-theme-on-surface: #999 !important;
    --b3-theme-on-surface-light: rgba(153, 153, 153, .8) !important;
    --b3-theme-on-error: #d1d1d1 !important;

    /* 线条 */
    --b3-border-color: #363636 !important;
    --b3-border-color2: #363636ad !important;

    /* 滚动条 */
    --b3-scroll-color: #363636 !important;
    --b3-scroll-color-hover: var(--S-list-background) !important;
    --b3-scroll-bgcolor: transparent !important;
    --b3-border-scroll: #ffffff33 !important;
    --webkit-scrollbar: 6px !important;
    --webkit-scrollbar-thumb: 4px !important;

    /* 图片工具栏 */
    --b3-tooltips-background:

    /* 列表 */
    --b3-list-color-hover: #8C8C8C1F ;
    --b3-list-color: #595959 ;
    --b3-list-color-hover: #5959598c ;

    /* 菜单 */
    --b3-menu-background: #27282a !important;

     /* 遮罩 */
    --b3-mask-background: #000000c7 !important;

    /* 卡片背景 */
    --b3-card-error-color: #d695957b !important;
    --b3-card-error-background: var(--b3-font-background13) !important;
    --b3-card-warning-color: rgba(255, 213, 153, 0.513) !important;
    --b3-card-warning-background: var(--b3-font-background5) !important;
    --b3-card-info-color: rgba(166, 214, 250, 0.496) !important;
    --b3-card-info-background: var(--b3-font-background10) !important;
    --b3-card-success-color: rgba(183, 223, 185, 0.467) !important;
    --b3-card-success-background: var(--b3-font-background8) !important;

    /* 自定义文字 */
    --b3-font-color1: #999 !important;
    --b3-font-color2: #6f7477 !important;
    --b3-font-color3: rgb(147, 114, 100) !important;
    --b3-font-color4: rgb(253, 162, 68) !important;
    --b3-font-color5: rgb(255, 184, 73) !important;
    --b3-font-color6: rgb(255, 220, 73) !important;
    --b3-font-color7: rgb(77, 171, 154) !important;
    --b3-font-color8: rgb(82, 178, 202) !important;
    --b3-font-color9: rgb(82, 156, 202) !important;
    --b3-font-color10: rgb(154, 109, 215) !important;
    --b3-font-color11: rgb(226, 85, 161) !important;
    --b3-font-color12: rgb(255, 115, 105) !important;
    --b3-font-color13: rgb(223, 84, 82) !important;

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

    /*callout*/
    --b3-bq-background1: rgb(35, 38, 40 , .3) !important;
    --b3-bq-background2: rgb(63, 68, 71 , .3) !important;
    --b3-bq-background3: rgb(69, 75, 78 , .3) !important;
    --b3-bq-background4: rgb(67, 64, 64 , .3) !important;
    --b3-bq-background5: rgb(89, 74, 58 , .3) !important;
    --b3-bq-background6: rgb(89, 79, 59 , .3) !important;
    --b3-bq-background7: rgb(89, 86, 59 , .3) !important;
    --b3-bq-background8: rgba(53, 76, 75 , .3) !important;
    --b3-bq-background9: rgb(54, 79, 84 , .3) !important;
    --b3-bq-background10: rgb(54, 73, 84 , .3) !important;
    --b3-bq-background11: rgb(68, 63, 87 , .3) !important;
    --b3-bq-background12: rgb(83, 59, 76 , .3) !important;
    --b3-bq-background13: rgb(89, 65, 65 , .3) !important;

    /* 动画效果 */
    --b3-transition: all .15s cubic-bezier(0, 0, .2, 1) 0ms !important;
    --b3-width-transition: width .15s cubic-bezier(0, 0, .2, 1) 0ms !important;

    /* 阴影 */
    --b3-point-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !important;
    --b3-dialog-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12) !important;
    --b3-menu-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 9px 24px !important;

    /* 图表颜色 */
    --b3-graph-p-point: #076f7e !important;
    --b3-graph-heading-point: #660e7a !important;
    --b3-graph-math-point: #80FFA5 !important;
    --b3-graph-code-point: #00DDFF !important;
    --b3-graph-table-point: #37A2FF !important;
    --b3-graph-list-point: #FF0087 !important;
    --b3-graph-todo-point: #FFBF00 !important;
    --b3-graph-olist-point: #b3005f !important;
    --b3-graph-listitem-point: #f65b00 !important;
    --b3-graph-bq-point: #8d48e3 !important;
    --b3-graph-super-point: #dd79ff !important;
    --b3-graph-doc-point: #202124 !important;
    --b3-graph-tag-point: #dbf32f !important;
    --b3-graph-asset-point: #05c091 !important;
    --b3-graph-line: #5f6368 !important;
    --b3-graph-ref-line: #d23f31 !important;
    --b3-graph-tag-line: #5f6b06 !important;
    --b3-graph-tag-tag-line: #dbf32f !important;
    --b3-graph-asset-line: #037457 !important;
    --b3-graph-hl-point: #f3a92f !important;
    --b3-graph-hl-line: #4285f4 !important;

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

    /* 代码片段背景 */
    --b3-protyle-code-background: var(--b3-theme-surface) !important;
    --b3-protyle-code-linenumber-hl: var(--b3-theme-surface) !important;

    /* 所见即所得行内元素颜色 */
    --b3-protyle-inline-strong-color: #d1d1d1 !important;
    --b3-protyle-inline-link-color: #889eaa !important;
    --b3-protyle-inline-mark-background: #32593c !important;
    --b3-protyle-inline-mark-color: #d1d1d1 !important;
    --b3-protyle-inline-tag-color: #9aa0a6 !important;
    --b3-protyle-inline-blockref-color: #9876aa !important;

    /* PDF */
    --b3-pdf-selection: #779170 !important;
    --b3-pdf-sidebar-width: 200px !important;
    --b3-pdf-offset: 0 !important;
    --b3-pdf-background1: var(--b3-font-background5) !important;
    --b3-pdf-background2: var(--b3-font-background6) !important;
    --b3-pdf-background3: var(--b3-font-background7) !important;
    --b3-pdf-background4: var(--b3-font-background8) !important;
    --b3-pdf-background5: var(--b3-font-background10) !important;
    --b3-pdf-background6: var(--b3-font-background11) !important;
    --b3-pdf-background7: var(--b3-font-background13) !important;

    /* 自定义结构配色 */
    /* 顶栏 */
    --S-toolbar-background: var(--b3-theme-surface) !important;
    --S-toolbar-blur-background: transparent !important;
    --S-toolbar-item-hover: rgba(255, 255, 255, 0.1) !important;
    --S-toolbar-barWorkspace-hover: var(--S-list-background) !important;
    --S-toolbar-closeWindow-hover: #e81123 !important;
    --S-toolbar-closeWindow-svg: #999 !important;

    /* dock栏 */
    --S-dock-color: #d1d1d1 !important;
    --S-dock-background: var(--b3-theme-surface) !important;
    --S-dockright-item-active-background: #8c8c8c1f !important;
    --S-dockleft-item-active-background: #8c8c8c1f !important;
    --S-dock-item-active-color: #8c8c8c1f !important;
    --S-dock-item-hover-background: #8c8c8c1f !important;

    /* 侧栏面板 */
    --S-fn__flex-column-background: var(--b3-theme-surface) !important;
    --S-fn__flex-shrink-background: var(--b3-theme-surface) !important;
    --S-block-logo-color: var(--b3-theme-on-background) !important;
    --S-block-logo-background-color: rgba(114, 118, 120) !important;
    --S-block-icon-svg-color: rgba(114, 118, 120) !important;
    --S-block-icon-hover: rgba(255, 255, 255, 0.1) !important;
    --S-block-icon-active: #eb8383 !important;
    --S-list-item-arrow: rgba(149, 152, 156) !important;
    --S-list-background: #8c8c8c1f!important;
    --S-list-background-focus: #8c8c8c1f !important;
    --S-list-background-activefocus: rgba(38, 38, 38, 0.15) !important;

    --b3-flex-column-padding: 6px 0px 2px 0px !important;
    --b3-list-item-radius: 3px !important;

    /* 大纲数字 */
    --h1-list-graphic: var(--b3-theme-on-background) !important;
    --h2-list-graphic: var(--b3-theme-on-background) !important;
    --h3-list-graphic: var(--b3-theme-on-background) !important;
    --h4-list-graphic: var(--b3-theme-on-background) !important;
    --h5-list-graphic: var(--b3-theme-on-background) !important;
    --h6-list-graphic: var(--b3-theme-on-background) !important;

    /* 线条 */
    --b3-layout-resize: var(--b3-border-color) !important;
    --b3-shrink-layout-resize: var(--b3-border-color)  !important;
    --b3-layout-resize-hover: var(--b3-scroll-color) !important;
    --flex-width-transition: width 150ms linear !important;/*调节宽度动画*/
    --b3-border-fold: var(--b3-border-color2) !important;/*折叠边框*/
    --b3-layout-resize-width: 1px !important;

    /* 页签 */
    --S-item-focus: rgba(255, 255, 255 ,0.2) !important;

    /* 面包屑 */
    --S-protyle-breadcrumb-arrow: rgba(174,172,166) !important;

    /* 头图按钮 */
    --S-icons-tooltips: var(--b3-theme-on-surface) !important;
    --S-icons-tooltips-hover: var(--b3-list-background) !important;
    --S-img-icons-tooltips: var(--b3-theme-on-surface) !important;
    --S-img-icons-tooltips-bg: var(--b3-theme-background) !important;
    --S-img-icons-span: rgba(255, 255, 255, .5) !important;

    /* 块标 */
    --b3-gutters-color: var(--b3-scroll-color) !important;
    --S-gutters-background: var(--b3-border-color) !important;

    /* 弹出工具条字体颜色选择 */
    --b3-color--square: var(--b3-border-color) !important;

    /* 任务列表 */
    --b3-task-done-color: var(--b3-scroll-color-hover) !important;
    --b3-task-done-hover: #069ccd !important;

    /* 引述 */
    --b3-bq-background: rgba(54, 59, 62) !important;

    /* 块引用 */
    --b3-block-ref-background: var(--S-toolbar-item-hover) !important;

  

    /* 代码块 */
    --S-linenumber-rows: rgba(61, 66, 69) !important;
    --S-code-block-hljs: var(--S-fn__flex-shrink-background) !important;

    /*行内代码*/
    --S-inline-code: var(--b3-theme-error) !important;

    /*按钮*/
    --b3-button: var(--b3-theme-primary) !important;

    /*pdf*/
    --b3-toolbarSidebar: #484d50 !important;

    /*导图*/
    --b3-border-daotu: 2px solid rgba(69, 74, 77) !important;
    --b3-block-daotu: var(--b3-theme-surface-light) !important;

    /*看板*/
    --kbline-boarditem-minwidth: 14rem !important;/*看板卡片的最小宽度*/
    --kb--li--background: rgba(55, 60, 63) !important;

    /*ctrlp*/
    --b3-list-item--meta: #ebebeb;

    /*底栏状态*/
    --S-status-msg-background:#404548;
    --S-status-barDock: var(--b3-theme-surface);
    --S-status-barDock-hover: #d4d4d4;
  
    /*数据库*/
    --S-font-color13: var(--b3-theme-on-background);
    --S-font-color12: var(--b3-theme-on-background);
    --S-font-color11: var(--b3-theme-on-background);
    --S-font-color10: var(--b3-theme-on-background);
    --S-font-color9: var(--b3-theme-on-background);
    --S-font-color8: var(--b3-theme-on-background);
    --S-font-color7: var(--b3-theme-on-background);
    --S-font-color6: var(--b3-theme-on-background);
    --S-font-color5: var(--b3-theme-on-background);
    --S-font-color4: var(--b3-theme-on-background);
    --S-font-color3: var(--b3-theme-on-background);
    --S-font-color2: var(--b3-theme-on-background);
    --S-font-color1: var(--b3-theme-on-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;


    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

}
body {
    /*主界面*/
    font-size: 13px !important;
    line-height: 1.5 !important;
}


/**-----------------------------------------------------------**/

/**段落行距**/
.b3-typography p, .b3-typography [data-node-id], .protyle-wysiwyg p, .protyle-wysiwyg [data-node-id] {
    line-height: 1.525 !important;
    padding: 4px 0 0 0 !important;
    margin: 2px 0 !important;
    border-radius: var(--b3-border-radius);
}
/**修正其导致的列表序号和文本不对齐**/
.protyle-wysiwyg [data-node-id].li>.protyle-action {
    top: 0.195rem !important;
}
.protyle-wysiwyg [data-node-id].li:before {
    top: 39px !important;
}

/* 列表序列标点*/
.protyle-wysiwyg [data-node-id].li[fold="1"]>.protyle-action:after, .protyle-wysiwyg [data-node-id].li>.protyle-action:hover:after {
    background-color: transparent !important;
}
.li[data-subtype="o"] .li[data-subtype="o"] .protyle-action::after {
    color: var(--b3-list-color) !important;
}
.protyle-wysiwyg [data-node-id].li>.protyle-action {
    color: rgba(255, 255, 255, 0.273) !important;
}
.protyle-wysiwyg [data-node-id].li>.protyle-action:hover {
    color: rgba(255, 255, 255, 0.415) !important; /* 鼠标移入时变亮 */
}

/* 列表序列线*/
.protyle-wysiwyg [data-node-id].li:before {
    left: 0;
    top: 35px;
    height: calc(100% - 39px);
    content: "\200B";
    display: block;
    width: 1px;
    border-left: 1px solid rgba(255, 255, 255, 0.273);
    color: transparent;
    position: absolute;
    bottom: 0px;
    transform: translateX(17px);
}
.protyle-wysiwyg [data-node-id].li:hover:before {
    /* 在鼠标移到元素上时,改变边框颜色,使其变亮 */
    border-left-color: rgba(255, 255, 255, 0.415); /* 增加边框的亮度 */
}


/* siyuan note 标记*/
/* 修改 #barWorkspace 的样式 */
#barWorkspace {
    height: 24px;
    border-radius: 6px;
    padding: 0 3px 0 8px;
    margin: 0px 3px 0px -1px;
    background-color: var(--b3-theme-surface) !important; /* 改为 button 样式中的颜色 */
    box-shadow: 0 4px 9px rgba(0, 0, 0, 0.05), 0 1.5px 2.8px rgba(0, 0, 0, 0.07), 0 0.3px 0.7px rgba(0, 0, 0, 0.12);
    /* 添加其他 button 样式的属性 */
    outline: none;
    border: none;
    transition: transform 0.5s ease-in-out; /* 添加动画过渡 */
}

/* 当鼠标悬停在 #barWorkspace 上时,触发动画效果 */
#barWorkspace:hover {
    background-color: var(--b3-theme-primary) !important;
    cursor: pointer;
    animation: jelly 0.5s; /* 应用 jelly 动画 */
}

/* jelly 动画的关键帧 */
@keyframes jelly {
    0%,
    100% {
        transform: scale(1, 1);
    }
    25% {
        transform: scale(0.9, 1.1);
    }
    50% {
        transform: scale(1.1, 0.9);
    }
    75% {
        transform: scale(0.95, 1.05);
    }
}




















.toolbar__text {
    color: var(--b3-theme-on-surface) !important;
}
.toolbar__text:hover {
    color: var(--b3-theme-on-background) !important;
}
.b3-menu__items {
    max-height: calc(100% - 40px);
    overflow: hidden;
    padding: 6px;
    border: 1px solid var(--b3-border-color);
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    z-index: 64;
    -webkit-app-region: no-drag;
    user-select: none;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.121), 0px 3.4px 6.7px rgba(0, 0, 0, 0.179), 0px 15px 30px rgba(0, 0, 0, 0.3);
}

/**快捷键**/
.b3-menu__accelerator {
    color: var(--b3-border-scroll);
    font-family: SF Pro Display !important;
}
.b3-menu__accelerator:hover {
    color: var(--b3-theme-on-background);
    font-family: SF Pro Display !important;
}
.b3-list-item__meta {
    color: var(--b3-border-scroll) !important;
    font-family: SF Pro Display !important;
}
.b3-list-item__meta:hover {
    color: var(--b3-theme-on-background);
    font-family: SF Pro Display !important;
}


/* 侧边栏-工具栏*/
.dock#dockLeft {
    border: 1px solid var(--b3-border-color2);
}


/* 文档计数*/
.b3-list-item .counter:not(:empty) {
    box-shadow: unset !important;
}

/* 引用块*/
.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) {
    font-size: 100%;
    padding: unset;
    color: var(--b3-theme-secondary);
    background-color: transparent;
    border-bottom: unset;
    opacity: 1;
    font-weight: 500;
}
.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-theme-secondary-light);
    border-bottom: unset !important;
    text-decoration-line: underline;
}

/**数据库表格**/
.av__container {
    cursor: ew-resize;
}
.av__row {
    display: flex;
    border-bottom: unset;
    position: relative;
    font-size: 87.5%;
    border: 1px solid var(--b3-border-color2);
}
.av__header {
    background: var(--b3-theme-surface);
    color: var(--b3-theme-on-surface);
    border: 1px solid var(--b3-border-color);
}
.av__body {
    background: var(--b3-theme-surface);
    color: var(--b3-theme-on-surface);
    border: 1px solid var(--b3-border-color);
}
.av__colsticky {
    background: var(--b3-theme-surface) !important;
    color: var(--b3-theme-on-surface);
    border: unset;
}
.av__row--footer {
    background: var(--b3-theme-surface);
    color: var(--b3-theme-on-surface);
    border: 1px solid var(--b3-border-color);
}
.av__celltext {
    background: var(--b3-theme-surface);
    color: var(--b3-theme-on-surface);
}
.av__cell--header {
    background: var(--b3-theme-surface);
    color: var(--b3-theme-on-surface);
    border-left: 2px solid var(--b3-border-color2);
}
.av__row--footer .av__calc {
    opacity: 0.2;
    border-right: 2px solid var(--b3-border-color);
}
.av__cell {
    padding: 8px 0px 0px 4px;
    border-left: 2px solid var(--b3-border-color2);
    overflow: hidden;
    text-overflow: ellipsis;
}

/**表格**/
table[contenteditable=true]+.protyle-action__table .table__resize::after {
    top: 1px;
    width: 2px;
    left: 2px;
    background: var(--b3-border-color);
    cursor: ew-resize;
}
.b3-typography table td, .b3-typography table th, .protyle-wysiwyg table td, .protyle-wysiwyg table th {
    padding: 4px 6px;
    border: 1px solid var(--b3-border-color);
    text-align: center;
}
.protyle-wysiwyg table tbody tr td {
    background-color: var(--b3-theme-background);
}

/* 引用块悬浮窗口*/
.block__popover>.block__icons>.resize__move {
    box-shadow: none !important;
    display: table-header-group;
}
.resize__t {
    height: 15px;
    cursor: ns-resize;
    left: 8px;
    right: 8px;
    top: -7px;
}
.resize__d {
    height: 15px;
    cursor: ns-resize;
    left: 8px;
    right: 8px;
    top: -7px;
}
.resize__r {
    width: 15px;
    cursor: ew-resize;
    top: 6px;
    left: -5px;
    bottom: 6px;
    border-radius: inherit;
}
.resize__l {
    width: 15px;
    cursor: ew-resize;
    top: 6px;
    left: -5px;
    bottom: 6px;
    border-radius: inherit;
}
.block__popover--open {
    border: 1px solid var(--b3-border-color2);
    box-shadow: rgb(95 95 95 / 21%) 0px 0px 7px 2px, rgb(16 16 16 / 35%) 0px 0px 20px 0px, rgb(15 15 15 / 40%) 0px 0px 6px 4px !important;
}
.block__popover>.block__icons>.resize__move {
    box-shadow: none !important;
    display: table-header-group;
    border-radius: 14px 0px 0px 0px;
    margin-left: -7px;
}

/**分割线**/
/* 选择 SiYuan 编辑区中的分割线伪元素 */
.protyle-wysiwyg [data-node-id].hr > div:after {
    position: absolute;
    content: ""; /* 空白内容 */
    height: 1px; /* 分割线的高度 */
    background-color: #ffffff33; /* 分割线的颜色 */
    width: calc(100% - 1px); /* 宽度为 div 宽度减去 1px */
    left: 0;
    top: 13px; /* 调整分割线的位置 */
    animation: blink 5s infinite; /* 应用闪烁动画,持续时间为 5 秒,循环 */
}

/* 定义闪烁动画 */
@keyframes blink {
    0%, 100% {
        opacity: 1; /* 动画开始和结束时的透明度为1(完全不透明) */
    }
    50% {
        opacity: 0.4; /* 动画进行到一半时的透明度为0(完全透明) */
    }
}


/**加粗**/
.b3-typography strong, .b3-typography span[data-type~=strong], .protyle-wysiwyg strong, .protyle-wysiwyg span[data-type~=strong] {
    font-weight: bold;
    color: inherit !important;
}

/**倾斜**/
.b3-typography em, .b3-typography span[data-type~=em], .protyle-wysiwyg em, .protyle-wysiwyg span[data-type~=em] {
    font-style: italic;
    color: inherit !important;
}

/**删除线**/
.b3-typography s, .b3-typography span[data-type~=s], .protyle-wysiwyg s, .protyle-wysiwyg span[data-type~=s] {
    color: inherit !important;
    text-decoration: line-through;
}

/* 超链接*/
.protyle-wysiwyg [data-node-id] span[data-type~=a] {
    color: var(--b3-theme-secondary);
    border-bottom: unset;
    font-weight: 500;
}
.protyle-wysiwyg [data-node-id] span[data-type~=a]:hover {
    color: var(--b3-theme-secondary-light);
    border-bottom: unset !important;
    text-decoration-line: underline;
    text-decoration-line-
    font-weight: 500;
}

#tooltip.tooltip{
    background: black;
    color: white;
}
.b3-snackbar__content{
    background: black !important;
    color: white !important;
}

/* 反链计数*/
.protyle-attr--refcount {
    background-color: transparent;
}


/**行内备注**/
/* 定义行内备注的样式 */
.b3-typography span[data-type~=inline-memo], .protyle-wysiwyg span[data-type~=inline-memo] {
    /* 设置背景颜色以突出显示行内备注 */
    background-color: var(--b3-theme-primary-light);
  
    /* 为行内备注添加点状边框 */
    border-bottom: 1px dashed var(--b3-theme-primary);
  
    /* 添加一定的内边距,使内容与背景色区分 */
    padding: 0 2px;
  
    /* 设置文字颜色以与整体界面匹配 */
    color: var(--b3-theme-on-surface);
  
    /* 添加过渡效果 */
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
  
    /* 鼠标悬停时改变备注的外观 */
    &:hover {
        background-color: var(--b3-theme-primary-lightest);
        color: var(--b3-theme-on-background);
    }
}


/* 行内代码*/
.fn__code, .b3-typography code:not(.hljs), .b3-typography span[data-type~=code], .protyle-wysiwyg code:not(.hljs), .protyle-wysiwyg span[data-type~=code] {
    background-color: #ffffffa6;
    border: 1px solid var(--b3-border-color);
    border-radius: 3px;
    font-family: SF Pro Display;
    padding: 0 0.3em;
    color: #000;
    transition: background-color 0.3s ease-in-out;
}


.b3-button--outline, .b3-button:not(.b3-button--cancel):not([data-type="av-add-bottom"]), #searchInclude.b3-button:not(.b3-button--cancel) {
    background-color: var(--b3-button);
    color: var(--b3-theme-on-primary);
}

/* 主菜单下啦菜单按钮*/
.b3-select {
    background-color: var(--b3-theme-surface);
    box-shadow: inset 0 0.5px 1px 0.5px rgba(255, 255, 255, 0.16), 0 2px 3px 0 rgba(0,0,0,.3), 0 1px 1.5px 0 rgba(0,0,0,.2), 0 1px 2px 0 rgba(0,0,0,.4), 0 0 0 0 transparent !important;
}
.b3-select:hover {
    background-color: #363636;
    box-shadow: inset 0 0.5px 1px 0.5px rgba(255, 255, 255, 0.16), 0 2px 3px 0 rgba(0,0,0,.3), 0 1px 1.5px 0 rgba(0,0,0,.2), 0 1px 2px 0 rgba(0,0,0,.4), 0 0 0 0 transparent !important;
}
.b3-text-field:not(.b3-text-field--text):focus, .pcr-app .pcr-interaction .pcr-result:not(.b3-text-field--text):focus {
    box-shadow: inset 0 0 0 1px var(--b3-theme-primary-light);
}

/**斜杠/菜单**/
.hint--menu {
    animation: menu 0.2s ease-in-out;
    box-shadow: var(--b3-menu-shadow);
    background-color: var(--b3-theme-background);
    padding: 1px;
    border: 1px solid var(--b3-border-color2);
    min-width: 42vw;
    border-radius: 6px;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.121), 0px 3.4px 6.7px rgba(0, 0, 0, 0.179), 0px 15px 30px rgba(0, 0, 0, 0.3);
    min-height: 29vw;
}


/* 编辑框内容 */
.b3-text-field:not(.b3-text-field--text):hover, .pcr-app .pcr-interaction .pcr-result:not(.b3-text-field--text):hover {
    box-shadow: inset 0 0 0 1px var(--b3-border-color);
}

/* 状态栏*/
#status {
    background-color: var(--b3-theme-background);
}
.status__counter:not(:empty) {
    background-color: var(--b3-theme-surface);
}
.ft__on-surface {
    color: #9999998f;
}
.ft__on-surface:hover {
    color: #cacaca;
    background: var(--b3-theme-background);
}
.status__counter {
    color: #999;
}
.status__counter:hover {
    color: #d8d8d8;
    background: var(--b3-theme-background);
}

/* dock栏图标 */
.dock#dockLeft .dock__item--active {
    color: var(--b3-theme-on-background);
    background-color: var(--b3-theme-primary-lightest);
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12);
    top: 2px;
    right: 2px;
}
.status #barDock {
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(49, 49, 49, 0.052);
    opacity: 0.6;
}
.dock__item--activefocus {
    background-color: var(--b3-theme-primary-lightest)!important;
    color: var(--b3-theme-on-background);
}
.dock#dockRight .dock__item--active {
    color: var(--b3-theme-on-background);
    background-color: var(--b3-theme-primary-lightest);
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12);
}

/* 反链面板*/
.sy__backlink.layout__tab--active  .block__icons .counter {
    background-color: transparent;
    color: var(--b3-theme-on-background);
}
.sy__backlink .block__icons .counter {
    position: static;
    color: var(--b3-theme-on-surface);
    background-color: transparent;
    text-align: left;
    border-radius: 4px;
}

/* 标签 */
.protyle-wysiwyg span[data-type="tag"] {
    font-size: 100%;
    border-radius: unset;
    padding: unset;
    color: var(--b3-theme-secondary) !important;
    border-bottom: none !important;
    background-color: unset;
}
.protyle-wysiwyg span[data-type="tag"]:hover {
    color: var(--b3-theme-secondary-light) !important;
    border-bottom: unset !important;
    text-decoration-line: underline;
}

/* 退出聚焦 */
.protyle-breadcrumb__icon[data-type="exit-focus"] {
    background-color: var(--b3-theme-secondary) !important;
    color: var(--b3-theme-on-primary) !important;
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12);
}
.protyle-breadcrumb__icon[data-type="exit-focus"]:hover {
    background-color: var(--b3-theme-secondary-light) !important;
    color: var(--b3-theme-on-primary) !important;
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12);
}
.protyle-breadcrumb__item:not(:first-child).protyle-breadcrumb__item--active>svg {
    background-color: var(--b3-theme-secondary) !important;
    color: var(--b3-theme-on-primary) !important;
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12);
}
.protyle-breadcrumb__item:not(:first-child).protyle-breadcrumb__item--active>svg:hover {
    background-color: var(--b3-theme-secondary) !important;
    color: var(--b3-theme-on-primary) !important;
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12);
}

/* 固定标签 */
.layout-tab-bar .item--pin:nth-child(4n-3) {
    background-color: var(--b3-theme-surface) !important;
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.15), /* 更大的垂直偏移和透明度 */
    0 3px 5px rgba(0, 0, 0, 0.12), /* 增加模糊程度和透明度 */
    0 1px 1.5px rgba(0, 0, 0, 0.1); /* 更明显的阴影 */
}
.layout-tab-bar .item--pin:nth-child(4n-3):hover {
    background-color: var(--b3-theme-primary-light) !important;
    box-shadow: 0 12px 18px rgba(0, 0, 0, 0.25), /* 更大的垂直偏移量和透明度 */
    0 6px 10px rgba(0, 0, 0, 0.2), /* 更高的模糊程度和透明度 */
    0 2px 3px rgba(0, 0, 0, 0.15); /* 更明显的阴影 */
    transform: translateY(-4px);
}
/* 钉住添加图标 */
.item.item--pin::before {
    content: '📌';
    position: absolute;
    top: -7px;
    right: -6px;
    width: 14px;
    font-size: 0.9em;
    opacity: 0.7;
}

/* 标签下划线标记*/
.layout__wnd--active .layout-tab-bar .item--focus::after {
    background-color: var(--b3-theme-primary);
}
/* 标签多余的内容省略*/
.layout__wnd--active .layout-tab-bar .item--focus>.item__text {
    color: var(--b3-theme-on-background);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* 搜索框的初始样式 */
.b3-text-field:not(#searchInput):not(.fn__block):not(.fn__size200):not(#simpleSearchInput) {
    background-color: var(--b3-theme-background) !important;
    border: 1px solid var(--b3-border-color) !important;
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12) !important;
}
/* 鼠标悬停在搜索框上时的样式 */
.b3-text-field:not(#searchInput):not(.fn__block):not(.fn__size200):not(#simpleSearchInput):hover {
    background-color: var(--b3-theme-surface) !important; /* 改变背景颜色 */
    border: 1px solid var(--b3-border-color) !important; /* 改变边框颜色 */
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12) !important;
}
.layout-tab-bar .item--unupdate:not(.item--pin) {
    font-style: normal;
    color: var(--b3-theme-on-surface);
    font-size: 14px;
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12) !important;
}



/*主菜单搜索框*/
.b3-dialog__container .config__panel>.b3-tab-bar .b3-text-field:focus {
    background-color: var(--b3-theme-background) !important;
    border: 1px solid var(--b3-border-color) !important;
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12) !important;
}
.b3-dialog__container .config__panel>.b3-tab-bar .b3-text-field:focus:hover {
    background-color: var(--b3-theme-surface) !important; /* 改变背景颜色 */
    border: 1px solid var(--b3-border-color) !important; /* 改变边框颜色 */
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12) !important;
}


.b3-text-field:not(.b3-text-field--text):focus, .pcr-app .pcr-interaction .pcr-result:not(.b3-text-field--text):focus {
    background-color: var(--b3-theme-background) !important;
    border: 1px solid var(--b3-border-color) !important;
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12) !important;
}
.b3-text-field:not(.b3-text-field--text):focus, .pcr-app .pcr-interaction .pcr-result:not(.b3-text-field--text):focus:hover {
    background-color: var(--b3-theme-surface) !important; /* 改变背景颜色 */
    border: 1px solid var(--b3-border-color) !important; /* 改变边框颜色 */
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12) !important;
}

/*底部状态栏切换按钮*/
.b3-switch:checked {
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12) !important;
}

/* 商店卡片 */
.b3-card--current {
    box-shadow: unset;
}

/*嵌入块*/
.protyle-wysiwyg [data-node-id].render-node[data-type="NodeBlockQueryEmbed"] {
    background-color: var(--b3-theme-surface);
    font-style: inherit !important;
    border-left: 2px solid #99999982 !important;
    box-shadow: 0 4px 9px rgb(0 0 0 / 15%), 0 1.5px 5px 2px rgb(28 28 28 / 16%), 0 0.3px 0.7px rgb(0 0 0 / 25%) !important;
    border-right: 2px solid #99999982 !important;
    border-radius: 6px 6px !important;
    padding: 6px 4px 0px 10px !important;
}

/*引用*/
.protyle-wysiwyg .bq {
    font-style: normal !important;
    border-left: 1px solid #9999999c;
    background-color: transparent !important;
    box-shadow: 0 4px 9px rgba(0,0,0,.05), 0 1.5px 2.8px rgba(0,0,0,.07), 0 0.3px 0.7px rgba(0,0,0,.12) !important;
    color: var(--b3-theme-on-surface);
    margin: auto;
    position: relative;
    padding: 0px !important;
    text-indent: inherit;
    padding-inline-start: 16px !important;
    max-width: 100%;
    width: 66rem;
    margin-inline: auto !important;
}

/*标题字体*/
.protyle-title__input {
    font-size: 1.45em !important;
}
.protyle-wysiwyg .h1, .protyle-wysiwyg .h2, .protyle-wysiwyg .h3, .protyle-wysiwyg .h4, .protyle-wysiwyg .h5, .protyle-wysiwyg .h6 {
    margin-top: 1em;
    margin-bottom: 0.2em;
}
.b3-typography .h1, .b3-typography h1, .protyle-wysiwyg .h1, .protyle-wysiwyg h1 {
    padding: 0em 0px;
    font-size: 1.4em;
}
.b3-typography .h2, .b3-typography h2, .protyle-wysiwyg .h2, .protyle-wysiwyg h2 {
    padding: 0em 0px;
    font-size: 1.3em;
}
.b3-typography .h3, .b3-typography h3, .protyle-wysiwyg .h3, .protyle-wysiwyg h3 {
    padding: 0em 0px;
    font-size: 1.2em;
}
.b3-typography .h4, .b3-typography h4, .protyle-wysiwyg .h4, .protyle-wysiwyg h4 {
    padding: 0em 0px;
    font-size: 1.1em;
}
.b3-typography .h5, .b3-typography h5, .protyle-wysiwyg .h5, .protyle-wysiwyg h5 {
    padding: 0em 0px;
    font-size: 1.05em;
}
.b3-typography .h6, .b3-typography h6, .protyle-wysiwyg .h6, .protyle-wysiwyg h6 {
    padding: 0em 0px;
    font-size: 1em;
}

/* 图片样式 */
.protyle-wysiwyg img {
    opacity: 0.7;
    transition: opacity .25s linear;
}
.protyle-wysiwyg img:hover {
    opacity: 1;
    transition: opacity .25s linear;
}


/* 图片工具栏 */
.viewer-toolbar>ul>li {
    background-color: var(--b3-theme-primary);
}
.viewer-zoom-in svg, .viewer-zoom-out svg, .viewer-one-to-one svg, .viewer-reset svg, .viewer-prev svg, .viewer-play svg, .viewer-next svg, .viewer-rotate-left svg, .viewer-rotate-right svg, .viewer-flip-horizontal svg, .viewer-flip-vertical svg, .viewer-fullscreen svg, .viewer-fullscreen-exit svg, .viewer-close svg {
    color: var(--b3-theme-on-primary);
}
.protyle-action__drag {
    background-color: var(--b3-theme-primary-light) !important;
}
.protyle-action__drag:hover {
    background-color: var(--b3-theme-primary) !important;
}

.protyle-wysiwyg [data-node-id] .img .protyle-action__drag {
    height: 30%;
    width: 6px;
    background: var(--b3-theme-surface);
    display: none;
    border-radius: unset;
    cursor: col-resize;
    transition: var(--b3-transition);
    position: absolute;
    top: 35%;
    margin-left: 2px;
    box-shadow: unset;
    box-sizing: border-box;
    z-index: 1;
}
.protyle-wysiwyg [data-node-id] .img .protyle-action__drag:hover {
    background-color: var(--b3-theme-background);
  
    /* 定义一个多层次的 box-shadow */
    box-shadow: 
        0 2px 4px rgba(0, 0, 0, 0.15), /* 轻微的阴影,使按钮稍微突出 */
        0 4px 8px rgba(0, 0, 0, 0.10), /* 中等深度的阴影,增强立体感 */
        0 1px 2px rgba(0, 0, 0, 0.25); /* 深度的阴影,增加对比度 */
  
    /* 您可以根据需要调整其他样式属性 */
    cursor: ew-resize; /* 适当调整光标样式 */
}

/* 块悬浮标记 */
.protyle-gutters button {
    background: transparent;
}
.protyle-gutters button svg {
    color: var(--b3-list-color) !important;
}
.protyle-gutters button svg:hover {
    color: var(--b3-list-color) !important;
}

/* 编辑区文字弹出工具条 */
.protyle-toolbar {
    animation: toolbar 0.2s ease-in-out;
    border: 1px solid var(--b3-border-color2);
    box-shadow: #36363638 0px 0px 0px 1px, #36363629 0px 3px 6px, #3636363d 0px 9px 24px;
}

/**文件树标签名称**/
.block__logo svg {
    color: var(--b3-theme-on-surface);
}
.block__logo svg:hover {
    color: var(--b3-theme-on-background);
}

.file-tree .block__icons {
    color: var(--b3-theme-on-surface);
}
.file-tree .block__icons:hover {
    color: var(--b3-theme-on-background);
}
.b3-list-item--focus .b3-list-item__text {
    color: #d1d1d1e3 !important;
}

/**标记**/
.b3-typography mark, .b3-typography span[data-type~=mark], .protyle-wysiwyg mark, .protyle-wysiwyg span[data-type~=mark] {
    background: transparent !important;
    border-bottom: 2px solid rgb(255, 212, 0);
    font-weight: 500;
}


/**callout**/
.bq[custom-b~=bell]::after {
    left: -1.1em;
}
.bq[custom-b~=warn]::after {
    left: -1.1em;
}
.bq[custom-b~=error]::after {
    left: -1.1em;
}
.bq[custom-b~=bug]::after {
	left: -1.1em;em;
}
.bq[custom-b~=check]::after {
	left:-1.1em;
}
.bq[custom-b~=light]::after {
	left:-1.1em;
}
.bq[custom-b~=question]::after {
	left:-1.1em;
}
.bq[custom-b~=wrong]::after {
	left:-1.1em;
}
.bq[custom-b~=info]::after {
	left:-1.1em;
}
.bq[custom-b~=pen]::after {
	left:-1.1em;
}
.bq[custom-b~=note]::after {
	left:-1.1em;
}
.bq[custom-b~=bell]::after {
    left: -1.1em;
}
.protyle-wysiwyg .bq {
    box-shadow: 0 4px 9px rgb(0 0 0 / 15%), 0 1.5px 5px 2px rgb(28 28 28 / 16%), 0 0.3px 0.7px rgb(0 0 0 / 25%) !important;
}

/**行内快捷键**/
.b3-typography kbd, .b3-typography span[data-type~=kbd], .protyle-wysiwyg kbd, .protyle-wysiwyg span[data-type~=kbd] {
    font-family: 75% sl pro display;
}




  • 思源笔记

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

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

    19628 引用 • 74910 回帖
  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    184 引用 • 458 回帖 • 5 关注
4 操作
Adaxi 在 2024-05-07 15:59:43 更新了该帖
Adaxi 在 2024-05-07 02:31:37 更新了该帖
Adaxi 在 2024-05-06 22:35:16 更新了该帖
Adaxi 在 2024-05-06 20:15:45 更新了该帖

相关帖子

欢迎来到这里!

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

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

    本人能力有限,期待着有能力的同志可以做一个这类极简的主题。

推荐标签 标签

  • Vue.js

    Vue.js(读音 /vju ː/,类似于 view)是一个构建数据驱动的 Web 界面库。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

    262 引用 • 664 回帖 • 1 关注
  • 新人

    让我们欢迎这对新人。哦,不好意思说错了,让我们欢迎这位新人!
    新手上路,请谨慎驾驶!

    51 引用 • 226 回帖
  • Windows

    Microsoft Windows 是美国微软公司研发的一套操作系统,它问世于 1985 年,起初仅仅是 Microsoft-DOS 模拟环境,后续的系统版本由于微软不断的更新升级,不但易用,也慢慢的成为家家户户人们最喜爱的操作系统。

    215 引用 • 463 回帖
  • 七牛云

    七牛云是国内领先的企业级公有云服务商,致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景,七牛先后推出了对象存储,融合 CDN 加速,数据通用处理,内容反垃圾服务,以及直播云服务等。

    26 引用 • 222 回帖 • 164 关注
  • 电影

    这是一个不能说的秘密。

    120 引用 • 597 回帖 • 1 关注
  • JavaScript

    JavaScript 一种动态类型、弱类型、基于原型的直译式脚本语言,内置支持类型。它的解释器被称为 JavaScript 引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在 HTML 网页上使用,用来给 HTML 网页增加动态功能。

    713 引用 • 1174 回帖 • 131 关注
  • Node.js

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

    138 引用 • 268 回帖 • 152 关注
  • RIP

    愿逝者安息!

    8 引用 • 92 回帖 • 310 关注
  • SEO

    发布对别人有帮助的原创内容是最好的 SEO 方式。

    35 引用 • 200 回帖 • 29 关注
  • MySQL

    MySQL 是一个关系型数据库管理系统,由瑞典 MySQL AB 公司开发,目前属于 Oracle 公司。MySQL 是最流行的关系型数据库管理系统之一。

    675 引用 • 535 回帖
  • LeetCode

    LeetCode(力扣)是一个全球极客挚爱的高质量技术成长平台,想要学习和提升专业能力从这里开始,充足技术干货等你来啃,轻松拿下 Dream Offer!

    209 引用 • 72 回帖
  • Ant-Design

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

    17 引用 • 23 回帖 • 4 关注
  • Hexo

    Hexo 是一款快速、简洁且高效的博客框架,使用 Node.js 编写。

    21 引用 • 140 回帖 • 17 关注
  • iOS

    iOS 是由苹果公司开发的移动操作系统,最早于 2007 年 1 月 9 日的 Macworld 大会上公布这个系统,最初是设计给 iPhone 使用的,后来陆续套用到 iPod touch、iPad 以及 Apple TV 等产品上。iOS 与苹果的 Mac OS X 操作系统一样,属于类 Unix 的商业操作系统。

    84 引用 • 139 回帖 • 1 关注
  • 导航

    各种网址链接、内容导航。

    37 引用 • 168 回帖
  • 游戏

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

    170 引用 • 813 回帖
  • Dubbo

    Dubbo 是一个分布式服务框架,致力于提供高性能和透明化的 RPC 远程服务调用方案,是 [阿里巴巴] SOA 服务化治理方案的核心框架,每天为 2,000+ 个服务提供 3,000,000,000+ 次访问量支持,并被广泛应用于阿里巴巴集团的各成员站点。

    60 引用 • 82 回帖 • 610 关注
  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    184 引用 • 458 回帖 • 5 关注
  • OpenStack

    OpenStack 是一个云操作系统,通过数据中心可控制大型的计算、存储、网络等资源池。所有的管理通过前端界面管理员就可以完成,同样也可以通过 Web 接口让最终用户部署资源。

    10 引用 • 2 关注
  • 知乎

    知乎是网络问答社区,连接各行各业的用户。用户分享着彼此的知识、经验和见解,为中文互联网源源不断地提供多种多样的信息。

    10 引用 • 66 回帖
  • 30Seconds

    📙 前端知识精选集,包含 HTML、CSS、JavaScript、React、Node、安全等方面,每天仅需 30 秒。

    • 精选常见面试题,帮助您准备下一次面试
    • 精选常见交互,帮助您拥有简洁酷炫的站点
    • 精选有用的 React 片段,帮助你获取最佳实践
    • 精选常见代码集,帮助您提高打码效率
    • 整理前端界的最新资讯,邀您一同探索新世界
    488 引用 • 383 回帖 • 3 关注
  • Laravel

    Laravel 是一套简洁、优雅的 PHP Web 开发框架。它采用 MVC 设计,是一款崇尚开发效率的全栈框架。

    19 引用 • 23 回帖 • 698 关注
  • 以太坊

    以太坊(Ethereum)并不是一个机构,而是一款能够在区块链上实现智能合约、开源的底层系统。以太坊是一个平台和一种编程语言 Solidity,使开发人员能够建立和发布下一代去中心化应用。 以太坊可以用来编程、分散、担保和交易任何事物:投票、域名、金融交易所、众筹、公司管理、合同和知识产权等等。

    34 引用 • 367 回帖
  • 国际化

    i18n(其来源是英文单词 internationalization 的首末字符 i 和 n,18 为中间的字符数)是“国际化”的简称。对程序来说,国际化是指在不修改代码的情况下,能根据不同语言及地区显示相应的界面。

    7 引用 • 26 回帖 • 1 关注
  • Vditor

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

    327 引用 • 1702 回帖
  • RabbitMQ

    RabbitMQ 是一个开源的 AMQP 实现,服务器端用 Erlang 语言编写,支持多种语言客户端,如:Python、Ruby、.NET、Java、C、PHP、ActionScript 等。用于在分布式系统中存储转发消息,在易用性、扩展性、高可用性等方面表现不俗。

    49 引用 • 60 回帖 • 404 关注
  • PWL

    组织简介

    用爱发电 (Programming With Love) 是一个以开源精神为核心的民间开源爱好者技术组织,“用爱发电”象征开源与贡献精神,加入组织,代表你将遵守组织的“个人开源爱好者”的各项条款。申请加入:用爱发电组织邀请帖
    用爱发电组织官网:https://programmingwithlove.stackoverflow.wiki/

    用爱发电组织的核心驱动力:

    • 遵守开源守则,体现开源&贡献精神:以分享为目的,拒绝非法牟利。
    • 自我保护:使用适当的 License 保护自己的原创作品。
    • 尊重他人:不以各种理由、各种漏洞进行未经允许的抄袭、散播、洩露;以礼相待,尊重所有对社区做出贡献的开发者;通过他人的分享习得知识,要留下足迹,表示感谢。
    • 热爱编程、热爱学习:加入组织,热爱编程是首当其要的。我们欢迎热爱讨论、分享、提问的朋友,也同样欢迎默默成就的朋友。
    • 倾听:正确并恳切对待、处理问题与建议,及时修复开源项目的 Bug ,及时与反馈者沟通。不抬杠、不无视、不辱骂。
    • 平视:不诋毁、轻视、嘲讽其他开发者,主动提出建议、施以帮助,以和谐为本。只要他人肯努力,你也可能会被昔日小看的人所超越,所以请保持谦虚。
    • 乐观且活跃:你的努力决定了你的高度。不要放弃,多年后回头俯瞰,才会发现自己已经成就往日所仰望的水平。积极地将项目开源,帮助他人学习、改进,自己也会获得相应的提升、成就与成就感。
    1 引用 • 487 回帖 • 1 关注