Tema: Lazuli

Este tema fue creado por DrBobtail y traducido/importado por Error012

Para importar este tema a tu página, pon el siguiente texto dentro en donde quieras:

[[include :es-backrooms-wiki:theme:lazuli]]

La fuente del Encabezado es Space Grotesk.
La fuente del Cuerpo es PT Sans.
La fuente del Título es PT Mono.
La fuente monospace es Ubuntu Mono.

Ejemplos

nosotros hacemos un pequeño troleo

Puede crearse una regla horizontal con 5 guiones "-----" y extenderla por la página entera si no está puesta dentro de nada (ej un blockquote). Las líneas que separan secciones de este documento son reglas horizontales.

---

Pueden crearse los títulos poniendo entre uno y seis más "+" al inicio de la línea

+ Títulos

Primer Título

Segundo Título

Tercer Título

Cuarto Título

Quinto Título

Sexto Título

Tabulador

Esta es una vista de pestaña.

Tabulación

Hey mira, más texto aquí.

Que pintoresco.

Pestaña Larga

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta es una pestaña larga. Contiene un montón de texto.

Esta pestaña vacía tiene un nombre realmente largo por alguna razón extraña. Me pregunto, ¿por qué?

Pestaña Vacía

Pestaña Vacía

Pestaña Vacía

Pestaña Vacía

Pestaña Vacía

Esto es un blockquote, creado poniendo ">" al inicio de cada línea.
Más texto

---

Esa es una regla horizontal

Blockquotes anidados¹

Esta es una	tabla
Ya deberías saber	cómo crear
estas

[[div class="styled-quote"]]

[[/div]]

[[div class="lightblock"]]

[[/div]]

[[div class="dark-styled-quote"]]

[[/div]]

[[div class="darkblock"]]

[[/div]]

El rápido zorro marrón saltó sobre el perro perezoso.
El rápido zorro marrón saltó sobre el perro perezoso.
El rápido zorro marrón saltó sobre el perro perezoso.
El rápido zorro marrón saltó sobre el perro perezoso.
El rápido zorro marrón saltó sobre el perro perezoso.
El rápido zorro marrón saltó sobre el perro perezoso.

+ Código del Tema

@import url(https://es-backrooms-wiki.wdfiles.com/local--code/component%3Apatch/1);
 
@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Mono&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "lazuli";
   --theme-name: "Lazuli Theme";
 
   --logo-image: url("https://deer-box.wdfiles.com/local--files/theme-testing/banner2.png");
   --header-title: "Los Backrooms";
   --header-subtitle: "Azul como el mar.";
 
   --body-font: 'PT Sans', sans-serif;
   --header-font: 'Space Grotesk', sans-serif;
   --title-font: 'PT Mono', monospace;
   --mono-font: 'Ubuntu Mono', monospace;
 
   --white-monochrome: 0, 2, 24;
   --pale-gray-monochrome: 3, 18, 90;
   --light-gray-monochrome: 6, 61, 157;
   --gray-monochrome: 5, 49, 134;
   --black-monochrome: 39, 132, 217;
   --bright-accent: 31, 76, 227;
   --medium-accent: 31, 76, 227;
   --dark-accent: 50, 155, 236;
   --pale-accent: 50, 155, 236;
   --blurple: 24, 62, 193;
   --swatch-menubg-dark-color: var(--pale-accent);
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 31, 76, 227;
   --hover-link-color: 31, 76, 227;
   --visited-link-color: 31, 76, 227;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
 
   --rating-module-button-plus-color: 38, 132, 217;
   --rating-module-button-negative-color: 38, 132, 217;
   --rating-module-button-cancel-color: 38, 132, 217;
   --rating-module-button-credit-color: 38, 132, 217;
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("https://deer-box.wdfiles.com/local--files/theme-testing/gradient.png");
 background-repeat: repeat-x;
background-size: inherit;
}
 
#side-bar .side-block div a img {
   filter: grayscale(0%);
}
 
#container {
   background-image: none
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   top: -1.1rem;
   left: 0rem;
   background-image: var(--logo-image);
   background-size: auto 6.8rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   left: 0rem;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #329bec;
}
 
#header h1 a:hover:before {
    text-shadow: .063rem 0.1rem 0.1rem #329bec;
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color:rgba(var(--bright-accent), .25);
   border: 5px solid rgb(var(--light-accent));
}
 
.code {
    border: 3px outset rgb(var(--black-monochrome));
}
 
.styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--black-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);
}
 
.dark-styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--blurple));
   color:rgb(var(--black-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);
}
 
.dark-styled-quote a{
color: rgb(var(--black-monochrome));
}
 
.lightblock {
   background-color:rgb(var(--black-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--pale-gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--black-monochrome));
}

Footnotes

1. ¡Y aquí está un pie de nota!