/* * littlepig * (c) 2020 dragonwocky * (c) 2020 Lizishan * under the MIT license */ @import url('https://dev-cats.github.io/code-snippets/JetBrainsMono.css'); :root { --theme_dark--main: #1e1c26; --theme_dark--sidebar: #24222c; --theme_dark--dragarea: #19181f; --theme_dark--font_sans: 'JetBrains Mono'; --theme_dark--font_mono: 'JetBrains Mono', iawriter-mono, Nitti, Menlo, Courier, monospace; --theme_dark--font_code: 'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace; --theme_dark--scrollbar: #221f29; /* --theme_dark--scrollbar-border: transparent; */ --theme_dark--scrollbar_hover: #312d3c; --theme_dark--font_title-size: 40px; --theme_dark--font_heading1-size: 30px; --theme_dark--font_heading2-size: 24px; --theme_dark--font_heading3-size: 20px; --theme_dark--font_label-size: 14px; --theme_dark--font_body-size: 17px; --theme_dark--font_code-size: 16px; --theme_dark--font_sidebar-size: 14px; /* --theme_dark--card: rgb(53, 51, 58); */ --theme_dark--gallery: rgba(162, 162, 162, 0.01); --theme_dark--table-border: rgba(148, 148, 184, 0.5); --theme_dark--interactive_hover: #282632; /* --theme_dark--interactive_hover-border: transparent; --theme_dark--button_close: #e81123; --theme_dark--button_close-fill: white; */ --theme_dark--selected: #9500ff6b; --theme_dark--primary: rgb(106, 47, 200); --theme_dark--primary_hover: rgb(110, 48, 211); --theme_dark--primary_click: rgb(117, 65, 200); --theme_dark--primary_indicator: rgb(150, 84, 226); --theme_dark--option_hover-background: rgb(20, 0, 51); --theme_dark--danger_text: rgb(235, 87, 87); --theme_dark--danger_border: rgba(235, 87, 87, 0.5); --theme_dark--text: rgba(200, 200, 200, 0.8); --theme_dark--text_ui: rgba(255, 255, 255, 0.6); --theme_dark--text_ui_info: rgba(255, 255, 255, 0.4); /* 文本颜色 */ --theme_dark--text_gray: rgba(151, 154, 155, 0.95); --theme_dark--text_brown: rgb(177, 144, 131); --theme_dark--text_orange: rgb(255, 163, 68); --theme_dark--text_yellow: rgb(255, 220, 73); --theme_dark--text_green: rgb(66, 222, 137); --theme_dark--text_blue: rgb(0, 157, 255); --theme_dark--text_purple: rgb(162, 94, 255); --theme_dark--text_pink: rgb(226, 85, 161); --theme_dark--text_red: rgb(240, 52, 38); /* 文本背景色 */ --theme_dark--bg_gray: rgb(234, 234, 234); --theme_dark--bg_gray_text: rgb(17, 17, 17); --theme_dark--bg_brown: rgb(130, 118, 111); --theme_dark--bg_brown_text: rgb(85, 35, 1); --theme_dark--bg_orange: rgb(254, 214, 155); --theme_dark--bg_yellow_text: rgb(199, 110, 0); --theme_dark--bg_yellow: rgb(235, 227, 178); --theme_dark--bg_yellow_text: rgb(138, 118, 2); --theme_dark--bg_green: rgb(212, 237, 218); --theme_dark--bg_green_text: rgb(21, 87, 36); --theme_dark--bg_blue: rgb(204, 229, 255); --theme_dark--bg_blue_text: rgb(0, 64, 133); --theme_dark--bg_purple: rgb(199, 178, 230); --theme_dark--bg_purple_text: rgb(90, 49, 148); --theme_dark--bg_pink: rgb(255, 206, 228); --theme_dark--bg_pink_text: rgb(255, 0, 127); --theme_dark--bg_red: rgb(248, 215, 218); --theme_dark--bg_red_text: rgb(138, 0, 10); --theme_dark--select_gray: var(--theme_dark--bg_gray); --theme_dark--select_brown: var(--theme_dark--bg_brown); --theme_dark--select_orange: var(--theme_dark--bg_orange); --theme_dark--select_yellow: var(--theme_dark--bg_yellow); --theme_dark--select_green: var(--theme_dark--bg_green); --theme_dark--select_blue: var(--theme_dark--bg_blue); --theme_dark--select_purple: var(--theme_dark--bg_purple); --theme_dark--select_pink: var(--theme_dark--bg_pink); --theme_dark--select_red: var(--theme_dark--bg_red); --theme_dark--line_gray: rgb(69, 75, 78); --theme_dark--line_brown: rgb(78, 57, 48); --theme_dark--line_orange: rgb(136, 80, 48); --theme_dark--line_yellow: #fbe2287c; --theme_dark--line_red: rgb(151, 62, 62); --theme_dark--code_inline-text: #d9cbec; --theme_dark--code_inline-background: rgba(135, 131, 120, 0.15); --theme_dark--code_text: var(--theme_dark--text); --theme_dark--code-background: rgb(63, 68, 71); --theme_dark--code_function: rgb(179, 146, 240); --theme_dark--code_keyword: hsl(350, 100%, 69%); --theme_dark--code_tag: hsl(350, 40%, 70%); --theme_dark--code_operator: hsl(40, 90%, 60%); --theme_dark--code_important: #e90; --theme_dark--code_property: hsl(350, 40%, 70%); --theme_dark--code_builtin: hsl(75, 70%, 60%); --theme_dark--code_attr-name: hsl(75, 70%, 60%); --theme_dark--code_comment: hsl(30, 20%, 50%); --theme_dark--code_punctuation: rgba(255, 255, 255, 0.9); --theme_dark--code_doctype: hsl(30, 20%, 50%); --theme_dark--code_number: hsl(159, 69%, 39%); --theme_dark--code_string: hsl(75, 95%, 48%); --theme_dark--code_attr-value: hsl(350, 40%, 70%); /* 标题色 */ --theme_dark--h1_text: #c264fe; --theme_dark--h2_text: #e2bafe; --theme_dark--h3_text: #7b08fa; /* todo */ --theme_dark--option_active-color: #7b08fa; --theme_dark--option_active-background: #1d1c26; /* inline code */ --theme_dark--code_inline-text: #e0dfe2; --theme_dark--code_inline-background: rgb(179, 39, 39); /* 标签颜色 + 文本背景色 */ --theme_dark--bg_gray: rgb(234, 234, 234); --theme_dark--bg_gray_text: rgb(17, 17, 17); --theme_dark--bg_brown: rgb(206, 206, 206); --theme_dark--bg_brown_text: rgb(85, 35, 1); --theme_dark--bg_orange: rgb(254, 214, 155); --theme_dark--bg_orange_text: rgb(199, 110, 0); --theme_dark--bg_yellow: #fcffd8; --theme_dark--bg_yellow_text: #ff8c22; --theme_dark--bg_green: #d5fded; --theme_dark--bg_green_text: #006a00; --theme_dark--bg_blue: #e2f5ff; --theme_dark--bg_blue_text: #00b2ff; --theme_dark--bg_purple: #efe6ff; --theme_dark--bg_purple_text: #8334ff; --theme_dark--bg_pink: #ffe9f1; --theme_dark--bg_pink_text: rgb(255, 0, 127); --theme_dark--bg_red: rgb(251, 228, 228); --theme_dark--bg_red_text: rgb(138, 0, 10); /* callout 颜色 */ --theme_dark--callout_bg_gray: #e2e3e5; --theme_dark--callout_text_gray: #383d41; --theme_dark--callout_bg_brown: rgb(130, 118, 111); --theme_dark--callout_text_brown: rgb(85, 35, 1); --theme_dark--callout_bg_orange: rgb(254, 214, 155); --theme_dark--callout_text_orange: rgb(255, 140, 0); --theme_dark--callout_bg_yellow: #fcffd8; --theme_dark--callout_text_yellow: #c76e00; --theme_dark--callout_bg_green: #d4edda; --theme_dark--callout_text_green: #155724; --theme_dark--callout_bg_blue: #cce5ff; --theme_dark--callout_text_blue: #004085; --theme_dark--callout_bg_purple: rgb(199, 178, 230); --theme_dark--callout_text_purple: rgb(90, 49, 148); --theme_dark--callout_bg_pink: rgb(255, 206, 228); --theme_dark--callout_text_pink: rgb(255, 0, 127); --theme_dark--callout_bg_red: #f8d7da; --theme_dark--callout_text_red: #721c24; } .notion-dark-theme .notion-scroller.vertical.horizontal .notion-table-view .notion-selectable.notion-collection_view-block > :first-child { background: var(--theme--card) !important; } /* todo 颜色 */ .dark [style*='background: rgb(46, 170, 220)'], .dark [style*='background-color: rgb(46, 170, 220)'] { background: var(--theme_dark--option_active-background) !important; } .notion-to_do-block > div [role='button']:not(:hover) .check { background: var(--theme_dark--option_active-background) !important; } .notion-to_do-block > div [role='button']:not(:hover) .check polygon { fill: var(--theme_dark--option_active-color) !important; } /*================================= 标签颜色 + 文本背景色 ===============================**/ /* 灰色 */ .dark [style*='background: rgba(151, 154, 155, 0.5)'] { display: inline-block; border-radius: 4px !important; padding: 10px 0.4em !important; font-weight: 500 !important; background: var(--theme_dark--bg_gray) !important; color: var(--theme_dark--bg_gray_text) !important; } .dark [style*='background:rgb(69,75,78)'] { display: inline-block; border-radius: 4px !important; padding: 0 0.4em !important; margin: 2px 0 !important; font-weight: 500 !important; background: var(--theme_dark--bg_gray) !important; color: var(--theme_dark--bg_gray_text) !important; } /* 棕色 */ .dark [style*='background: rgba(147, 114, 100, 0.5)'] { display: inline-block; border-radius: 4px !important; padding: 10px 0.4em !important; font-weight: 500 !important; background: var(--theme_dark--bg_brown) !important; color: var(--theme_dark--bg_brown_text) !important; } .dark [style*='background:rgb(67,64,64)'] { display: inline-block; border-radius: 4px !important; padding: 0 0.4em !important; margin: 2px 0 !important; font-weight: 500 !important; background: var(--theme_dark--bg_brown) !important; color: var(--theme_dark--bg_brown_text) !important; } /* 橘黄色 */ .dark [style*='background: rgba(255, 163, 68, 0.5)'] { display: inline-block; border-radius: 4px !important; padding: 10px 0.4em !important; font-weight: 500 !important; background: var(--theme_dark--bg_orange) !important; color: var(--theme_dark--bg_orange_text) !important; } .dark [style*='background:rgb(89,74,58)'] { display: inline-block; border-radius: 4px !important; padding: 0 0.4em !important; margin: 2px 0 !important; font-weight: 500 !important; background: var(--theme_dark--bg_orange) !important; color: var(--theme_dark--bg_orange_text) !important; } /* 黄色 */ .dark [style*='background: rgba(255, 220, 73, 0.5)'] { display: inline-block; border-radius: 4px !important; padding: 10px 0.4em !important; font-weight: 500 !important; background: var(--theme_dark--bg_yellow) !important; color: var(--theme_dark--bg_yellow_text) !important; } .dark [style*='background:rgb(89,86,59)'] { display: inline-block; border-radius: 4px !important; padding: 0 0.4em !important; margin: 2px 0 !important; font-weight: 500 !important; background: var(--theme_dark--bg_yellow) !important; color: var(--theme_dark--bg_yellow_text) !important; } /* 绿色 */ .dark [style*='background: rgba(77, 171, 154, 0.5)'] { display: inline-block; border-radius: 4px !important; padding: 10px 0.4em !important; font-weight: 500 !important; background: var(--theme_dark--bg_green) !important; color: var(--theme_dark--bg_green_text) !important; } .dark [style*='background:rgb(53,76,75)'] { display: inline-block; border-radius: 4px !important; padding: 0 0.4em !important; margin: 2px 0 !important; font-weight: 500 !important; background: var(--theme_dark--bg_green) !important; color: var(--theme_dark--bg_green_text) !important; } /* 蓝色 */ .dark [style*='background: rgba(82, 156, 202, 0.5)'] { display: inline-block; border-radius: 4px !important; padding: 10px 0.4em !important; font-weight: 500 !important; background: var(--theme_dark--bg_blue) !important; color: var(--theme_dark--bg_blue_text) !important; } .dark [style*='background:rgb(54,73,84)'] { display: inline-block; border-radius: 4px !important; padding: 0 0.4em !important; margin: 2px 0 !important; font-weight: 500 !important; background: var(--theme_dark--bg_blue) !important; color: var(--theme_dark--bg_blue_text) !important; } /* 紫色 */ .dark [style*='background: rgba(154, 109, 215, 0.5)'] { display: inline-block; border-radius: 4px !important; padding: 10px 0.4em !important; font-weight: 500 !important; background: var(--theme_dark--bg_purple) !important; color: var(--theme_dark--bg_purple_text) !important; } .dark [style*='background:rgb(68,63,87)'] { display: inline-block; border-radius: 4px !important; padding: 0 0.4em !important; margin: 2px 0 !important; font-weight: 500 !important; background: var(--theme_dark--bg_purple) !important; color: var(--theme_dark--bg_purple_text) !important; } /* 粉红色 */ .dark [style*='background: rgba(226, 85, 161, 0.5)'] { display: inline-block; border-radius: 4px !important; padding: 10px 0.4em !important; font-weight: 500 !important; background: var(--theme_dark--bg_pink) !important; color: var(--theme_dark--bg_pink_text) !important; } .dark [style*='background:rgb(83,59,76)'] { display: inline-block; border-radius: 4px !important; padding: 0 0.4em !important; margin: 2px 0 !important; font-weight: 500 !important; background: var(--theme_dark--bg_pink) !important; color: var(--theme_dark--bg_pink_text) !important; } /* 红色 */ .dark [style*='background: rgba(255, 115, 105, 0.5);'] { display: inline-block; border-radius: 4px !important; padding: 10px 0.4em !important; font-weight: 500 !important; background: var(--theme_dark--bg_red) !important; color: var(--theme_dark--bg_red_text) !important; } .dark [style*='background:rgb(89,65,65)'] { display: inline-block; border-radius: 4px !important; padding: 0 0.4em !important; margin: 2px 0 !important; font-weight: 500 !important; background: var(--theme_dark--bg_red) !important; color: var(--theme_dark--bg_red_text) !important; } /* -----------------------------callout 样式 start------------------------ */ /* notion-callout-block gray */ .notion-dark-theme .notion-callout-block [style*='background: rgba(69, 75, 78, 0.3)'] { /* color: var(--theme_dark--callout_text_gray) !important; */ background: var(--theme_dark--callout_bg_gray) !important; border-radius: 3px !important; } .notion-dark-theme .notion-callout-block [style*='background: rgba(69, 75, 78, 0.3)'] [style*='color: rgba(255, 255, 255, 0.9)'] { color: var(--theme_dark--callout_text_gray) !important; } /* notion-callout-block brown */ .notion-dark-theme .notion-callout-block [style*='background: rgba(67, 64, 64, 0.3)'] { /* color: var(--theme_dark--callout_text_brown) !important; */ background: var(--theme_dark--callout_bg_brown) !important; border-radius: 3px !important; } .notion-dark-theme .notion-callout-block [style*='background: rgba(67, 64, 64, 0.3)'] [style*='color: rgba(255, 255, 255, 0.9)'] { color: var(--theme_dark--callout_text_brown) !important; } /* notion-callout-block orange */ .notion-dark-theme .notion-callout-block [style*='background: rgba(89, 74, 58, 0.3)'] { /* color: var(--theme_dark--callout_text_orange) !important; */ background: var(--theme_dark--callout_bg_orange) !important; border-radius: 3px !important; } .notion-dark-theme .notion-callout-block [style*='background: rgba(89, 74, 58, 0.3)'] [style*='color: rgba(255, 255, 255, 0.9)'] { color: var(--theme_dark--callout_text_orange) !important; } /* notion-callout-block yellow */ .notion-dark-theme .notion-callout-block [style*='background: rgba(89, 86, 59, 0.3)'] { /* color: var(--theme_dark--callout_text_yellow) !important; */ background: var(--theme_dark--callout_bg_yellow) !important; border-radius: 3px !important; } .notion-dark-theme .notion-callout-block [style*='background: rgba(89, 86, 59, 0.3)'] [style*='color: rgba(255, 255, 255, 0.9)'] { color: var(--theme_dark--callout_text_yellow) !important; } /* notion-callout-block green */ .notion-dark-theme .notion-callout-block [style*='background: rgba(53, 76, 75, 0.3)'] { /* color: var(--theme_dark--callout_text_green) !important; */ background: var(--theme_dark--callout_bg_green) !important; border-radius: 3px !important; } .notion-dark-theme .notion-callout-block [style*='background: rgba(53, 76, 75, 0.3)'] [style*='color: rgba(255, 255, 255, 0.9)'] { color: var(--theme_dark--callout_text_green) !important; } /* notion-callout-block blue */ .notion-dark-theme .notion-callout-block [style*='background: rgba(54, 73, 84, 0.3)'] { /* color: var(--theme_dark--callout_text_blue) !important; */ background: var(--theme_dark--callout_bg_blue) !important; border-radius: 3px !important; } .notion-dark-theme .notion-callout-block [style*='background: rgba(54, 73, 84, 0.3)'] [style*='color: rgba(255, 255, 255, 0.9)'] { color: var(--theme_dark--callout_text_blue) !important; } /* notion-callout-block purple */ .notion-dark-theme .notion-callout-block [style*='background: rgba(68, 63, 87, 0.3)'] { /* color: var(--theme_dark--callout_text_purple) !important; */ background: var(--theme_dark--callout_bg_purple) !important; border-radius: 3px !important; } .notion-dark-theme .notion-callout-block [style*='background: rgba(68, 63, 87, 0.3)'] [style*='color: rgba(255, 255, 255, 0.9)'] { color: var(--theme_dark--callout_text_purple) !important; } /* notion-callout-block pink */ .notion-dark-theme .notion-callout-block [style*='background: rgba(83, 59, 76, 0.3)'] { /* color: var(--theme_dark--callout_text_pink) !important; */ background: var(--theme_dark--callout_bg_pink) !important; border-radius: 3px !important; } .notion-dark-theme .notion-callout-block [style*='background: rgba(83, 59, 76, 0.3)'] [style*='color: rgba(255, 255, 255, 0.9)'] { color: var(--theme_dark--callout_text_pink) !important; } /* notion-callout-block red */ .notion-dark-theme .notion-callout-block [style*='background: rgba(89, 65, 65, 0.3)'] { /* color: var(--theme_dark--callout_text_red) !important; */ background: var(--theme_dark--callout_bg_red) !important; border-radius: 3px !important; } .notion-dark-theme .notion-callout-block [style*='background: rgba(89, 65, 65, 0.3)'] [style*='color: rgba(255, 255, 255, 0.9)'] { color: var(--theme_dark--callout_text_red) !important; } /* -----------------------------callout 样式 end---------------------------- */ /* ===================== header =========================== */ .notion-dark-theme [placeholder*='Heading 1'] { color: var(--theme_dark--h1_text) !important; } .notion-dark-theme [placeholder*='Heading 2'] { margin-bottom: 16px; border-bottom: 4px solid var(--theme_dark--h2_text); display: inline-block; color: var(--theme_dark--h2_text) !important; width: auto !important; padding: 6px 12px 6px 0 !important; position: relative; } .notion-dark-theme [placeholder*='Heading 2']::before { content: '🔥 '; } .notion-dark-theme [placeholder*='Heading 3'] { width: fit-content !important; padding: 4px 10px !important; border-radius: 10px; border: 2px solid var(--theme_dark--h3_text); color: var(--theme_dark--h3_text) !important; background-color: #fbf8e7; display: inline-block; margin-bottom: 14px; } .notion-dark-theme [placeholder*='Heading 3']::before { content: '📌 '; } /* list 样式 */ .notion-dark-theme [style*='font-size: 1.5em; line-height: 1; margin-bottom: 0.1em;'] { color: #a830fd !important; } /* quoteblock 样式 */ .notion-dark-theme .notion-quote-block [style*='caret-color: rgba(255, 255, 255, 0.9);'] { font-size: 0.85em !important; border-left: none !important; padding: 0.5em 0.5em 0.5em 1.9em !important; position: relative; margin: 10px 0; background: #9494942e; border-radius: 3px; } .notion-dark-theme .notion-quote-block [style*='caret-color: rgba(255, 255, 255, 0.9);']::before { content: '\201C'; font-family: Georgia, serif; font-size: 44px; font-weight: bold; color: #7b08fa; position: absolute; left: 0px; top: -24px; } /* link style */ .notion-dark-theme .notion-link-token span { border-bottom: 0.05em solid; border-color: rgb(233, 51, 38) !important; border-width: 3px !important; opacity: 1 !important; } .notion-dark-theme .notion-link-token span:hover { color: rgb(233, 51, 38) !important; } /* code */ .dark [style*='color:#EB5757'] { color: var(--theme_dark--code_inline-text) !important; background: var(--theme_dark--code_inline-background) !important; }