The Liminal Space Organization Light Theme
Hello! This is a popup info box!
The theme is the light version of the
LSO Theme made by
Super-Robot14 that is intended for the Liminal Space Organization GOI, and the Spacetime Canon, which is currently being written.
except the logo is centered, filled out and stretched here; the font is different… yeah this is just not the same anymore
To import this theme into your page, put the following code anywhere inside it:
[[include :backrooms-wiki:theme:lso-light]]
A horizontal rule can be created with 5 hyphens "-----" and extends across the whole page if it's not placed inside anything (ex. a blockquote). 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 (you really shouldn't need to use more than 4 in most circumstances).
First Title
Second Title
Third Title
Fourth Title (pretty tiny)
Fifth Title (literally tiny)
Sixth Title (can you even see it?)
create all your amazing stuff here.
Greetings form this Tab!
:)
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 of text.
This is a long tab. It contains a lot of text.
no
This is a long tab. It contains a lot of text.
why?
This is a long tab. It contains a lot of text.
idk
This is a long tab. It contains a lot of text.
…
This is a long tab. It contains a lot of text.
sorry
This is a long tab. It contains a lot of text.
nope sorry, not empty lol
This is a blockquote, created by putting "> " at the start of each line.
More text
That's a horizontal rule
wow.
Nested blockquotes
And another
| This is a |
table |
| You should know |
how to make these |
| already. hopefully that is |
This is in the middle. =)
Aaand This is in the right, never in the wrong!
Foot
this text
is here
so you can
see how
everything looks
with different
formatsand
otherstuff
including links that do not link
like this useless thing here; trust me this will never exist
And links that do exist!
[[div class="master-quote"]]
[[/div]]
[[div class="lightblock"]]
[[/div]]
[[div class="accentblock"]]
[[/div]]
[[div class="lightstyled-quote"]]
[[/div]]
[[div class="accentstyled-quote"]]
[[/div]]
[[div class="logo-block"]]
[[/div]]
[[div class="border-logoblock"]]
[[/div]]
[[div class="stripe-block"]]
[[/div]]
[[div class="stripe-block animated"]]
[[/div]]
[[div class="borderblock"]]
[[/div]]
INSERT TEXT
[[div class="titleblock"]]
[[span class="titlebox"]]INSERT TEXT[[/span]]
[[/div]]
[[div class="lightblock true-dark"]]
[[/div]]
[[div class="darkblock"]]
[[/div]]
[[div class="lightstyled-quote true-dark"]]
[[/div]]
[[div class="darkstyled-quote"]]
[[/div]]
[[div class="logoblock true-dark"]]
[[/div]]
[[div class="border-logoblock true-dark"]]
[[/div]]
[[div class="stripe-block true-dark"]]
[[/div]]
[[div class="stripe-block true-dark animated"]]
[[/div]]
[[div class="borderblock true-dark"]]
[[/div]]
INSERT TEXT
[[div class="titleblock true-dark"]]
[[span class="titlebox"]]INSERT TEXT[[/span]]
[[/div]]
@import url(https://backrooms-wiki.wdfiles.com/local--code/theme%3Also);
@import url('https://fonts.googleapis.com/css2?family=Tektur:wght@400..900&display=swap');
:root {
--logo-image: url("http://abdallah-backrooms-wiki.wikidot.com/local--files/theme:lso-light/LSOlogoFilled.png");
--wire-logo: url("http://abdallah-backrooms-wiki.wikidot.com/local--files/theme:lso-light/Logo.svg");
--wire-logo-inverted: url("http://backrooms-wiki.wikidot.com/local--files/theme:lso/Logo");
--ctv-background-color: 235, 235, 235;
--ctv-main-color: 164, 128, 185;
--ctv-accent-color: 255, 187, 0;
--ctv-text-color: 17, 23, 15;
--swatch-primary: 164, 128, 185;
--swatch-primary-darker: 156, 122, 176;
--swatch-primary-darkest: 145, 113, 163;
--swatch-text-light: var(--ctv-background-color);
--swatch-menutxt-light-color: var(--ctv-background-color);
--swatch-topmenu-bg-color: var(--swatch-primary);
--modal-bg: var(--ctv-background-color);
--wallpaper-mask: none;
--body-font: 'Tektur', monospace;
--UI-font: 'Tektur', monospace;
--title-font: 'Tektur', monospace !important;
--min-font-size: .9375rem;
--max-font-size: 1.0817rem;
--sidebar-width-on-desktop: calc(var(--base-font-size) * 19);
letter-spacing: 0.5px;
}
#header {
--login-dropdown-text-color: var(--swatch-text-general);
}
#top-bar {
--dropdown-links-color: var(--swatch-text-general);
}
#main-content {
--ui-button-hover-txt: var(--gray-monochrome);
--ui-icon-hover-color: var(--gray-monochrome);
--ui-icon-hover-bg: var(--alt-accent);
--ui-button-hover-bg: var(--alt-accent);
}
#header::before {
background-size: 25rem 10rem;
background-position: center;
opacity: 0.75;
background-blend-mode: overlay;
top: 0;
}
#header h1 a::before,
#header h2 span::before {
color: rgb(var(--ctv-background-color));
}
#skrollr-body::before {
-webkit-mask-image: var(--wallpaper-mask);
mask-image: var(--wallpaper-mask);
}
#main-content {
--wallpaper-mask: url("");
--wallpaper-mask-size: 0rem;
--tabs-selected-bg: var(--swatch-primary-darkest);
--tabs-selected-outline: var(--swatch-primary-darkest);
}
#main-content::after {
background-image: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2016%20206%22%20version%3D%221.1%22%20id%3D%22svg55%22%20sodipodi%3Adocname%3D%22sidebar-arrows.svg%22%20inkscape%3Aversion%3D%221.1.2%20%280a00cf5339%2C%202022-02-04%29%22%20xmlns%3Ainkscape%3D%22http%3A%2F%2Fwww.inkscape.org%2Fnamespaces%2Finkscape%22%20xmlns%3Asodipodi%3D%22http%3A%2F%2Fsodipodi.sourceforge.net%2FDTD%2Fsodipodi-0.dtd%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Asvg%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cdefs%20id%3D%22defs59%22%2F%3E%0A%3Csodipodi%3Anamedview%20id%3D%22namedview57%22%20pagecolor%3D%22%23ffffff%22%20bordercolor%3D%22%23666666%22%20borderopacity%3D%221.0%22%20inkscape%3Apageshadow%3D%222%22%20inkscape%3Apageopacity%3D%220.0%22%20inkscape%3Apagecheckerboard%3D%220%22%20showgrid%3D%22false%22%20inkscape%3Azoom%3D%223.1504854%22%20inkscape%3Acx%3D%227.9352851%22%20inkscape%3Acy%3D%22103%22%20inkscape%3Awindow-width%3D%221600%22%20inkscape%3Awindow-height%3D%22840%22%20inkscape%3Awindow-x%3D%220%22%20inkscape%3Awindow-y%3D%220%22%20inkscape%3Awindow-maximized%3D%221%22%20inkscape%3Acurrent-layer%3D%22svg55%22%2F%3E%0A%3Ctitle%20id%3D%22title43%22%3Esidebar-tab%3C%2Ftitle%3E%0A%3Cpolygon%20points%3D%2213%20100%208%20100%208%2098%203%20102%208%20106%208%20104%2013%20104%2013%20100%22%20fill%3D%22%23000000%22%20id%3D%22polygon49%22%2F%3E%0A%3Cpolygon%20points%3D%2213%2040%208%2040%208%2038%203%2042%208%2046%208%2044%2013%2044%2013%2040%22%20fill%3D%22%23000000%22%20id%3D%22polygon51%22%2F%3E%0A%3Cpolygon%20points%3D%2213%20160%208%20160%208%20158%203%20162%208%20166%208%20164%2013%20164%2013%20160%22%20fill%3D%22%23000000%22%20id%3D%22polygon53%22%2F%3E%0A%3C%2Fsvg%3E");
}
.stripe-block {
background: repeating-linear-gradient(60deg, rgba(var(--ctv-background-color),.25), rgba(var(--ctv-main-color),.75) 125px) rgb(var(--bright-accent));
}
@media screen and (prefers-reduced-motion: no-preference) {
.stripe-block.animated {
animation-name: stripeMove;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-timing-function: linear;
animation-direction: reverse;
background-size: calc(125px/sin(60deg)) 100%;
}
@keyframes stripeMove{
from {
background-position-x: calc(125px/sin(60deg));
}
}
}
.borderblock, .border-logoblock, .logoblock {
color: rgb(var(--text-monochrome));
}
.border-logoblock::after, .logoblock::after {
background: var(--wire-logo) center / 35% no-repeat;
opacity: 0.125;
}
.master-quote {
font-family: var(--title-font);
}
.titlebox {
color: var(--swatch-text-light);
}
.lightblock, .lightstyled-quote {
background-color: rgb(var(--dark-gray-monochrome));
}
.lightstyled-quote {
border-left: 0.5rem solid rgba(var(--bright-accent));
}
.accentblock {
background-color: rgb(var(--swatch-primary));
color:rgb(var(--text-monochrome));
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25) inset;
border-radius: 10px;
}
.accentstyled-quote {
width: 80%;
max-width: 90%;
background-color: rgb(var(--swatch-primary));
color: rgb(var(--text-monochrome));
border-left: 0.5rem solid rgba(var(--dark-gray-monochrome));
padding: 0.1rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25) inset;
border-radius: 10px;
}
.true-dark:is(.lightblock, .lightstyled-quote, .logoblock, .border-logoblock, .borderblock, .titleblock, .stripe-block), .darkblock, .darkstyled-quote {
background-color: rgb(20, 20, 20);
color: rgb(var(--swatch-text-light));
}
.true-dark:is(.logoblock, .border-logoblock):after {
background: var(--wire-logo-inverted) center / 35% no-repeat;
opacity: 0.125;
}
::selection {
background: rgba(var(--swatch-primary-darker), .5);
}