/* * Kanagawa, as in kanagawa.nvim: `lotus` for the light scheme, `wave` for the dark one. * The built-in schemes keep their names (the theme's own rules key on `slate`); only the colours * change. Palette names are the plugin's (lua/kanagawa/colors.lua), the mapping its themes.lua: * ui.* for the page, syn.* for the code. */ /* ---- light: lotus ---- */ [data-md-color-scheme="default"] { color-scheme: light; --md-default-bg-color: #fbf8e4; /* lighter than ui.bg (lotusWhite3) */ --md-default-bg-color--light: rgb(251 248 228 / 54%); --md-default-bg-color--lighter: rgb(251 248 228 / 26%); --md-default-bg-color--lightest: rgb(251 248 228 / 7%); --md-default-fg-color: #43436c; /* ui.fg_dim lotusInk2 */ --md-default-fg-color--light: rgb(67 67 108 / 70%); --md-default-fg-color--lighter: rgb(67 67 108 / 42%); --md-default-fg-color--lightest: rgb(67 67 108 / 14%); --md-primary-fg-color: #f2ecbc; /* header: ui.bg lotusWhite3 */ --md-primary-fg-color--light: #f6f1cd; --md-primary-fg-color--dark: #e7dba0; --md-primary-bg-color: #43436c; --md-primary-bg-color--light: rgb(67 67 108 / 70%); --md-accent-fg-color: #5d57a3; /* hover: lotusBlue5 */ --md-accent-fg-color--transparent: rgb(93 87 163 / 10%); --md-accent-bg-color: #fbf8e4; --md-accent-bg-color--light: rgb(251 248 228 / 70%); --md-typeset-color: #545464; /* ui.fg lotusInk1 */ --md-typeset-a-color: #4d699b; /* syn.fun lotusBlue4 */ --md-typeset-mark-color: rgb(222 152 0 / 30%); --md-typeset-ins-color: rgb(110 145 95 / 30%); --md-typeset-del-color: rgb(200 64 83 / 25%); --md-typeset-kbd-color: #f4f0d4; --md-typeset-kbd-accent-color: #fbf8e4; --md-typeset-kbd-border-color: #a09cac; --md-typeset-table-color: rgb(84 84 100 / 18%); --md-typeset-table-color--light: rgb(84 84 100 / 4%); --md-admonition-bg-color: #fbf8e4; --md-admonition-fg-color: #545464; --md-warning-bg-color: rgb(222 152 0 / 15%); --md-warning-fg-color: #77713f; --md-code-bg-color: #f4f0d4; /* between ui.bg (lotusWhite3) and the page */ --md-code-bg-color--light: rgb(244 240 212 / 60%); --md-code-bg-color--lighter: rgb(244 240 212 / 30%); --md-code-fg-color: #545464; --md-code-hl-color: rgb(159 181 201 / 35%); /* ui.bg_search lotusBlue3 */ --md-code-hl-color--light: rgb(159 181 201 / 18%); --md-code-hl-comment-color: #8a8980; /* syn.comment lotusGray3 */ --md-code-hl-constant-color: #cc6d00; /* syn.constant lotusOrange */ --md-code-hl-function-color: #4d699b; /* syn.fun lotusBlue4 */ --md-code-hl-generic-color: #545464; --md-code-hl-keyword-color: #624c83; /* syn.keyword lotusViolet4 */ --md-code-hl-name-color: #545464; --md-code-hl-number-color: #b35b79; /* syn.number lotusPink */ --md-code-hl-operator-color: #836f4a; /* syn.operator lotusYellow2 */ --md-code-hl-punctuation-color: #4e8ca2; /* syn.punct lotusTeal1 */ --md-code-hl-special-color: #6693bf; /* syn.special1 lotusTeal2 */ --md-code-hl-string-color: #6f894e; /* syn.string lotusGreen */ --md-code-hl-variable-color: #5d57a3; /* syn.parameter lotusBlue5 */ } /* ---- dark: wave ---- */ [data-md-color-scheme="slate"] { color-scheme: dark; --md-default-bg-color: #1f1f28; /* ui.bg sumiInk3 */ --md-default-bg-color--light: rgb(31 31 40 / 54%); --md-default-bg-color--lighter: rgb(31 31 40 / 26%); --md-default-bg-color--lightest: rgb(31 31 40 / 7%); --md-default-fg-color: #dcd7ba; /* ui.fg fujiWhite */ --md-default-fg-color--light: rgb(220 215 186 / 62%); --md-default-fg-color--lighter: rgb(220 215 186 / 36%); --md-default-fg-color--lightest: rgb(220 215 186 / 12%); --md-primary-fg-color: #16161d; /* header: ui.bg_m3 sumiInk0 */ --md-primary-fg-color--light: #2a2a37; --md-primary-fg-color--dark: #0d0c0c; --md-primary-bg-color: #dcd7ba; --md-primary-bg-color--light: rgb(220 215 186 / 70%); --md-accent-fg-color: #7fb4ca; /* hover: springBlue */ --md-accent-fg-color--transparent: rgb(127 180 202 / 10%); --md-accent-bg-color: #1f1f28; --md-accent-bg-color--light: rgb(31 31 40 / 70%); --md-typeset-color: #dcd7ba; --md-typeset-a-color: #7e9cd8; /* syn.fun crystalBlue */ --md-typeset-mark-color: rgb(230 195 132 / 30%); /* carpYellow */ --md-typeset-ins-color: rgb(152 187 108 / 25%); /* springGreen */ --md-typeset-del-color: rgb(228 104 118 / 25%); /* waveRed */ --md-typeset-kbd-color: #2a2a37; --md-typeset-kbd-accent-color: #363646; --md-typeset-kbd-border-color: #54546d; --md-typeset-table-color: rgb(220 215 186 / 12%); --md-typeset-table-color--light: rgb(220 215 186 / 4%); --md-admonition-bg-color: #1f1f28; --md-admonition-fg-color: #dcd7ba; --md-warning-bg-color: rgb(255 158 59 / 12%); --md-warning-fg-color: #ffa066; --md-code-bg-color: #2a2a37; /* ui.bg_p1 sumiInk4 */ --md-code-bg-color--light: rgb(42 42 55 / 60%); --md-code-bg-color--lighter: rgb(42 42 55 / 30%); --md-code-fg-color: #dcd7ba; --md-code-hl-color: rgb(45 79 103 / 55%); /* ui.bg_search waveBlue2 */ --md-code-hl-color--light: rgb(45 79 103 / 28%); --md-code-hl-comment-color: #727169; /* syn.comment fujiGray */ --md-code-hl-constant-color: #ffa066; /* syn.constant surimiOrange */ --md-code-hl-function-color: #7e9cd8; /* syn.fun crystalBlue */ --md-code-hl-generic-color: #dcd7ba; --md-code-hl-keyword-color: #957fb8; /* syn.keyword oniViolet */ --md-code-hl-name-color: #dcd7ba; --md-code-hl-number-color: #d27e99; /* syn.number sakuraPink */ --md-code-hl-operator-color: #c0a36e; /* syn.operator boatYellow2 */ --md-code-hl-punctuation-color: #9cabca; /* syn.punct springViolet2 */ --md-code-hl-special-color: #7fb4ca; /* syn.special1 springBlue */ --md-code-hl-string-color: #98bb6c; /* syn.string springGreen */ --md-code-hl-variable-color: #b8b4d0; /* syn.parameter oniViolet2 */ } /* ---- admonitions: the theme hard-codes one colour per type; these are Kanagawa's ---- */ [data-md-color-scheme="default"] { --kw-note: #4d699b; --kw-abstract: #4e8ca2; --kw-info: #5e857a; --kw-tip: #6693bf; --kw-success: #6f894e; --kw-question: #de9800; --kw-warning: #cc6d00; --kw-failure: #c84053; --kw-danger: #d7474b; --kw-bug: #b35b79; --kw-example: #624c83; --kw-quote: #8a8980; } [data-md-color-scheme="slate"] { --kw-note: #7e9cd8; --kw-abstract: #7fb4ca; --kw-info: #7aa89f; --kw-tip: #a3d4d5; --kw-success: #98bb6c; --kw-question: #e6c384; --kw-warning: #ffa066; --kw-failure: #e46876; --kw-danger: #ff5d62; --kw-bug: #d27e99; --kw-example: #957fb8; --kw-quote: #727169; } .md-typeset .admonition.note,.md-typeset details.note { background-color: color-mix(in srgb, var(--kw-note) 12%, transparent); } .md-typeset .note>.admonition-title:before,.md-typeset .note>summary:before { background-color: var(--kw-note); } .md-typeset .note>.admonition-title:after,.md-typeset .note>summary:after { color: var(--kw-note); } .md-typeset .admonition.abstract,.md-typeset details.abstract,.md-typeset .admonition.summary,.md-typeset details.summary,.md-typeset .admonition.tldr,.md-typeset details.tldr { background-color: color-mix(in srgb, var(--kw-abstract) 12%, transparent); } .md-typeset .abstract>.admonition-title:before,.md-typeset .abstract>summary:before,.md-typeset .summary>.admonition-title:before,.md-typeset .summary>summary:before,.md-typeset .tldr>.admonition-title:before,.md-typeset .tldr>summary:before { background-color: var(--kw-abstract); } .md-typeset .abstract>.admonition-title:after,.md-typeset .abstract>summary:after,.md-typeset .summary>.admonition-title:after,.md-typeset .summary>summary:after,.md-typeset .tldr>.admonition-title:after,.md-typeset .tldr>summary:after { color: var(--kw-abstract); } .md-typeset .admonition.info,.md-typeset details.info,.md-typeset .admonition.todo,.md-typeset details.todo { background-color: color-mix(in srgb, var(--kw-info) 12%, transparent); } .md-typeset .info>.admonition-title:before,.md-typeset .info>summary:before,.md-typeset .todo>.admonition-title:before,.md-typeset .todo>summary:before { background-color: var(--kw-info); } .md-typeset .info>.admonition-title:after,.md-typeset .info>summary:after,.md-typeset .todo>.admonition-title:after,.md-typeset .todo>summary:after { color: var(--kw-info); } .md-typeset .admonition.tip,.md-typeset details.tip,.md-typeset .admonition.hint,.md-typeset details.hint,.md-typeset .admonition.important,.md-typeset details.important { background-color: color-mix(in srgb, var(--kw-tip) 12%, transparent); } .md-typeset .tip>.admonition-title:before,.md-typeset .tip>summary:before,.md-typeset .hint>.admonition-title:before,.md-typeset .hint>summary:before,.md-typeset .important>.admonition-title:before,.md-typeset .important>summary:before { background-color: var(--kw-tip); } .md-typeset .tip>.admonition-title:after,.md-typeset .tip>summary:after,.md-typeset .hint>.admonition-title:after,.md-typeset .hint>summary:after,.md-typeset .important>.admonition-title:after,.md-typeset .important>summary:after { color: var(--kw-tip); } .md-typeset .admonition.success,.md-typeset details.success,.md-typeset .admonition.check,.md-typeset details.check,.md-typeset .admonition.done,.md-typeset details.done { background-color: color-mix(in srgb, var(--kw-success) 12%, transparent); } .md-typeset .success>.admonition-title:before,.md-typeset .success>summary:before,.md-typeset .check>.admonition-title:before,.md-typeset .check>summary:before,.md-typeset .done>.admonition-title:before,.md-typeset .done>summary:before { background-color: var(--kw-success); } .md-typeset .success>.admonition-title:after,.md-typeset .success>summary:after,.md-typeset .check>.admonition-title:after,.md-typeset .check>summary:after,.md-typeset .done>.admonition-title:after,.md-typeset .done>summary:after { color: var(--kw-success); } .md-typeset .admonition.question,.md-typeset details.question,.md-typeset .admonition.help,.md-typeset details.help,.md-typeset .admonition.faq,.md-typeset details.faq { background-color: color-mix(in srgb, var(--kw-question) 12%, transparent); } .md-typeset .question>.admonition-title:before,.md-typeset .question>summary:before,.md-typeset .help>.admonition-title:before,.md-typeset .help>summary:before,.md-typeset .faq>.admonition-title:before,.md-typeset .faq>summary:before { background-color: var(--kw-question); } .md-typeset .question>.admonition-title:after,.md-typeset .question>summary:after,.md-typeset .help>.admonition-title:after,.md-typeset .help>summary:after,.md-typeset .faq>.admonition-title:after,.md-typeset .faq>summary:after { color: var(--kw-question); } .md-typeset .admonition.warning,.md-typeset details.warning,.md-typeset .admonition.caution,.md-typeset details.caution,.md-typeset .admonition.attention,.md-typeset details.attention { background-color: color-mix(in srgb, var(--kw-warning) 12%, transparent); } .md-typeset .warning>.admonition-title:before,.md-typeset .warning>summary:before,.md-typeset .caution>.admonition-title:before,.md-typeset .caution>summary:before,.md-typeset .attention>.admonition-title:before,.md-typeset .attention>summary:before { background-color: var(--kw-warning); } .md-typeset .warning>.admonition-title:after,.md-typeset .warning>summary:after,.md-typeset .caution>.admonition-title:after,.md-typeset .caution>summary:after,.md-typeset .attention>.admonition-title:after,.md-typeset .attention>summary:after { color: var(--kw-warning); } .md-typeset .admonition.failure,.md-typeset details.failure,.md-typeset .admonition.fail,.md-typeset details.fail,.md-typeset .admonition.missing,.md-typeset details.missing { background-color: color-mix(in srgb, var(--kw-failure) 12%, transparent); } .md-typeset .failure>.admonition-title:before,.md-typeset .failure>summary:before,.md-typeset .fail>.admonition-title:before,.md-typeset .fail>summary:before,.md-typeset .missing>.admonition-title:before,.md-typeset .missing>summary:before { background-color: var(--kw-failure); } .md-typeset .failure>.admonition-title:after,.md-typeset .failure>summary:after,.md-typeset .fail>.admonition-title:after,.md-typeset .fail>summary:after,.md-typeset .missing>.admonition-title:after,.md-typeset .missing>summary:after { color: var(--kw-failure); } .md-typeset .admonition.danger,.md-typeset details.danger,.md-typeset .admonition.error,.md-typeset details.error { background-color: color-mix(in srgb, var(--kw-danger) 12%, transparent); } .md-typeset .danger>.admonition-title:before,.md-typeset .danger>summary:before,.md-typeset .error>.admonition-title:before,.md-typeset .error>summary:before { background-color: var(--kw-danger); } .md-typeset .danger>.admonition-title:after,.md-typeset .danger>summary:after,.md-typeset .error>.admonition-title:after,.md-typeset .error>summary:after { color: var(--kw-danger); } .md-typeset .admonition.bug,.md-typeset details.bug { background-color: color-mix(in srgb, var(--kw-bug) 12%, transparent); } .md-typeset .bug>.admonition-title:before,.md-typeset .bug>summary:before { background-color: var(--kw-bug); } .md-typeset .bug>.admonition-title:after,.md-typeset .bug>summary:after { color: var(--kw-bug); } .md-typeset .admonition.example,.md-typeset details.example { background-color: color-mix(in srgb, var(--kw-example) 12%, transparent); } .md-typeset .example>.admonition-title:before,.md-typeset .example>summary:before { background-color: var(--kw-example); } .md-typeset .example>.admonition-title:after,.md-typeset .example>summary:after { color: var(--kw-example); } .md-typeset .admonition.quote,.md-typeset details.quote,.md-typeset .admonition.cite,.md-typeset details.cite { background-color: color-mix(in srgb, var(--kw-quote) 12%, transparent); } .md-typeset .quote>.admonition-title:before,.md-typeset .quote>summary:before,.md-typeset .cite>.admonition-title:before,.md-typeset .cite>summary:before { background-color: var(--kw-quote); } .md-typeset .quote>.admonition-title:after,.md-typeset .quote>summary:after,.md-typeset .cite>.admonition-title:after,.md-typeset .cite>summary:after { color: var(--kw-quote); } /* ---- API tables: keep a name on one line where it fits ---- */ .md-typeset table:not([class]) td:first-child { min-width: 11rem; } /* ---- Benchmarks: charts from docs/gen_bench.py, coloured by the theme ---- */ :root, [data-md-color-scheme="default"] { --bench-strata: #4d699b; --bench-strata_arena: #624c83; --bench-eigen: #cc6d00; --bench-loop: #6f894e; --bench-win: #5e7a3e; --bench-lose: #c84053; } [data-md-color-scheme="slate"] { --bench-strata: #7e9cd8; --bench-strata_arena: #957fb8; --bench-eigen: #ffa066; --bench-loop: #98bb6c; --bench-win: #98bb6c; --bench-lose: #e46876; } .bench-chart { width: 100%; height: auto; font-size: 11px; } .bench-chart text { fill: var(--md-default-fg-color--light); } .bench-chart .grid { stroke: var(--md-default-fg-color--lightest); } .bench-chart polyline { fill: none; stroke: currentColor; stroke-width: 2; } .bench-chart circle { fill: currentColor; } .md-typeset .tabbed-block .md-typeset__table { display: block; } .md-typeset .tabbed-block table:not([class]) { display: table; width: 100%; font-variant-numeric: tabular-nums; } .md-typeset .tabbed-block table:not([class]) td:first-child { min-width: 0; color: var(--md-default-fg-color--light); } .md-typeset .tabbed-block table:not([class]) th { white-space: nowrap; font-weight: 600; } .bench-win, .bench-lose { font-weight: 600; } .bench-win { color: var(--bench-win); } .bench-lose { color: var(--bench-lose); } .bench-tie { color: var(--md-default-fg-color--light); } .bench-key::before { content: ""; display: inline-block; width: .7em; height: .7em; margin-right: .3em; border-radius: 50%; background: currentColor; } .s-strata { color: var(--bench-strata); } .s-strata_arena { color: var(--bench-strata_arena); } .s-eigen { color: var(--bench-eigen); } .s-loop { color: var(--bench-loop); }