theme.css

/* this is a theme.css file for siyuan */

:root{
    font-size: calc(1rem + 0.25vw);    
    --b3-theme-primary: hsl(163.28deg 54.79% 47.41%);
    --b3-theme-primary-light: hsl(162.14deg 55.01% 54.84% / 72%);
    --b3-theme-primary-lighter: hsl(169.89deg 86.18% 57.45% / 48%);
    --b3-theme-primary-lightest: rgb(53 240 224 / 16%);
    --b3-card-success-background: #2C7866;
    --b3-card-info-background:#23ACEB;
    --b3-theme-background:#000;
    --b3-theme-on-background: #000
    --b3-theme-surface: #202734;
    --b3-protyle-inline-blockref-color: #2fffe4;
    --b3-border-color: #93eace3d;
    --b3-theme-on-surface-light: #96f6c8;
    --b3-protyle-code-background:#13212b;
    --b3-toolbar-blur-background: var(--b3-toolbar-background);

    --b3-tooltips-background: #111e28;
    --b3-tooltips-color: #96f6c8c4;
    --b3-protyle-inline-link-color: #91d9eb;

    --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: var(--b3-protyle-inline-blockref-color);
    --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: #55b0ff;

    --b3-border-radius: 0.2em;
    --b3-border-radius-b: 5px;
    --b3-dialog-shadow: 0 0px 0px 2px #4be7c696, 0 0 26px 3px #6cc0ae70;
}

.fn__flex.fn__flex-1>.fn__flex{
    background-color: #000 !important;
}


body{
    color:#fff;
}

#toolbar,#status,.dock{
    background-color: #000 !important;
}


.protyle{
    font-family: Helvetica;
    font-size: 0.9rem !important;
}


.protyle-wysiwyg [data-node-id] span[data-type~=block-ref], .protyle-wysiwyg [data-node-id] span[data-type~=file-annotation-ref] {
    filter: drop-shadow(0.1em 0.1em 0.28em #00ffff99);
    font-size: 0.8rem !important;
}


.layout__resize:after {
    filter: drop-shadow(0px 0px 3px rgb(0, 255, 131));
}

.layout__wnd--active .layout-tab-bar .item--focus:after {
    background-color: #49d0b7;
}


.fn__flex.fn__flex-1>.fn__flex{
    background-color: #202734 ;
}
.layout-tab-bar{
    background-color: #000 !important;
}


[data-type="NodeHeading"]>[spellcheck]{
    background: linear-gradient(to bottom, #31a59a, #3ffdcb);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    caret-color: #3ad1cc;
    text-shadow: none !important;
}

.protyle-title__input {
    color: #45dea4;
    -webkit-text-stroke: 3px transparent;
    background: linear-gradient(0deg,#026565,#5a9c9a);
    -webkit-background-clip: text;
    filter: drop-shadow(0px 4px 6px #06312699);
    font-weight: 500;
    font-size: 0.8rem !important;
}

.protyle-wysiwyg [data-node-id][custom-riff-decks] {
    box-shadow: none !important;
}
.b3-typography mark, .b3-typography span[data-type~=mark], .protyle-wysiwyg mark, .protyle-wysiwyg span[data-type~=mark]{
    background-color: transparent !important;
    text-shadow: none !important;
    color: #21FFC4;
    font-size: 0.8rem !important;
}

.protyle-title__input{
    text-align: left;
}


.item:has(.item__close) {
    padding: 0.2em 1em 0.1em 1em;
}


.item.item--focus::after{
    background-color: transparent !important;
}


.item{
    padding-top: 0.1em;
    padding-bottom: 0.1em;
    font-size: 0.8rem !important;
}


.item.item--focus::before{
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-width: 0 0 0 0;
    border-style: solid;
    border-image-source: url("./src/border.png");
    border-image-slice: 18% 15% 18% 15%;
    border-image-width: 1rem;
    z-index: 3;
    filter: drop-shadow(2px 4px 6px cyan) opacity(0.9) blur(0.3px);
}

.fn__flex .item.item--focus:not(.fn__flex.layout__wnd--active .item.item--focus):before{
    filter: drop-shadow(2px 4px 6px rgba(0, 255, 255, 0.648)) opacity(0.5) blur(0.3px);
}

.layout-tab-bar .item{
    overflow: visible;
    font-size: 0.8rem !important;
    margin:auto;
}
.layout{
    overflow-y: visible;
}
.layout-tab-bar, .layout-tab-container{
    overflow: visible;
    background-color: #000;
}
.layout-tab-bar .item, .layout-tab-container .item{
    border: 1px solid #65f1d633;
    box-shadow: 4px 4px 4px #43d1b455;
    scale:0.66;
}

.layout-tab-bar .item span {
    color: white !important;
}

.protyle-title {
    margin-bottom: 1em !important;
}





.layout__center.fn__flex.fn__flex-1>.fn__flex-1.fn__flex{
    overflow-x: hidden;
    overflow-y: visible;
}

.protyle-gutters button:hover svg, .av__gutters button:hover svg {
    color: #c8f3ff;
    filter: drop-shadow(0px 0px 8px #0fff9d);
    
}
.protyle-gutters button, .av__gutters button{
/*    top:-.65rem !important;*/
}

.tooltip {
    padding: 0.6em 0.8em;
    line-height: 1.2em;
    box-shadow: 0px 0px 3px -1px #00ffc3;
}


.item.item--pin::after {
    content: "";
    height: 50%;
    width: 100%;
    position: absolute;
    left: 0.6em;
    top: -15%;
    background-image: url("./src/chains.png");
    background-size: contain;
    background-repeat: no-repeat;
    border-radius: 0;
    filter: hue-rotate(355deg) brightness(1.2);
}
.layout__wnd--active .item.item--pin.item--focus::after{
    left: 20%;
    bottom: 70%;
}
/* -------- 有序列表、无序列表 -------- */
[data-node-id].p + [data-node-id].list {
  padding: 0;
  margin: 4px 0 4px 0; /* 如果列表上方需要紧凑，就把这一个值改为-2 */
}
.protyle-wysiwyg [data-node-id].li {
  min-height: 0px !important;
  padding: 0;
  margin: 0;
}
/* 序号（有序列表）或圆点（无序列表） */
.protyle-wysiwyg [data-node-id].li > .protyle-action {
  height: 1.9em;
  line-height: 1.9em;
  padding: 0;
}
/* 序号或圆点后面的文字 */
.protyle-wysiwyg [data-node-id].li > [data-node-id] {
  line-height: 1.9em;
  padding: 0;
}
/* 列表中间的代码块 */
.protyle-wysiwyg [data-node-id].li > [data-node-id].code-block {
  margin-top: 6px;
  margin-bottom: 6px;
}

/* -------- 直线 -------- */
.protyle-wysiwyg [data-node-id].hr {
  padding: 4px 0;
  margin: 0 0 26px 0;
  /* margin: 50px 0 20px 0; */
}

.protyle-breadcrumb__item {
    border-radius: 0.3em;
    font-size: 0.7rem;
    padding:0;
    margin:0;
}

.protyle-wysiwyg [data-node-id] span[data-type~=a] {
    color: #0E7BFB;
    text-shadow: none !important;
    font-stretch: condensed;
}

.b3-typography table tr:nth-child(2n) td, .protyle-wysiwyg table tr:nth-child(2n) td{
    background-color: var(--b3-theme-surface);
}

.item__close{
    display: none !important;
}
.dock__item--activefocus {
    background-color: hsl(175.47deg 37.37% 40.58%) !important;
}

.b3-button{
    border-radius: 0;
}
.b3-list{
    font-size:.8rem;
    font-family: Helvetica,  Avantgarde, sans-serif;
    font-weight: 300;
    font-stretch: condensed;
    padding:0 1% 0;
}
.b3-list-item__text{
    padding-left:0.12rem;
}

::selection {
    background-color: #30A5EA;
    color: white;
}

.protyle-wysiwyg [data-node-id]{
    color: #fff;
    font-size: .8rem;
}

.protyle-wysiwyg [data-node-id] [spellcheck]{
    font-stretch: semi-condensed;
    text-shadow: 0.1rem 0.1rem .4rem rgba(255,255,255,0.6);
    min-height:1rem !important;
}

.protyle-title__input {
    font-size: 1.35rem !important;
    font-family: sans-serif;
    font-stretch: semi-condensed;
}


.layout-tab-bar .item--readonly, .layout-tab-bar--readonly {
    display: none !important;
}

.protyle-wysiwyg .h1 {
    font-size: 1.3rem !important;
}

.protyle-wysiwyg .h2 {
    font-size: 1.2rem !important;
}
.protyle-wysiwyg .h3 {
    font-size: 1.1rem !important;
}
.protyle-wysiwyg .h4 {
    font-size: 1.0rem !important;
}
.protyle-wysiwyg .h5 {
    font-size: 0.9rem !important;
}
.protyle-wysiwyg .h6 {
    font-size: 0.85rem !important;
}