Atlas' Burden Theme

This is the Atlas' Burden Theme. This particular theme is heavily based off the Dreamers' Library theme by LAN 2D, and the Dustjacket theme we all know and love. This works for stories with a snow and ice motif, or anything which would benefit from a little blue and white.

Feel free to use this theme for your works if you enjoy it, though it is meant to be a continuous thing for Atlas' Burden¹.

How to include

To put this theme on your page, slap this somewhere in your page:

[[include :wanderers-library:component:atlas-burden-theme]]

Theme Components

---

The body font is Texturina
The Header font is Charm.
The Title font is Charm.
The monospace font used is Recursive Mono.

---

Here's some links for you:

• Visited link
• Unvisited link
• Missing link

---

Examples

A horizontal rule can be created with 5 hyphens "-----" and extends across the whole page if it's not placed inside anything (eg 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

+ Titles

First Title

Second Title

Third Title

Fourth Title

Fifth Title

Sixth Title

---

Tabulator

This is a tab view.

Tabulation

Hey look, text in a tab. Cool!

Long 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.

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.

Empty Tab

Empty Tab

Empty Tab

Empty Tab

Empty Tab

Empty Tab

---

This is a blockquote, created by putting "> " at the start of each line.
More text

---

That's a horizontal rule

Nested blockquotes

And another

---

An alternative horizontal rule is available as well if the "-----" is enclosed in a "fancyhr" class div, like so:

[[div_ class="fancyhr"]]
-----
[[/div]]

Resulting in this:

---

---

There is also a special border that can be enabled by adding the "fancyborder" class to any element. For instance, this is the code to this block:

[[div_ class="fancyborder"]]
content goes here
[[/div]]

---

This is a	table
You should know	how to make these
already

---

Newblock test

+ Click to see code

/* Atlas' Burden Theme by meltedbee in 2022
*    Based on Dreamers' Library Theme by LAN 2D, Dust Jacket by Woedenaz, Black Highlighter by Woedenaz and Croquembouche, and Ghost Record by UncertaintyCrossing
* Background and header textures are based off of the original Wanderers' Library background and header, edited by meltedbee in the case of the header.
* Fonts used are  */
@import url('https://fonts.googleapis.com/css2?family=Charm:wght@700&display=swap');:root{
    /* If you're making a new CSS theme, please include the following three variables at minimum. */
    --theme-base: "nuscp";
    /* must be either "nuscp" or "sigma9" */
    --theme-id: "atlas-burden-theme";
    /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
    --theme-name: "Atlas' Burden Theme;
    /* set this to your theme's full name */
--header-title: "The Wanderer's Library";
--header-font: 'Charm', cursive;
--title-font: 'Charm', cursive;
--gradient-header: url("https://wanderers-library.wdfiles.com/local--files/component%3Aatlas-burden-theme/ab-headerbg.png");
/* ===STANDARD THEME COLORS=== */
    --white-monochrome: 247, 247, 240; /*Cream White*/
    --pale-gray-monochrome: 2, 66, 105; /*actually sky blue but it doesnt work if I call it anything else :)*/
    --ice-blue-monochrome: 108, 205, 230; /*lighter ice blue*/
    --blue-monochrome: 67, 180, 250; /*blue*/
    --dark-gray-monochrome: 2, 66, 105; /*dark blue, but also doesnt work if I rename it :)*/
    --black-monochrome: 0, 0, 0;
    --bright-accent: 108, 205, 230; /*gold*/
    --medium-accent:247, 177, 105; /*copper*/
    --dark-accent: var(--dark-gray-monochrome);
    --alt-accent: 166, 157, 151;
 
/* ===PRIMARY COLORS=== */
    /* ===GENERAL COLORS=== */    
    --swatch-primary: var(--medium-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--dark-accent);
    --swatch-border-color: var(--medium-accent);
 
    /* ===GENERAL TEXT COLORS=== */
    --swatch-text-dark: var(--black-monochrome);
    --swatch-text-light: var(--white-monochrome);
    --swatch-important-text: var(--medium-accent);
    --newpage-color: 2, 66, 105;
    --visited-link-color: 120, 120, 120;
 
/* ===BACKGROUND & HEADER COLORS=== */
    /* General Background Color */
    --swatch-background: var(--ice-blue-monochrome), 1.0;
    --swatch-menubg-medium-color: var(--white-monochrome);
    --modal-body-header-txt: 255, 255, 255;
    --modal-body-text: 255, 255, 255;
     --tabs-content-bg-color: var(--white-monochrome),1.0;
    /* Header H1 and H2 colors */
    --swatch-headerh1-color: var(--white-monochrome);
    --swatch-headerh2-color: var(--white-monochrome);
 
/* ===MENU COLORS=== */
    /* ===MENU BACKGROUND COLORS=== */
    --swatch-menubg-color: var(--white-monochrome);
    /* ===MENU TEXT COLORS=== */
    --swatch-menutxt-dark-color: var( --white-monochrome);
    --swatch-menutxt-light-color: var(--medium-accent);
 .f-heading {
    background-color: rgb(0, 0, 0);
}
    /* ===TOPBAR MENU BACKGROUND COLORS=== */
    /* Colors used in the --gradient-topmenu var to give the topbar its color */
    --swatch-topmenu-bg-color: var(--ice-blue-monochrome);
    --swatch-topmenu-border-color: var(--medium-accent);
 
/* ===LINK COLORS=== */
    --link-color: var(--medium-accent);
    --hover-link-color: var(--medium-accent);
  --rating-module-button-color: var(--medium-accent);
    --rating-module-text-color: var(--medium-accent);
 
/* ===RATING MODULE COLORS=== */
 }
.page-rate-widget-box {
    background: rgb(2, 66, 105);
    border: 0.0625rem solid rgba(81, 81, 81, 1.0);
}
#edit-page-textarea{
background-color: rgb(250, 250, 250);
}
 
.blockquote, blockquote {
       border: 3px outset rgb(var(--blue-monochrome));
       background: rgb(var(--blue-monochrome));
       color: rgb(0, 0, 0);
}
 
#footer {
       color: rgb(var(--medium-accent));
}
 
.page-tags a {
       color: rgb(var(--white-monochrome)) !important;
}
 
 .page-tags a::after {
       background-color: rgb(var(--white-monochrome)) !important;
}
 
hr {
    background: rgb(var(--dark-gray-monochrome));
}
 
 .collection>.collapsible-block {
    display: block;
    padding: 0.15em;
    border: 0.0625rem solid black;
    background-color: #202020;
    text-align: center;
}
 
.collection .collapsible-block-unfolded-link a, .collection .collapsible-block-folded a {
    color: rgb(200, 200, 200);
    font-weight: bold;
}
 
 #page-title::before, .meta-title::before, #page-title::after, .meta-title::after {
    background-color: rgb(var(--swatch-primary));
    background-image:
}
 
div#extra-div-1 {
    z-index: -2;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(30, 55, 30, 1) 30%, rgba(255, 219, 90, 1) 100%);
    background: var(--gradient-header);
    background-repeat: repeat;
    background-size: var(--header-background-image-size);
}
 
/* Mobile */
@media only screen and (max-width: 768px) {
 
   #skrollr-body {
      height: var(--header-height-on-mobile);
   }
 
    #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
        background-color: rgb(var(--gray-monochrome));
        border-bottom: none;
        border-right: none;
    }
 
}
 
.yui-navset .yui-content {
    background-color: rgba(247, 247, 240);
}
 
a, a.newpage {
    background: transparent;
    color: rgb( 170, 170, 170);
}
#page-content table.wiki-content-table {
    display: table;
    margin: 0.5em auto;
    border-spacing: 0.0625;
    background-color: rgb(247, 247, 240);
    color: rgb(var(--tables-body-txt));
}
 
#page-content table.wiki-content-table th {
    --wght: calc(var(--ui-wght) + 200);
    padding: 0.5em 1em;
    background: rgb(2, 66, 105);
    color: rgb(var(--tables-header-txt));
    font-weight: var(--wght);
}
 
 border-top-color: rgba(var(--medium-accent), 1) !important;
    border-right-color: rgba(var(--medium-accent), 1) !important;
    border-bottom-color: rgba(var(--medium-accent), 1) !important;
    border-left-color: rgba(var(--medium-accent), 1) !important;
 
a {
   color: #ffd700;
}
 
a:visited {
   color: #F7B169;
}
 
div#footnote-1.footnote-footer {
color: rgb(247, 177, 105);
}
 
form#edit-page-form .edit-page-bottomtable tr > td:first-of-type > div:first-of-type textarea:not(:placeholder-shown) {
    color: rgb(var(--dark-accent));
}
 
@supports (display:grid) {
#page-content div.b-tables table.wiki-content-table td, #page-content div.b-tables table.wiki-content-table th, #page-content table.wiki-content-table td, #page-content table.wiki-content-table th {
    border: 0.0625rem solid rgb(247, 177, 105)!important;
}
}

Footnotes

1. My continuing series/canon.