This theme was adapted by Kai4C from the legacy M.E.G. Archive theme created by
ShroomDispencer, which is no longer in use on the wiki. Updates for parity with
TrailmixNCocoa's M.E.G. theme are underway!
30th May 2023
- Patches made to fit the NuLiminal theme! Thank you very much to the Wiki Tech Team!
27th January 2023
- Collapsible is now 🌟fancy🌟 and matches the M.E.G. theme! Thank you Trailmix for the code!
- Updated SD classes!
- Image demo changed, as original did not abide by CC guidelines.
4th January 2023
- Fixed margin issue with blockquotes. FINALLY got around to it; it's been bugging me for ages.
24th August 2022
- Logo image stolen borrowed from Trailmix's M.E.G. theme for parity
- Justified and slightly larger text! Big plus for readability! (Note that justified text may not work on browsers other than Chrome and Microsoft Edge)
- Mild coloration adjustments for increased edginess
- Tables now look better! Or maybe worse!
- Updated CECS support! Now with ✨✨icons✨✨!
Kai plans to use this page for Project Holy Grail. Feel free to use this theme for edgy M.E.G. secret pages, etc.
I wonder what links look like?
Level 0
Okay…
To import this theme to your page, put the following text anywhere inside it:
[[include theme:meg-edgy]]
Examples
We are the glimmer of hope.
HABITAT(S): N/A
[[include component:concord
|primary-color= rgb(var(--dark-accent-red))
|secondary-color= rgb(var(--pale-gray-monochrome))
|accent-color= rgb(var(--blinding-red))
|number=193
|habitat=N/A
|goi-specification=[http://backrooms-wiki.wikidot.com/iets IETS]:
|sin=X
|danger=0
|intel=A
|class=Anthropoid
|properties=BNV UNQ MCH
]]
Concord looks good on here, don't it? :D
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Included page "component:sd-class-iftags" does not exist (create it now)
Security Classification: PUBLIC
Security Classification: RESTRICTED
Security Classification: CLASSIFIED
Security Classification: SECRET
Security Classification: TOP SECRET
Security Classification: OTHER (PLEASE SPECIFY)
A horizontal rule can be created with 5 hyphens "-----" and extends across the whole page if it's not placed inside anything (e.g. a blockquote) or blocked by something (e.g. an image). The lines separating sections of this document are horizontal rules.
Titles can be created by putting between one and six plus "+" at the start of the line
First Title
Second Title
Third Title
Fourth Title
Fifth Title
Sixth Title
|
Table of Contents
|
Edgy Gamercore text here
Get coconut mall'd here
This is a long tab. It contains a lot of text.
This is a long tab. It contains a lot of text.
This is a long tab. It contains a lot of text.
This is a long tab. It contains a lot of text.
This is a long tab. It contains a lot Of text.
This is a long tab. It contains a lot Kf text.
This is a long tab. It contains a lot Bf text.
This is a long tab. It contains a lot Of text.
This is a long tab. It contains a lot Of text.
This is a long tab. It contains a lot Mf text.
This is a long tab. It contains a lot Ef text.
This is a long tab. It contains a lot Rf text.
TESTING
The quick brown fox jumps over the lazy dog.
THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG.
Quick Brown Fox:
The quick brown fox jumps over the lazy dog.
THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG.
Kai's personal testing space.
The Serpents Offering 3 - 0 - 76397
You shouldn't be here! Shoo!
Tournesol 1 - 0 - 42333
You shouldn't be here! Shoo!
Icarus Procidens 2 - 0 - 30312
You shouldn't be here! Shoo!
Entity 555 3 - 0 - 30043
You shouldn't be here! Shoo!
Entity 73 0 - 0 - 29183
You shouldn't be here! Shoo!
Level 294 0 - 0 - 26683
You shouldn't be here! Shoo!
Level 881 0 - 0 - 26292
You shouldn't be here! Shoo!
Entity 19 0 - 0 - 22473
You shouldn't be here! Shoo!
Entity 140 0 - 0 - 22262
You shouldn't be here! Shoo!
Level 611 3 - 0 - 21722
You shouldn't be here! Shoo!
Entity 4 0 - 0 - 21566
You shouldn't be here! Shoo!
Level 51 1 - 0 - 21351
You shouldn't be here! Shoo!
Oneiroscape 1 - 0 - 21240
You shouldn't be here! Shoo!
Entity 78 2 - 0 - 19845
You shouldn't be here! Shoo!
Entity 19 1 - 0 - 18381
You shouldn't be here! Shoo!
Entity 78 - “The Twin Stars” - 0 - 18023
You shouldn't be here! Shoo!
Icarus Procidens 1 - 0 - 17971
You shouldn't be here! Shoo!
Philia 0 - 0 - 17891
You shouldn't be here! Shoo!
Report: AP-78-Twin - 0 - 17841
You shouldn't be here! Shoo!
Oneiroscape 0 - 0 - 16400
You shouldn't be here! Shoo!
don't do drugs, kids.
THIS IS A LARGE HEADER
This is a blockquote, created by putting "> " at the start of each line.
Smol Header:
Level 0 That’s a link
Nested blockquotes
And another1
Lightblock
[[div class="lightblock"]]
This is a lightblock! In case your quoteblock feels just a bit too edgy…
[[/div]]
Darkblock
[[div class="darkblock"]]
This is a darkblock! In case your quoteblock isn’t edgy enough!
[[/div]]
Styled quote
[[div class="styled-quote"]]
This is a styled quote! In case your lightblock feels just a bit too boring…
[[/div]]
Dark styled quote
[[div class="dark-styled-quote"]]
This is a dark styled quote! In case your darkquote still isn’t spicy enough!
[[/div]]
Report: Blocks that work nice in blockquotes!
[[div class="styled-quote2"]]
Description:
Context context context context!<— Note the difference in border color from a regular styled quote!
[[/div]]
<BEGIN RECORDING>
Man: Isn't this an awesome theme?Woman: No, it's too edgy!
[[div class="darkblock2"]]
He pauses and frowns. Man is confused - isn't it supposed to be edgy?
Text works as normal here btw but I think it looks cooler in teletype.
[[/div]]Man: Look at how groovy that block above this line is! Now we don't have to use ugly square brackets and stuff between our speaking lines!
WOman: No I don't care I don't like it, it's still too edgy
<END RECORDING>
Logo block
[[div class="logoblock"]]
This is a logo block! It comes with a pre-built M.E.G. Logo at the bottom! Wow!
Use this block for extra edgy Overseer directives. Teehee!
One more thing — you should probably fill in at least a full line in this thing…
[[/div]]
…or it might look slightly wonky, like this.
Sorry :/
| This is a table | |
|---|---|
| ||~ for a header|| | and || for a cell|| |
| Adding an extra || like ||||this|| should break to the next line… I think? | |
The Header & Body font is Share Tech Mono.
The Header font is Oxygen Mono.
The Title font WAS Anonymous Pro and is now Kelly Slab. Please appreciate the font and the title gradient… it took me FOUR DAYS… T_T
The monospace font used is PT Mono.
Foot2
@import url(https://backrooms-pantheon.wdfiles.com/local--code/component%3Apatch/1); /* Fonts */ @import url('https://fonts.googleapis.com/css?family=Lato:400,900|PT+Mono|Poppins:600,800|Share+Tech+Mono|Anonymous+Pro'); @import url('https://fonts.googleapis.com/css2?family=Baumans&family=Graduate&family=Kelly+Slab&family=Kumar+One&family=Tulpen+One&family=ZCOOL+QingKe+HuangYou&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Oxygen+Mono&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Overpass+Mono:wght@300&display=swap'); /* All Vars Used */ :root { /* S-CSS-P Integration */ /* If you're making a new CSS theme, please include the following three variables at minimum. */ --theme-base: "nuscp"; /* mua be either "nuscp" or "sigma9" */ --theme-id: "meg-edgy"; /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */ --theme-name: "MEG EDGY"; /* set this to your theme's full name */ /* Header */ --logo-image: url("http://backrooms-pantheon.wikidot.com/local--files/theme:meg/IMG_3129.png"); --header-title: "M.E.G. Records"; --header-subtitle: "The M.E.G. Classified Database"; /* Typefaces */ --body-font: 'Share Tech Mono', monospace; --header-font: 'Oxygen Mono', monospace; --title-font: 'Kelly Slab', cursive; --mono-font: "PT Mono", "Andale Mono", "Courier New", Courier, monospace; /* Standard Colors */ --white-monochrome: 252, 252, 252; /* white */ --pale-gray-monochrome: 185, 185, 185; /* v light gray for blockquotes and stuff */ --light-gray-monochrome: 170, 170, 170; /* light accent gray for login status */ --gray-monochrome: 66, 66, 72; /* gray */ --grayer-monochrome: 130, 130, 135; --dark-gray-monochrome: 48, 48, 52; /* dark accent gray for sidebar background */ --black-monochrome: 30, 20, 20; /* black */ --bright-accent: 125, 25, 25; /* Some sidebar text, edit button text etc */ --medium-accent: 74, 0, 0; /* the annoying header thing */ --dark-accent: 12, 12, 12; /* search bar and edit button */ --newpage-color: 230, 10, 10; /* text highlight colour, url link */ --terminal-medium: 74, 0, 0; /* edit button borders */ --pale-accent: 0, 221, 221; /* dark yellow-brown */ --tester-blue: 0, 0, 221; /* blue for testing */ --tester-green: 0, 221, 0; /*green for testing */ --tester-purple: 221, 0, 221; /*purple for testing */ --tester-yellow: 221, 221, 0; /*yellow for testing */ --dark-accent-red: 74, 0, 0; --mid-accent-red: 140, 25, 30; --bright-red: 170, 15, 15; --shadow-red: 30, 20, 20; --darkish-red: 95, 10, 10; --blinding-red: 230, 10, 10; --contrast-salmon: 250, 160, 160; /* Primary Theme Colors */ --swatch-background: var(--grayer-monochrome); --swatch-primary: var(--newpage-color); --swatch-primary-darker: var(--mid-accent-red); --swatch-primary-darkest: var(--shadow-red); /* Primary Text Colors */ --swatch-text-dark: var(--darkish-red); --swatch-text-light: var(--light-gray-monochrome); --swatch-important-text: var(--tester-purple); /* Primary Menu Colors */ --swatch-menubg-color: var(--shadow-red); --swatch-menubg-light-color: var(--dark-accent); --swatch-menubg-medium-color: var(--mid-accent-red); --swatch-menubg-medium-dark-color: var(--bright-red); --swatch-menubg-dark-color: var(--mid-accent-red); --swatch-menubg-black-color: var(--mid-accent-red); --swatch-menubg-hover-color: var(--mid-accent-red); --swatch-menutxt-dark-color: var(--bright-red); --swatch-menutxt-light-color: var(--light-gray-monochrome); --swatch-border-color: var(--dark-gray-monochrome); /* Primary Header Colors */ --swatch-headerh1-color: var(--light-gray-monochrome); --swatch-headerh2-color: var(--blinding-red); --swatch-topmenu-border-color: var(--dark-accent-red); --swatch-topmenu-bg-color: var(--dark-accent-red); /* Header Gradients*/ --gradient-header: linear-gradient(to bottom, rgba(var(--dark-accent-red),0.97) 10%, rgba(var(--dark-accent-red),0.97) 40%, rgb(var(--black-monochrome)) 100%); --gradient-topmenu: linear-gradient(to bottom, white 0%, white 7.5rem, rgba(var(--swatch-topmenu-border-color), 1) 7.5rem, rgba(var(--swatch-topmenu-bg-color), 1) 7.625rem, rgba(var(--swatch-topmenu-bg-color), 0.95) calc(100% - 0.125rem), rgba(var(--swatch-topmenu-bg-color), 1) calc(100% - 0.125rem), rgba(var(--swatch-topmenu-border-color), 1) 100%); --gradient-topmenu-mobile: linear-gradient(to bottom, rgba(var(--swatch-topmenu-border-color), 1) 0, rgba(var(--swatch-topmenu-bg-color), 1) 0.125rem, rgba(var(--swatch-topmenu-bg-color), 1) calc(3rem - 0.125rem), rgba(var(--swatch-topmenu-bg-color), 1) calc(3rem - 0.125rem), rgba(var(--swatch-topmenu-border-color), 1) 3rem); --diagonal-stripes: linear-gradient(transparent 0); --gradient-sidemenu-header: linear-gradient(10deg, rgba(var(--mid-accent-red), 0.45) 0%, rgba(var(--mid-accent-red), 0.55) 100%); --header-background-image-size: 100% 7.5rem; /* Sidebar */ --sidebar-transition-timing: 0.5s ease-in-out 0.1s; --sidebar-internal-border-thickness: 0.16rem; --background-gradient-color: var(--grayer-monochrome); --background-gradient-distance: 50rem; } /* REMOVING HOVER OF THE PAGE OPTIONS ICONS HERE*/ div[id*="page-options-bottom"] { --swatch-tertiary-color: none; } #container { background-image: radial-gradient(circle, rgb(var(--light-gray-monochrome), 0.05) 50%, transparent 0); background-size: 0.25em 0.25em; background-repeat: repeat; background-attachment: fixed; text-align: justify; text-justify: inter-word; font-size: 1.1em; } html, body, #side-bar:hover { scrollbar-color: rgb(var(--tester-blue)) rgb(var(--tester-green)); } ::-webkit-scrollbar, #side-bar:hover::-webkit-scrollbar { background-color: rgb(var(--shadow-red)); } ::-webkit-scrollbar-thumb, #side-bar:hover::-webkit-scrollbar-thumb { background-color: rgb(var(--mid-accent-red)); } .scp-image-block .scp-image-caption { font-size: .8em; background-color:rgb(var(--dark-accent)); color: rgb(var(--bright-red)); } #header h1 { color: rgb(var(--tester-green)); } #page-title { font-family: 'Kelly Slab', cursive; border-color: rgba(var(--mid-accent-red))!important; background: linear-gradient(to bottom, rgba(var(--shadow-red),0.97) 0%, rgba(var(--dark-accent-red),0.97) 35%, rgb(var(--bright-red)) 80%); background-clip: text; -webkit-background-clip: text; -moz-background-clip: text; -moz-text-fill-color: transparent; -webkit-text-fill-color: transparent; } #side-bar div.menu-item .sub-text { color: rgb(var(--pale-gray-monochrome)); } #login-status { color: rgb(var(--medium-accent)); } .code { padding: 5px 5px 5px 15px; margin-bottom:10px; width: 100%; font-family: var(--header-font); font-size: 1.1em; background-color:rgb(var(--shadow-red)); border: 2px dashed rgb(var(--mid-accent-red)); color: rgb(var(--bright-red)); } .hl-main { filter: invert(1) hue-rotate(180deg); } .page-options-bottom a { background-color:rgb(var(--shadow-red)) !important; color: rgb(var(--blinding-red)) !important; font-family: var(--header-font); } table.wiki-content-table th { text-align: left !important; font-family: var(--title-font) !important; color: rgb(var(--pale-gray-monochrome)); background-color: rgb(var(--dark-accent-red)) !important; border: 1px solid rgb(var(--mid-accent-red)) !important; } table.wiki-content-table tr { background-color:rgba(var(--gray-monochrome), 0.15) !important; border: 1px solid rgb(var(--mid-accent-red)) !important; color: rgb(var(--tester-purple)); } table.wiki-content-table td { background-color: rgba(var(--gray-monochrome), 0.15)!important; border: 1px solid rgb(var(--mid-accent-red)) !important; color: rgb(var(--dark-accent-red)); } .footnotes-footer { margin-bottom:10px; width: 100%; font-family: var(--body-font); font-size: 1.1em; --footnotes-footer-bg-color: 133,110,115; color: rgb(var(--dark-accent-red)); } span.printuser { color: rgb(var(--light-gray-monochrome)) !important; } table.wiki-content-table { border: 2px solid rgb(var(--mid-accent-red)); } hr { background-color: rgb(var(--bright-accent)) !important; /* TABS */ } .yui-navset .yui-nav li a em, .yui-navset-top .yui-nav li a em, .yui-navset-bottom .yui-nav li a em { color: rgb(var(--bright-red)); } .yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a em { color: rgb(var(--light-gray-monochrome)); } /* RATING MODULE */ .page-rate-widget-box { background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--dark-accent),1)), to(rgba(var(--dark-accent), 1))); background: -webkit-linear-gradient(bottom, rgba(var(--dark-accent),1) 0%, rgba(var(--dark-accent), 1) 100%); background: -o-linear-gradient(bottom, rgba(var(--dark-accent),1) 0%, rgba(var(--dark-accent), 1) 100%); background: linear-gradient(to top, rgba(var(--dark-accent),1) 0%, rgba(var(--dark-accent), 1) 100%); border: 2px solid rgb(var(--mid-accent-red)); } #page-content .rate-box-with-credit-button { background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--dark-accent),1)), to(rgba(var(--dark-accent), 1))); background: -webkit-linear-gradient(bottom, rgba(var(--dark-accent),1) 0%, rgba(var(--dark-accent), 1) 100%); background: -o-linear-gradient(bottom, rgba(var(--dark-accent),1) 0%, rgba(var(--dark-accent), 1) 100%); background: linear-gradient(to top, rgba(var(--dark-accent),1) 0%, rgba(var(--dark-accent), 1) 100%); border-color: rgb(var(--mid-accent-red)); } .page-rate-widget-box .rate-points { color: rgb(var(--bright-red)) !important; } .page-rate-widget-box .rateup, .page-rate-widget-box .ratedown, .page-rate-widget-box .cancel, .page-rate-widget-box .rateup a, .page-rate-widget-box .ratedown a, .page-rate-widget-box .cancel a { background-color: rgb(var(--dark-accent-red)) !important; } #page-content .rate-box-with-credit-button > .creditButton > p > a::before { background-color: rgb(var(--dark-accent-red)); } #page-content .rate-box-with-credit-button > .creditButton:hover { background: rgba(var(--tester-green), 0.8); } .page-rate-widget-box .ratedown a:hover, .page-rate-widget-box .rateup a:hover, .page-rate-widget-box .cancel a:hover { background-color: rgb(var(--bright-red)) !important; } .scp-image-block { border: solid .1625rem rgb(var(--mid-accent-red)); } .blockquote, [class*=blockquote], blockquote, div.blockquote { padding: 5px 15px 5px 15px; margin-bottom: 10px; background-color:rgb(var(--shadow-red)) !important; border: 3px solid rgb(var(--mid-accent-red)) !important; color: rgb(var(--light-gray-monochrome)) !important; margin: 10px auto 0; } blockquote blockquote, .blockquote blockquote { padding: 5px 15px 5px 15px; border: 3px solid rgb(var(--mid-accent-red)); color: rgb(var(--bright-red)) !important; font-size: 1rem; margin: 10px auto 0; } #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] { background-color: rgb(var(--dark-accent)); } #search-top-box:not(:focus-within)::before { color: rgb(var(--dark-accent)); } #top-bar div.mobile-top-bar > ul > li > a, #top-bar div.top-bar > ul > li > a { color: rgb(var(--pale-gray-monochrome)); } #top-bar div.mobile-top-bar > ul > li > a:hover, #top-bar div.top-bar > ul > li > a:hover, #top-bar div.mobile-top-bar > ul > li:hover > a, #top-bar div.top-bar > ul > li:hover > a { color: rgb(var(--white-monochrome)); } .open-menu a { color: rgb(var(--tester-purple)) !important; } @-webkit-keyframes marquee { 0% { -webkit-transform: translateX(100%); transform: translateX(100%) } 100% { -webkit-transform: translateX(-100%); transform: translateX(-100%) } } @keyframes marquee { 0% { -webkit-transform: translateX(100%); transform: translateX(100%) } 100% { -webkit-transform: translateX(-100%); transform: translateX(-100%) } } @media only screen and (max-width: 768px) { #header h2 { overflow: hidden; height: 100%; pointer-events: none; } #header h2 span { -webkit-animation: marquee linear 10s infinite; animation: marquee linear 10s infinite; width: 150% !important; margin-left: 0; margin-right: 0; padding: 0; } #header h1 span { font-size: 75%; } #top-bar { font-size: calc(var(--base-font-size)*0.70); } } .hovertip{ background-color:rgb(var(--shadow-red)) !important; background-image:radial-gradient(ellipse 1000% 100% at 50% 90%, transparent,rgb(var(--shadow-red))) !important; } #side-bar { background-size: 0%; } .blockquote h1, .blockquote h2, .blockquote h3, .blockquote h4, .blockquote h5, blockquote h1, blockquote h2, blockquote h3, blockquote h4, blockquote h5 { color: rgb(var(--bright-red)); } .styled-quote { text-align: justify; text-justify: inter-word; color: rgb(var(--dark-accent-red)); background-color:rgb(var(--pale-gray-monochrome)); border-left: 0.5rem solid rgba(var(--dark-accent-red)); } .styled-quote2 { color: rgb(var(--dark-accent-red)); background-color:rgb(var(--pale-gray-monochrome)); border-left: 0.5rem solid rgba(var(--mid-accent-red)); padding: 5px 15px 5px 15px; margin-right: 5px; } .dark-styled-quote { color:rgb(var(--blinding-red)); background-color:rgb(var(--dark-accent-red)); border-left: 0.5rem solid rgba(var(--bright-red)); } .lightblock { background-color:rgb(var(--pale-gray-monochrome)); } .darkblock { background-color:rgb(var(--dark-accent-red)); color:rgb(var(--blinding-red)); } .darkblock2 { background-color:rgb(var(--dark-accent-red)); color:rgb(var(--blinding-red)); display: grid; text-align: justify; word-wrap: normal; font-size: 85%; padding: 5px 10px 5px 15px; margin-right: 5px; } .testingblock{ color: rgb(var(--mid-accent-red)); border: solid 2px rgb(var(--mid-accent-red)); padding: 0.01rem 1rem 1rem 1rem; margin: 0.5rem 0 0.5rem 0.20rem; box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25); background: url(http://backrooms-pantheon.wdfiles.com/local--files/theme%3Ameg-edgy/F59005DF-954F-4EB8-8116-2E7F06FB4211.png) center/20% no-repeat; background-color: rgb(var(--pale-gray-monochrome));; background-position: right 50% bottom 25px; padding-bottom: 65px; position: relative; /* clear: both; */ display: table; } .testingblock::after{ content: "M.E.G. - Bettering Humanity"; display: flex !important; justify-content: center !important; font-family: 'Kelly Slab', cursive; font-weight: bold; font-size: 80%; color: black; background-color: rgb(var(--pale-gray-monochrome)); position: relative; transform: translateY(325%); } .logoblock{ padding: 5px 15px 5px 15px; /* adds space - up right down left */ font-size: 1rem; font-family: 'Share Tech Mono'; background: url(http://backrooms-wiki.wdfiles.com/local--files/theme%3Ameg-edgy/F59005DF-954F-4EB8-8116-2E7F06FB4211.png) center/20% no-repeat; background-color: rgb(var(--pale-gray-monochrome)); background-position: right 50% bottom 25px; border: 3px solid rgb(var(--mid-accent-red)); border-radius: 15px; color: rgb(var(--black-monochrome)); margin: 10px auto 0; /* Adds a space above the box */ padding-bottom: 65px; position: relative; /*clear: both; */ display: table; } .logoblock::after{ content: "M.E.G. - Bettering Humanity"; display: flex !important; justify-content: center !important; font-family: 'Kelly Slab', cursive; font-weight: bold; font-size: 80%; color: black; background-color: rgb(var(--pale-gray-monochrome)); position: relative; transform: translateY(325%); } .logoblock h2{ color: rgb(var(--dark-accent-red)); } #toc.floatright { background-color: rgb(var(--dark-accent-red)) !important; color:rgb(var(--black-monochrome)); box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25); border: 3px solid rgb(var(--dark-accent-red)) !important; padding: 0rem; margin: 1rem !important; } #toc-action-bar { background-color:rgb(var(--dark-accent-red)) !important; } #toc .title { background-color:rgb(var(--dark-accent-red)) !important; padding: 0.25em 2em 0.25em 0; } #toc a { text-align: left !important; color: rgb(var(--mid-accent-red)) !important; } #toc #toc-action-bar a::after { content: "Table of Contents"; border-color:rgb(var(--tester-yellow)) !important; position: absolute; left: 104%; transition: font-weight 0.15s var(--ease-in-out), font-variation-settings 0.15s var(--ease-in-out); white-space: nowrap; } #toc #toc-action-bar a::before { content: ""; display: inline-block; position: relative; width: 1em; height: 1em; background-color: rgb(var(--blinding-red)); -webkit-mask: var(--mask-image) center center / 100% no-repeat; mask: var(--mask-image) center center / 100% no-repeat; } #toc #toc-action-bar a:first-of-type::before { --mask-image: var(--down-arrow-mask); left: -0.85em; -webkit-mask-size: 2em 0.3625em; mask-size: 2em 0.3625em; background-color: green !important; } #toc #toc-action-bar a:last-of-type::before { --mask-image: var(--right-arrow-mask); left: 0em; bottom: 0.2em -webkit-mask-size: 0.3625em 2em; mask-size: 0.3625em 2em; background-color: rgb(var(--blinding-red)) !important; } #toc #toc-action-bar a, #toc #toc-action-bar a:visited { color: rgb(var(--pale-gray-monochrome)) !important; } #toc #toc-action-bar a:is(:hover, :active, :focus, :focus-within) { color: rgb(var(--blinding-red)) !important; } #toc #toc-action-bar a:is(:hover, :active, :focus, :focus-within)::before { color: rgb(var(--tester-yellow)) !important; } #toc #toc-list div[style*="margin-left"] { margin-left: 1em !important; } #toc #toc-list div[style*="2em"] { padding-left: 0.75em !important; } #toc #toc-list div[style*="2em"]::before { content: "╶"; } #toc #toc-list div[style*="3em"] { padding-left: 1.75em !important; } #toc #toc-list div[style*="3em"]::before { content: "╶─"; } #toc #toc-list div[style*="4em"] { padding-left: 2.75em !important; } #toc #toc-list div[style*="4em"]::before { content: "╶───"; } #toc #toc-list div[style*="5em"] { padding-left: 3.75em !important; } #toc #toc-list div[style*="5em"]::before { content: "╶────"; } #toc #toc-list { position: relative; border-color: rgb(var(--tester-yellow)) !important; /*I don't know how this works but it sort of does */ } /* Collapsible code from Trailmix */ :root{ --base-color: rgb(var(--dark-accent-red)); --hover-color: rgb(var(--blinding-red)); --click-color: green; } /* #page-content is shoved everywhere to make sure it's the most specific thingy */ /* Styling! */ #page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded-link { margin-top: 10px; padding-left: 1rem; padding-right: 1rem; box-shadow: rgb(128, 128, 128) 0px 0px 3px 0px; /* Animated things */ transition: background 0.2s linear; background: var(--base-color); /* Technical bits */ width: min-content; white-space: nowrap; overflow: hidden; } /* The Clicky Text */ #page-content .collapsible-block-link { color: rgb(var(--pale-gray-monochrome)); font-weight: bold; text-decoration: none; } /* Gets rid of the underline when hovering over the collapsible */ #page-content .collapsible-block-link:hover { text-decoration: none } /* Collapsible content */ #page-content .collapsible-block-content { /* Animated things */ transition: border-top-color 0.2s linear, border-bottom-color 0.2s linear; border-top: solid var(--base-color) 5px; border-bottom: solid var(--base-color) 3px; } /* Folded blocks are animated, unfolded ones are not */ #page-content .collapsible-block-folded { max-width: 100%; } #page-content .collapsible-block-unfolded-link{ width: min-content; } /* Addendum counter */ /* Addendum prefixes */ #page-content .collapsible-block-folded .collapsible-block-link::before { content: "▷"; color: rgb(var(--blinding-red)); border-right: none; padding-right: 0rem; margin-right: 1rem; font-weight: normal; font-family: var(--mono-font); } #page-content .collapsible-block-unfolded .collapsible-block-link::before { content: "▽"; color: rgb(0,128,0); border-right: none; padding-right: 0rem; margin-right: 1rem; font-weight: normal; font-family: var(--mono-font); } /* Hovering effects */ #page-content .collapsible-block-folded:hover { background: var(--hover-color); max-width: 100%; } #page-content .collapsible-block-unfolded-link:hover { background: var(--click-color); max-width: 100%; } /* Collapsible borders - because it looks prettier this way */ #page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content{ border-top-color: green; border-bottom-color: green; } /* When hovering over link, change addendum tag to hover-color */ #page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content::after { background: green; } /* Click flash when clicking, also forces the collapsible to expand */ #page-content .collapsible-block-folded:active { transition: background 0s, max-width 0s; background: var(--click-color); max-width: 100%; } #page-content .collapsible-block-unfolded-link:active, #page-content .collapsible-block-unfolded-link:active + .collapsible-block-content::after { transition: background 0s, max-width 0s; background: var(--hover-color); max-width: 100%; } /* On click, change borders to click-color */ #page-content .collapsible-block-unfolded-link:active + .collapsible-block-content { transition: border-top-color 0s, border-bottom-color 0s; border-top-color: var(--hover-color); border-bottom-color: var(--hover-color); } /* Done with normal collapsibles, now we do all the variations */ /* Unfolded collapsible */ #page-content .unfolded-collapse { margin-top: 10px; padding-left: 1rem; padding-right: 1rem; box-shadow: rgb(128, 128, 128) 0px 0px 3px 0px; background: var(--base-color); /* Text */ color: white; font-weight: bold; /* Technical bits */ width: min-content; white-space: nowrap; overflow: hidden; } /* Addendum prefix */ #page-content .unfolded-collapse::before { content: "▽"; color: green !important; border-right: none; padding-right: 0rem; margin-right: 1rem; font-weight: normal; font-family: var(--mono-font); } /* Bottom border */ #page-content .unfolded-collapse-border { display: block; width: 700px; border-top: solid var(--base-color) 5px; } /* Centering, very simple */ #page-content .center-collapse .collapsible-block-folded, #page-content .center-collapse .collapsible-block-unfolded-link, #page-content .center-collapse .unfolded-collapse{ margin:auto; margin-top: 10px; } /* SD Classes */ /* sd banner colours */ .sd-container { /* font */ --sd-font:'PT Mono'; /* borders */ --sd-border:var(--dark-accent-red); /* for most classes */ --sd-border-secondary:0,0,0; /* for n/a */ --sd-border-deadzone:20,0,0; /* for deadzone */ /* symbols */ --sd-symbol:var(--sd-border) !important; /* for most symbols */ --sd-symbol-secondary: 255,255,255; /* white for class 4 and higher */ /* text */ --sd-bullets:var(--sd-border) !important; /* the colour of the bullet point text */ --sd-text:var(--white-monochrome); /* the colour of the text in the top box */ /* class colours */ --class-0:217, 197, 97; --class-1:247,227,117; --class-1:255,201,14; --class-2:245,156,0; --class-3:249,90,0; --class-4:254,23,1; --class-5:175,6,6; --class-unknown:38,38,38; --class-habitable:26,128,111; --class-deadzone:44,13,12; --class-pending:182,182,182; --class-n-a:38,38,38; --class-amended:185,135,212; --class-omega:45,55,255; }


