Morgana On Old Bhl Curiosity
:root { /*=== S-CSS-P ===*/ --theme-base: "black-highlighter"; --theme-id: "nuterminal"; --theme-name: "NuTerminal Theme"; /*=== Colors ===*/ --swatch-background: var(--black-monochrome); --swatch-primary: var(--light-gray-monochrome); --swatch-primary-darker: var(--dark-gray-monochrome); --swatch-primary-darkest: var(--dark-gray-monochrome); --swatch-border-color: var(--white-monochrome); --swatch-text-dark: var(--black-monochrome); --swatch-text-light: var(--white-monochrome); --swatch-text-general: var(--swatch-text-light); --swatch-important-text: var(--pale-accent); --swatch-menubg-color: var(--dark-gray-monochrome); --swatch-menubg-light-color: var(--light-gray-monochrome); --swatch-menubg-medium-color: var(--gray-monochrome); --swatch-menubg-medium-dark-color: var(--gray-monochrome); --swatch-menubg-dark-color: var(--dark-gray-monochrome); --swatch-menubg-black-color: var(--black-monochrome); --swatch-menubg-hover-color: var(--gray-monochrome); --swatch-menutxt-dark-color: var(--black-monochrome); --swatch-menutxt-light-color: var(--white-monochrome); --swatch-menutxt-general-color: var(--swatch-menutxt-light-color); --sideblock-heading-text-color: var(--swatch-menutxt-general-color); --swatch-secondary-color: var(--gray-monochrome); --swatch-tertiary-color: var(--pale-gray-monochrome); --swatch-alternate-color: var(--gray-monochrome); --swatch-text-secondary-color: var(--white-monochrome); --swatch-text-tertiary-color: var(--white-monochrome); } #page-content .licensebox .collapsible-block-link { color: rgb(255, 255, 255); }
@import url('https://fontlibrary.org/face/fantasque-sans-mono'); @import url("https://backrooms-wiki.wdfiles.com/local--files/component%3Atheme/normalize-archived.css"); @import url("https://backrooms-wiki.wdfiles.com/local--files/component%3Atheme/bhl-archived.css"); @import url('https://fonts.googleapis.com/css2?family=Enriqueta:wght@400;500;600;700&family=Oldenburg&family=Vast+Shadow&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,800&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); /* ╔══════════════════════════════════════════════════╗ ║ MORGANA COUNCIL THEME -- 2024 CANONICON UPDATE ║ ║ ------------------------------------------------ ║ ║ ORIGINAL BY ETOISLE, with edits by YELLOWISLOL ║ ║ 2024 UPDATE VERSION BY SCUTOID + BUBBLINGBEACH ║ ║ ------------------------------------------------ ║ ║ CSS for use with the Black Highlighter Theme ║ ║ from the SCP Wiki, by Woedenaz and ║ ║ Croquembouche. Import or [[include]] the theme ║ ║ before this code to create the full theme. ║ ╚══════════════════════════════════════════════════╣ │ Black Highlighter is available at: ║ →│https://scpwiki.com/theme:black-highlighter-theme║ └─────────────────────────────────────────────────╜ */ /* Fantasque Sans Mono Font */ @import url("https://backrooms-wiki.wikidot.com/component:fantasque-sans-mono/code/1"); /* Public Sans Font */ @import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); :root { /* S-CSS-P */ --theme-base: "black-highlighter"; --theme-id: "nuliminal"; --theme-name: "NuLiminal Theme"; /* Header */ --logo-image: url("http://backrooms-wiki.wdfiles.com/local--files/component%3Atheme/logo.svg"); --header-title: "The Backrooms"; --header-subtitle: "You've been here before."; --swatch-headerh1-color: var(--white-monochrome); --swatch-headerh2-color: var(--white-monochrome); /* Typefaces */ --body-font: 'Public Sans', Inter, Verdana, Geneva, "Helvetica Neue", "Helvetica", sans-serif; --UI-font: "Fantasque Sans Mono", Courier New, Ubuntu Mono, Consolas, monospace, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; --header-font: 'Fantasque Sans Mono', Courier New, Ubuntu Mono, Consolas, monospace; --title-font: var(--header-font); --mono-font: 'Fantasque Sans Mono', Recursive, Consolas, monaco, monospace; /* Colors */ --white-monochrome: 252, 252, 252; --pale-gray-monochrome: 237, 233, 223; --light-pale-gray-monochrome: 237, 233, 223; --very-light-gray-monochrome: 220, 215, 210; --light-gray-monochrome: 165, 160, 155; --gray-monochrome: 77, 67, 54; --dark-gray-monochrome: 60, 56, 42; --black-monochrome: 31, 28, 20; --pale-accent: 230, 23, 68; --bright-accent: 161, 147, 112; --medium-accent: 122, 109, 82; --dark-accent: 122, 109, 82; --alt-accent: 221, 102, 17; /* Liminal Variables */ --header-text-shadow: 0px 2px 3px rgba(0,0,0,0.8); --header-text-shadow-hover: 0px 5px 3px rgba(0,0,0,0.3); --quote-shadow: 0 2px 4px rgba(var(--black-monochrome),0.25); --footer-message: var(--header-subtitle); /* MOST THEMES SHOULDN'T CHANGE THIS: makes editing consistent across themes, adds programming ligatures */ --editor-font: 'Fantasque Sans Mono', Recursive, Consolas, monaco, monospace; /* Swatches */ --swatch-secondary-color: var(--white-monochrome); --swatch-menubg-color: var(--white-monochrome); --rating-module-bg-color: var(--swatch-menubg-color); --swatch-sidebar-collapsible-tab-bg: var(--swatch-primary-darkest); --toc-body-bg-color: var(--white-monochrome); --swatch-topmenu-bg-color: var(--gray-monochrome); --swatch-topmenu-border-color: var(--swatch-topmenu-bg-color); --gradient-header: linear-gradient( to bottom, rgb(var(--bright-accent)) 0%, rgb(var(--dark-accent)) 100%); --gradient-background: linear-gradient( to bottom, rgb(var(--swatch-background)), rgb(var(--swatch-background))); --diagonal-stripes: transparent; --background-gradient-distance: 40rem; /* will not go further than 100vh */ --background-gradient-color: var(--gray-monochrome); /* This will display at low opacity */ /* Measurements */ --scrollbar-width: 0.7rem; --swatch-background: var(--pale-gray-monochrome); --sidebar-width-on-desktop: calc(var(--base-font-size) * (266 / 15)); --body-width-on-desktop: 45.75rem; --header-height-on-desktop: 9rem; --header-height-on-mobile: 9rem; /* Wallpaper Mask */ --wallpaper-mask: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22windows-1252%22%20standalone%3D%22no%22%3F%3E%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xml%3Aspace%3D%22preserve%22%20width%3D%22106.667%22%20height%3D%22154.667%22%3E%3Cpath%20d%3D%22M72.547%201158.57H5.074V-6.465h67.473V1158.57M119.027%20710.25v-58.977l126.95%20154.438L363.43%20654.77v61.476L246.477%20865.688%20119.027%20710.25%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3Cpath%20d%3D%22M119.027%20951.652V790.715l125.45%20153.441L363.43%20792.715v166.933L247.477%201108.09l-128.45-156.438M763.27%201158.57h-63.473l63.473-80.97ZM472.387%201158.57h-67.473V-6.465h67.473V1158.57M518.867%20995.133v-58.977L645.816%201090.6%20763.27%20939.656v61.474l-116.954%20149.44-127.449-155.437M763.27%20657.27%20647.316%20805.711%20518.867%20649.273V488.336l125.449%20153.441L763.27%20490.336V657.27M518.867%201158.57v-82.97l67.973%2082.97z%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3Cpath%20d%3D%22M763.27%20413.867%20646.316%20563.309%20518.867%20407.867v-58.972l126.949%20154.437L763.27%20352.391v61.476M363.43%20128.98%20246.477%20278.422l-127.45-155.438V64.008l126.95%20154.437L363.43%2067.504v61.476%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3Cpath%20d%3D%22M363.43%20205.449v166.934L247.477%20520.824l-128.45-156.437V203.449l125.45%20153.442L363.43%20205.449M518.867%2071.504V-6.465h67.973l57.476%2070.473%2055.481-70.473h63.473V79.5L647.316%20227.941%20518.867%2071.504%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3C%2Fsvg%3E); --wallpaper-mask-size: 2.3rem; } /* Wallpaper */ /* Header Wallpaper */ #skrollr-body::before { background-color: rgba(var(--swatch-topmenu-bg-color),0.2); background-repeat: repeat; background-size: 0.25em 0.25em; width: 100%; height: 9rem; position: absolute; top: 0; left: 0; content: ""; -webkit-mask-image: var(--wallpaper-mask); mask-image: var(--wallpaper-mask); -webkit-mask-repeat: repeat; mask-repeat: repeat; -webkit-mask-size: var(--wallpaper-mask-size); mask-size: var(--wallpaper-mask-size); -webkit-mask-position: center; mask-position: center; } #skrollr-body::before { background-color: rgba(var(--swatch-topmenu-bg-color),0.2); background-repeat: repeat; background-size: 0.25em 0.25em; width: 100%; height: var(--header-height-on-desktop); position: absolute; top: 0; left: 0; content: ""; -webkit-mask-image: var(--wallpaper-mask); mask-image: var(--wallpaper-mask); -webkit-mask-repeat: repeat; mask-repeat: repeat; -webkit-mask-size: var(--wallpaper-mask-size); mask-size: var(--wallpaper-mask-size); -webkit-mask-position: center; mask-position: center; } #skrollr-body { height: var(--header-height-on-desktop); width: 100vw; } /* Header Wallpaper */ #content-wrap::before, #content-wrap::after { content: ""; width: 100%; height: var(--background-gradient-distance); top: var(--final-header-height-on-desktop); left: 0; position: absolute; z-index: -1; display: block; max-height: 100vh; background-image: linear-gradient( to top, rgba(var(--background-gradient-color), 0) 0%, rgba(var(--background-gradient-color), 0.013) 8.1%, rgba(var(--background-gradient-color), 0.049) 15.5%, rgba(var(--background-gradient-color), 0.104) 22.5%, rgba(var(--background-gradient-color), 0.175) 29%, rgba(var(--background-gradient-color), 0.259) 35.3%, rgba(var(--background-gradient-color), 0.352) 41.2%, rgba(var(--background-gradient-color), 0.45) 47.1%, rgba(var(--background-gradient-color), 0.55) 52.9%, rgba(var(--background-gradient-color), 0.648) 58.8%, rgba(var(--background-gradient-color), 0.741) 64.7%, rgba(var(--background-gradient-color), 0.825) 71%, rgba(var(--background-gradient-color), 0.896) 77.5%, rgba(var(--background-gradient-color), 0.951) 84.5%, rgba(var(--background-gradient-color), 0.987) 91.9%, rgb(var(--background-gradient-color)) 100%); } #content-wrap::before { opacity: 0.04; -webkit-mask-image: var(--wallpaper-mask); mask-image: var(--wallpaper-mask); -webkit-mask-repeat: repeat; mask-repeat: repeat; -webkit-mask-size: var(--wallpaper-mask-size); mask-size: var(--wallpaper-mask-size); -webkit-mask-position: center; mask-position: center; } #content-wrap::after { opacity: 0.1; } #container-wrap-wrap::before { background: linear-gradient( to bottom, rgba(var(--swatch-topmenu-bg-color), 0) 0%, rgba(var(--swatch-topmenu-bg-color), 0.013) 5%, rgba(var(--swatch-topmenu-bg-color), 0.049) 10.1%, rgba(var(--swatch-topmenu-bg-color), 0.104) 15.2%, rgba(var(--swatch-topmenu-bg-color), 0.175) 20.5%, rgba(var(--swatch-topmenu-bg-color), 0.259) 25.9%, rgba(var(--swatch-topmenu-bg-color), 0.352) 31.6%, rgba(var(--swatch-topmenu-bg-color), 0.45) 37.5%, rgba(var(--swatch-topmenu-bg-color), 0.55) 43.8%, rgba(var(--swatch-topmenu-bg-color), 0.648) 50.4%, rgba(var(--swatch-topmenu-bg-color), 0.741) 57.4%, rgba(var(--swatch-topmenu-bg-color), 0.825) 64.9%, rgba(var(--swatch-topmenu-bg-color), 0.896) 72.8%, rgba(var(--swatch-topmenu-bg-color), 0.951) 81.3%, rgba(var(--swatch-topmenu-bg-color), 0.987) 90.3%, rgb(var(--swatch-topmenu-bg-color)) 100% ); z-index: -1; content: ""; top: 0; left: 0; position: absolute; width: 100%; height: var(--header-height-on-desktop); } /* container wrap bug */ #container, #container-wrap, #container-wrap-wrap { width: 100vw; } /* Header Image */ #header { background-image: none; z-index: 30; } #header::before { content: ""; position: absolute; height: 100%; width: 100%; left: 0; top: 0; background-image: var(--logo-image); background-size: auto 16rem; background-position: center calc(50% - 0.15rem); background-repeat: no-repeat; opacity: 0.4; } /* Header Text */ #header h1 { width: 100%; } #header h1 a, #header h1 a:before { width: fit-content; transition: 0.2s; position: relative; bottom: 0; color: rgb(var(--swatch-headerh1-color)); } #header h1 a:hover:before { text-shadow: var(--header-text-shadow-hover); bottom: 3px; } #header h1, #header h1 a { position: absolute; top: 1.4rem; margin: 0; display: flex; justify-content: center; z-index: 0; height: 1.5rem; } #header h2, #header h2 span, #header h2 span::before { position: absolute; top: 2.05rem; margin: 0; width: 100%; display: flex; justify-content: center; font-weight: bold; } #header h2 span::before { color: rgb(var(--swatch-headerh2-color)); } #header h1 a::before, #header h2 span::before { text-shadow: var(--header-text-shadow); } /* Top Bar */ #header div[class*="top-bar"] > ul > li > a::before { display: none; } /* Div Boxes */ .darkblock { color: rgb(var(--white-monochrome)); background: rgb(var(--dark-gray-monochrome)); padding: 0.01rem 1rem; margin: 0.5rem 0; box-shadow: var(--quote-shadow); } .lightblock { color: rgb(var(--black-monochrome)); background: rgb(var(--white-monochrome)); padding: 0.01rem 1rem; margin: 0.5rem 0; box-shadow: var(--quote-shadow); } /* Div Quotes */ .styled-quote { color: rgb(var(--black-monochrome)); background: rgb(var(--white-monochrome)); padding: 0.01rem 1rem; margin: 0.5rem 0; box-shadow: var(--quote-shadow); border-left: solid 6px rgb(var(--dark-gray-monochrome)); } .dark-styled-quote { color: rgb(var(--white-monochrome)); background: rgb(var(--gray-monochrome)); padding: 0.01rem 1rem; margin: 0.5rem 0; box-shadow: var(--quote-shadow); border-left: solid 6px rgb(var(--dark-gray-monochrome)); } /* Headings */ h1, h2, h3, h4, h5, h6 { margin-top: 0.5em; margin-left: 0; } /* Table of Contents */ #page-content #toc { --toc-header-bg-color: var(--gray-monochrome); --toc-body-bg-color: var(--pale-gray-monochrome); } /* Table */ .wiki-content-table { box-shadow: var(--quote-shadow); } /* Max-Width Fix */ img, embed, video, object, iframe, table, dark#page-content div, #page-content div table { max-width: 100%; } div#footer:after { content: var(--footer-message); border-left: solid 1px; padding-left: 0.5em; height: 1.4em; display: inline-flex; align-items: center; margin-left: 0.3em; } /* Horizontal Rule Fix */ hr { clear: none; display: flex; } .bibitems .bibitem:after, .footnotes-footer a[href*=javascript]:before { right: -20%; width: 140%; } /* Tab Gap */ .yui-navset .yui-nav { background: rgb(var(--tabs-bottom-border-color)); column-gap: 4px; } .yui-navset { margin-top: 1rem; } /* Page Title */ .meta-title p { margin: 0; } /* printuser */ span.printuser img.small { transition: 0.5s; transition-timing-function: cubic-bezier (0,1,1,0); } span.printuser img.small:hover { transform: scale(2); transition-delay: 0.5s; } #avatar-hover-container { display: none; } /* Stop the unordered lists being in line with the text, this breaks SD banners! */ ul { padding-inline-start: 2.5rem; } /* Template options text fix */ form#edit-page-form #page-templates option, form#edit-post-form #page-templates option, form#new-post-form #page-templates option, form#new-thread-form #page-templates option { color: rgb(var(--swatch-menutxt-dark-color)); } /* Message on Delete/Rename/Move */ #rename-option-rename::before, #rename-option-delete::before { content: "Reminder: Backrooms Wiki users can rename/move pages they own, but use this responsibly (preferably only if there is an error with the name). Only staff are allowed to delete pages, even your own pages: ask Backrooms Wiki staff and we will help you!"; color: red; display: block; margin-top: 1rem; } /* Fix Images */ .scp-image-caption { width: inherit !important; } :is(.image-caption, .scp-image-caption) { width: unset !important; } :is(div.image-block,div.scp-image-block) { align-items: stretch; } :is(div.image-block,div.scp-image-block) img.image { width: 100% !important; border: 0; } .image-container.floatright { float: right; margin-left: 0.7em; } /* Fix Modals */ #odialog-container .content > h1 ~ table, #odialog-container .modal-body > h1 ~ table { grid-auto-rows: auto; } /* Editor Font */ #edit-page-textarea { font-family: var(--editor-font); } /* Make some variables editable at :root level */ #side-bar { --sideblock-heading-text-color: inherit; z-index: 55 !important; } /* Inline maths actually inline */ #MathJax_Message, .math-inline { display: inline; } /* License Box */ #page-content .licensebox .collapsible-block-link { margin-left: .25em; padding: .25em; font-weight: 700; opacity: .5; color: rgb(var(--gray-monochrome)); -webkit-transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; transition: opacity .5s ease-in-out; } #page-content .licensebox .collapsible-block-link:hover { color: rgb(var(--dark-gray-monochrome)); } /* Unordered Lists */ #page-content ul:not(.yui-nav) { padding-left: 1rem; list-style: disc; margin: 1rem 0; } /* Footnote */ a.bibcite:before, a.footnoteref:before { content: "["; } a.bibcite:after, a.footnoteref:after { content: "]"; } /* Little Patches */ html { scroll-behavior: smooth; } body { max-width: 100vw; overflow-x: hidden; } #page-content { max-width: var(--body-width-on-desktop); } /* Mober Phone */ @media only screen and (max-width: 56.25rem) { #side-bar { z-index: 55 !important; } :root { --header-height-on-desktop: var(--header-height-on-mobile); --final-header-height-on-desktop: var(--final-header-height-on-mobile); } /* MOBILE Header */ #header::before { background-position: center calc(50% + 0.55rem); } } :root { --logo-image: url("http://scutoidbox.wikidot.com/local--files/theme:morgana-council/the_morgan.png"); --header-title: "The Morgana Council"; --header-subtitle: "est. 1984"; --header-shine-gradient: linear-gradient(to right, transparent 0, rgba(255,210,71) 5%, rgba(250,185,92,1) 16%, rgba(255,255,255,1) 17%, rgba(255,255,255,1) 33%, rgba(250,185,92,1) 42%, rgba(220,103,91,1) 65%, rgba(220,103,91,1) 76%, rgba(255,160,234,1) 93%, transparent 100%); --header-height-on-mobile: 10rem; /* Fonts */ --title-font: 'Enriqueta', sans-serif; --header-font: 'Enriqueta', sans-serif; --UI-font: 'Poppins', sans-serif; /* --body-font: 'Poppins', sans-serif; */ /* Colors */ --white-monochrome: 209, 198, 190; /* changed */ --pale-gray-monochrome: 229, 205, 223; /* changed */ --light-pale-gray-monochrome: 229, 205, 223; /* changed */ --very-light-gray-monochrome: 196, 135, 181; /* changed */ --light-gray-monochrome: 140, 69, 131; /* changed */ --gray-monochrome: 56, 28, 84; /* changed */ --dark-gray-monochrome: 29, 16, 61; /* changed */ --black-monochrome: 7, 4, 24; /* changed */ --pale-accent: 186, 87, 219; /* changed */ --bright-accent: 228, 162, 43; /* changed */ --medium-accent: 200, 99, 28; /* changed */ --dark-accent: 196, 72, 17; /* changed */ --alt-accent: 221, 102, 17; --visited-link-color: 131, 87, 219; --swatch-prinary-darkest: var(--swatch-primary); --swatch-tertiary-color: var(--light-gray-monochrome); --footer-message: "Is your risk worth taking?"; --wallpaper-mask: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22windows-1252%22%20standalone%3D%22no%22%3F%3E%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xml%3Aspace%3D%22preserve%22%20width%3D%22106.667%22%20height%3D%22154.667%22%3E%3Cpath%20d%3D%22M72.547%201158.57H5.074V-6.465h67.473V1158.57M119.027%20710.25v-58.977l126.95%20154.438L363.43%20654.77v61.476L246.477%20865.688%20119.027%20710.25%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3Cpath%20d%3D%22M119.027%20951.652V790.715l125.45%20153.441L363.43%20792.715v166.933L247.477%201108.09l-128.45-156.438M763.27%201158.57h-63.473l63.473-80.97ZM472.387%201158.57h-67.473V-6.465h67.473V1158.57M518.867%20995.133v-58.977L645.816%201090.6%20763.27%20939.656v61.474l-116.954%20149.44-127.449-155.437M763.27%20657.27%20647.316%20805.711%20518.867%20649.273V488.336l125.449%20153.441L763.27%20490.336V657.27M518.867%201158.57v-82.97l67.973%2082.97z%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3Cpath%20d%3D%22M763.27%20413.867%20646.316%20563.309%20518.867%20407.867v-58.972l126.949%20154.437L763.27%20352.391v61.476M363.43%20128.98%20246.477%20278.422l-127.45-155.438V64.008l126.95%20154.437L363.43%2067.504v61.476%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3Cpath%20d%3D%22M363.43%20205.449v166.934L247.477%20520.824l-128.45-156.437V203.449l125.45%20153.442L363.43%20205.449M518.867%2071.504V-6.465h67.973l57.476%2070.473%2055.481-70.473h63.473V79.5L647.316%20227.941%20518.867%2071.504%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3C%2Fsvg%3E); --wallpaper-mask-size: 2.3rem; /* ui buttons */ --ui-button-bg: var(--bright-accent); --ui-button-txt: var(--black-monochrome); --ui-button-hover-bg: var(--medium-accent); --ui-button-hover-outline: var(--dark-accent); /* sidebar buttons */ --toggle-button-bg: rgb(var(--bright-accent)); --toggle-border-color: rgb(var(--medium-accent)); --toggle-border-width: 0.15rem; --toggle-icon-color: rgb(var(--black-monochrome)); } } /* Header */ #container-wrap #header::before { background-size: auto 8rem; opacity: 0.3; mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0.5)); -webkit-mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0.5)); } /* Header Wallpaper */ #skrollr-body { height: var(--header-height-on-desktop); width: 100vw; background: linear-gradient(to bottom, rgb(var(--light-gray-monochrome)), transparent), linear-gradient(to bottom, rgb(var(--black-monochrome), 0.7), transparent); } /* Rounded Corners */ body { background: rgb(var(--swatch-topmenu-bg-color)) } #content-wrap { background: rgb(var(--swatch-background)); border-radius: 0.5rem 0.5rem 0 0; box-shadow: 0 0.5rem 0 rgb(var(--light-gray-monochrome)) inset, 0 0.6rem 5px rgb(var(--white-monochrome), 0.8) inset, 0 0.9rem 0 rgb(var(--medium-accent)) inset; } /* Border */ #header::before { background-size: auto 9rem; } #header { width: calc(100vw - 2rem); max-width: unset; --login-dropdown-bg-image: linear-gradient(to bottom, rgb(var(--light-gray-monochrome)), rgb(var(--gray-monochrome))); } #header #top-bar { max-width: unset; width: 100%; --topmenu-category-color: var(--swatch-text-secondary-color), 0.8; --topmenu-hover-border-color: var(--bright-accent); --mobile-topmenu-sidebar-button-color: var(--bright-accent); --dropdown-border-color: var(--bright-accent), 0.2; } .top-bar { margin: 0 auto; } #header div.mobile-top-bar { width: 100vw; max-width: unset; margin-right: -2rem; } @media only screen and (max-width: 56.25rem) { #header { width: 100vw; } } #main-content { background-image: linear-gradient(to bottom, rgb(var(--light-gray-monochrome)) 5rem, transparent 100%); margin-top: 0.5rem; background-size: 0.5rem 100vh; background-repeat: no-repeat; padding: 2rem 2rem; /* ui icons */ --ui-icon-color: var(--bright-accent); --ui-icon-bg: var(--medium-accent); --ui-icon-hover-bg: var(--dark-accent); /* tabs content */ --tabs-content-border-color: var(--swatch-tertiary-color), 0.3 /* toc */ --toc-body-bg-color: var(--swatch-background); --toc-directory-lines-color: var(--swatch-tertiary-color); /* tags */ --pagetags-title-bg: var(--swatch-primary); --pagetags-text-color: var(--swatch-primary); --pagetags-text-hover-color: var(--swatch-background); --pagetags-text-hover-bg-color: var(--bright-accent); } #header::after { content: ""; width: 100%; height: 0.4rem; position: absolute; left: 0; top: calc(100% + 0.5rem); display: block; background-image: var(--header-shine-gradient); background-size: 95% 0.4rem; background-repeat: no-repeat; background-position: center; mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0.3)); transform: skew(-15deg, 0); } /* Title */ #page-title, .meta-title { margin-left: -1.5rem; width: fit-content; background: rgb(var(--light-gray-monochrome)); padding: 1rem 2rem; color: rgb(var(--swatch-background)); border-radius: 0 0.5rem 0.5rem 0; margin-bottom: 0.25; position: relative; } #page-title::after, .meta-title::after { display: none; } #page-title::before, .meta-title::before { content: ""; display: block; background: linear-gradient(to bottom, rgb(var(--light-gray-monochrome)) 70%, transparent 100%); width: 0.5rem; height: calc(100% + 10rem); position: absolute; top: -2rem; right: 100%; mask-image: linear-gradient(to bottom, transparent, black 2rem) } .borderblock { color: rgb(var(--white-monochrome)); background: rgb(var(--dark-gray-monochrome)); border: 2px solid rgb(var(--bright-accent)); padding: 0.01rem 1rem; margin: 0.5rem 0; } .dark-borderblock { color: rgb(var(--white-monochrome)); background: rgb(var(--black-monochrome)); border: 2px solid rgb(var(--bright-accent)); padding: 0.01rem 1rem; margin: 0.5rem 0; } .meta-title { margin-left: -2.5rem; /* changed because it's in the #page-content which has padding */ } /* Content */ #page-content { background: rgb(var(--gray-monochrome), 0.3); border-radius: 0.5rem; padding: 0.5rem 1rem; margin-top: 0.5rem; } /* Footer */ #footer { --footer-bg-color: var(--swatch-primary-darkest), 0.7; --footer-text-color: var(--swatch-text-secondary-color), 0.8; --footer-link-hover-color: var(--swatch-background); --footer-link-hover-bg-color: var(--bright-accent); } /* Lincense Area */ #license-area { --license-bg-color: var(--swatch-primary-darkest); --license-link-hover-color: var(--swatch-text-secondary-color); --license-link-hover-bg-color: var(--swatch-primary); }
page revision: 3, last edited: 04 Feb 2024 15:00
Edit Sections
Add to the end
Edit Meta
Watchers
Backlinks
Page Source
Parent
Lock Page
Rename
Delete