Wanderers' Journal

Theme Colors

--gray-monochrome(66, 66, 66)

--bright-accent(211, 23, 23)

--pale-gray-monochrome(188, 188, 188)

--light-gray-monochrome(168, 168, 168)

--dark-gray-monochrome(22, 22, 22)

--medium-accent(191, 15, 15)

--dark-accent(175, 10, 10)

--newpage-color(221, 102, 17)

Logo for The Wanderers' Library

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.

---

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 block is used to make newspaper-like fragments. By default, only the first letter of first paragraph is capitalized. If you want to add more paragraphs with first letter capitalized, use this code:

[[div class="newspaper"]]
First paragraph

[[div class="newsarticle"]]
Second paragraph
[[/div]]
[[/div]]

---

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lorem eros, venenatis in quam sit amet, vulputate tempor ex. Nullam ut efficitur nisi, quis consequat turpis. Donec mattis ultrices congue. Nam facilisis accumsan blandit. Nulla pellentesque luctus pulvinar. Integer finibus enim ut orci pellentesque interdum. Phasellus vehicula arcu et quam finibus, sed porttitor leo aliquam. Phasellus ipsum eros, porta in pulvinar at, tristique eu erat. Vestibulum interdum lacus elementum nisi cursus varius. Aliquam iaculis maximus nulla sit amet dignissim. Vivamus quis vehicula nibh, at blandit sapien. Nullam viverra libero ut tristique ullamcorper.

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, more text here.

How quaint.

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

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

The body font is Lato.
The Header font is Imbue.
The Title font is Oswald.
The monospace font used is PT Mono.

---

+ show block

/* Wanderer's Journal Theme */
/* 2021 Wikidot Theme */
/* By WhiterPL, based off Dustjacket by Woedenaz and Croquembouche */
 
/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Imbue&family=Oswald&display=swap');
 
:root, :root:lang(pl) {
    /* S-CSS-P Integration */
    /* 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: "noirWL-theme";
    /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
    --theme-name: "Wanderers' Journal Theme";
    /* set this to your theme's full name */
 
    /* Header */
    --logo-image: url("http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/wlnoir_logo.png");
    --header-title: "Dzienniki Wędrowca" !important;
    --header-subtitle: " ";
 
    /* Typefaces */
    --body-font: Lato !important;
    --header-font: 'Imbue', 'Poppins', sans-serif !important;
    --title-font: 'Oswald', 'Poppins', sans-serif !important;
    --mono-font: adaptive-mono, "PT Mono", "Andale Mono", "Courier New", Courier, monospace !important;
 
    /* Standard Colors */
    --white-monochrome: 252, 252, 252;
    /* white */
    --pale-gray-monochrome: 188, 188, 188;
    /* pale gray */
    --light-gray-monochrome: 168, 168, 168;
    /* light green for login status */
    --gray-monochrome: 66, 66, 66;
    /* green */
    --dark-gray-monochrome: 22, 22, 22;
    /* black for sidebar background */
    --black-monochrome: 12, 12, 12;
    /* black */
    --bright-accent: 211, 23, 23;
    /* bright red*/
    --medium-accent: 191, 15, 15;
    /* medium red*/
    --dark-accent: 175, 10, 10;
    /* dark red*/
    --newpage-color: 221, 102, 17;
    /* pale orange */
 
    /* Primary Theme Colors */
    --swatch-background: var(--white-monochrome);
    --swatch-primary: var(--pale-gray-monochrome);
    --swatch-primary-darker: var(--dark-gray-monochrome);
    --swatch-primary-darkest: var(--black-monochrome);
    /* Primary Text Colors */
    --swatch-text-dark: var(--black-monochrome);
    --swatch-text-light: var(--white-monochrome);
    --swatch-important-text: var(--bright-accent);
 
    /* Primary Menu Colors */
    --swatch-menubg-color: var(--white-monochrome);
    --swatch-menubg-light-color: var(--light-gray-monochrome);
    --swatch-menubg-medium-color: var(--dark-gray-monochrome);
    --swatch-menubg-medium-dark-color: var(--black-monochrome);
    --swatch-menubg-dark-color: var(--dark-gray-monochrome);
    --swatch-menubg-black-color: var(--black-monochrome);
    --swatch-menubg-hover-color: var(--dark-gray-monochrome);
    --swatch-menutxt-dark-color: var(--dark-gray-monochrome);
    --swatch-menutxt-light-color: var(--white-monochrome);
    --swatch-border-color: var(--black-monochrome);
    /* Primary Header Colors */
    --swatch-headerh1-color: var(--white-monochrome);
    --swatch-headerh2-color: var(--white-monochrome);
    --swatch-topmenu-border-color: var(--white-monochrome);
    --swatch-topmenu-bg-color: var(--dark-gray-monochrome);
    --rating-module-button-color: var(--white-monochrome);
    --rating-module-text-color: var(--white-monochrome);
 
   --gradient-header: url("http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/wlnoir-bg.png");
}
 
.page-rate-widget-box {
       background-color: black;
}
 
.rate-points {
       font-family: var(--title-font);
}
 
.blockquote, blockquote {
       border: 3px outset rgb(var(--gray-monochrome));
       background: rgb(var(--pale-gray-monochrome));
}
 
#main-content a {
       color: rgb(var(--bright-accent));
}
 
#footer {
       color: rgb(var(--white-monochrome));
}
 
.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));
}
 
#header h1 a::before  {
       background: url(http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/whitefoil.png);
    -webkit-background-size: cover;
       -moz-background-size: cover;
         -o-background-size: cover;
            background-size: cover;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    overflow-wrap: normal;
}
 
 div#extrac-div-3::before {
       background: url(http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/whitefoil.png);
     -webkit-background-clip: text;
     background-clip: text;
     -webkit-text-fill-color: transparent;
}
 
#header h1 a::after {
   background-image: url(http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/whitefoil.png);
}
 
#page-title::before, .meta-title::before, #page-title::after, .meta-title::after {
background-image: url("http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/wlnoir-bg.png");
}
 
/* Custom Classes */
 
.newspaper {
        border: 5px solid black;
        text-align: justify;
        padding: 2em;
        background: white;
        font-family: 'Mono', var(--mono-font);
}
 
.newspaper p:first-of-type::first-letter, .newsarticle p:first-of-type::first-letter {
       font-size: 200%;
       font-weight: 600;
       text-shadow: 1px 0 rgb(var(--dark-accent));
       float: left;
       margin-right: 5px;
}
 
.newspaper h1, .newspaper h2, .newspaper h3, .newspaper h4, .newspaper h5, .newspaper h6 {
      font-family: 'Mono', var(--mono-font);
}
 
.fancyhr hr {
    border-top: 2vw solid transparent;
    background-color: rgba(255, 219, 90, 0);
    background-color: rgba(var(--bright-accent), 0);
    height: 0;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    border-image-source: url(http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/noirhr.png);
    border-image-repeat: round round;
    background: none;
    border-image-slice: 80 500 80 500 fill;
    border-image-width: 10em 80em 10em 80em;
}
 
.fancyborder {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    border: 2vw solid rgba(0,0,0,0.5);
    -webkit-border-image: url(http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/noirborder.png) 600 round;
       -moz-border-image: url(http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/noirborder.png) 600 round;
         -o-border-image: url(http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/noirborder.png) 600 round;
            border-image: url(http://wanderers-library-pl.wikidot.com/local--files/component:wanderers-journal/noirborder.png) 600 round;
    border-image-width: 6;
    padding: 2vw;
}
 
/* 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;
    }
 
    div#page-options-bottom {
        width: 90%;
    }
 
   .newspaper p:first-of-type::first-letter, .newsarticle p:first-of-type::first-letter {
       font-size: 150%;
       font-weight: 800;
       float: none;
       margin: 0;
}
}