A 1 Metro Bajo Tierra I
A 1 Metro Bajo Tierra I
Autora: Lt FlopsLt Flops
Traductor: morhadowmorhadow
Publicado el 25 Aug 2023 15:05
Puntuación: +1+–x

Qué es esto

Un puñado de "mejoras" CSS varias que yo, CroquemboucheCroquembouche, utilizo en un montón de páginas porque creo que las hace más fáciles de manejar.

Los cambios que hace este componente son un montón de modificaciones realmente triviales para facilitar la experiencia de escritura y para hacer la documentación de los componentes/temas un poco más fácil (lo que hago mucho). No cambia nada de la página visualmente para el lector — los cambios son para el escritor.

No esperaría que las traducciones de los artículos que usan este componente también lo usen, a menos que al traductor le guste y quiera usarlo de todos modos.

Este componente probablemente no entrará en conflicto con otros componentes o temas, e incluso si lo hace, probablemente no importará demasiado.

Uso

En cualquier wiki:

[[include :lafundacionscp:component:croqstyle]]

Este componente está diseñado para ser utilizado en otros componentes. Cuando lo utilice en otro componente, asegúrese de añadir esto dentro del bloque de [[iftags]] del componente, para que los usuarios de su componente no se vean obligados a utilizar también Croqstyle.

Componentes relacionados

Otros componentes de estilo personal (que sólo cambian un par de cosas):

Temas de estilo personal (que son revisiones visuales):

Cambios de CSS

Notas a pie de página de tamaño razonable

Evita que las notas a pie de página sean de un tamaño excesivo, para que se puedan leer realmente.

.hovertip { max-width: 400px; }

Edición/código monoespaciado

Hace que el cuadro de texto de edición sea monospace, y también cambia todo el texto monospace a Fira Code, la fuente monospace obviamente superior.

@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap');
 
:root { --mono-font: "Fira Code", Cousine, monospace; }
#edit-page-textarea, .code pre, .code p, .code, tt, .page-source { font-family: var(--mono-font); }
.code pre * { white-space: pre; }
.code *, .pre * { font-feature-settings: unset; }

Fondos de teletipo

Añade un fondo gris claro a los elementos <tt> ({{text}}), para que los fragmentos de código destaquen más.

tt {
  background-color: var(--swatch-something-bhl-idk-will-fix-later, #f4f4f4);
  font-size: 85%;
  padding: 0.2em 0.4em;
  margin: 0;
  border-radius: 6px;
}

No más caras grandes

Evita que aparezcan imágenes grandes cuando pasas el ratón por encima de la imagen de avatar de alguien, porque son estúpidas y realmente molestas y puedes hacer clic en ellas si quieres ver la versión grande.

.avatar-hover { display: none !important; }

Salto saltito

Cualquier texto dentro de un div con clase nobreak tiene un ajuste de línea entre cada letra.

.nobreak { word-break: break-all; }

Colores del código

Añade los colores del código de mi terminal como variables. Tal vez cambie esto a un tema de terminal más común como Monokai o algo así en algún momento, pero por ahora es sólo mi tema personal, que se deriva de Tomorrow Night Eighties.

Además, al añadir la clase .terminal a un bloque de código falso como [[div class="code terminal"]] le da una especie de aspecto de pseudo-terminal con un fondo oscuro. No funciona con [[code]], porque Wikidot inserta un montón de resaltado de sintaxis que no puedes cambiar tú mismo sin un montón de CSS. Utilízalo solo para fragmentos de código sin [[code]].

Herramienta rápida para colorear un ejemplo de uso de un componente "estándar" de Wikidot con las variables anteriores: link

:root {
  --c-bg: #393939;
  --c-syntax: #e0e0e0;
  --c-comment: #999999;
  --c-error: #f2777a;
  --c-value: #f99157;
  --c-symbol: #ffcc66;
  --c-string: #99cc99;
  --c-operator: #66cccc;
  --c-builtin: #70a7df;
  --c-keyword: #cc99cc;
}
 
.terminal, .terminal > .code {
  color: var(--c-syntax);
  background: var(--c-bg);
  border: 0.4rem solid var(--c-comment);
  border-radius: 1rem;
}

Modo de depuración

Dibuje líneas alrededor de cualquier cosa dentro de .debug-mode. El color de las líneas es rojo, pero depende de la variable CSS --debug-colour.

También puede añadir div.debug-info.over y div.debug-info.under dentro de un elemento para anotar las cajas de depuración - aunque tendrá que asegurarse de dejar suficiente espacio vertical para que la anotación no se superponga a lo que está por encima o por debajo.

…like this!

.debug-mode, .debug-mode *, .debug-mode *::before, .debug-mode *::after {
  outline: 1px solid var(--debug-colour, red);
  position: relative;
}
.debug-info {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'Fira Code', monospace;
  font-size: 1rem;
  white-space: nowrap;
}
.debug-info.over { top: -2.5rem; }
.debug-info.under { bottom: -2.5rem; }
.debug-info p { margin: 0; }
/* fuente: http://ah-sandbox.wikidot.com/component:collapsible-sidebar-x1 */
 
#top-bar .open-menu a {
        position: fixed;
        top: 0.5em;
        left: 0.5em;
        z-index: 5;
        font-family: 'Nanum Gothic', san-serif;
        font-size: 30px;
        font-weight: 700;
        width: 30px;
        height: 30px;
        line-height: 0.9em;
        text-align: center;
        border: 0.2em solid #888;
        background-color: #fff;
        border-radius: 3em;
        color: #888;
}
 
@media (min-width: 768px) {
 
    #top-bar .mobile-top-bar {
        display: block;
    }
 
    #top-bar .mobile-top-bar li {
        display: none;
    }
 
    #main-content {
        max-width: 708px;
        margin: 0 auto;
        padding: 0;
        transition: max-width 0.2s ease-in-out;
    }
 
    #side-bar {
        display: block;
        position: fixed;
        top: 0;
        left: -20em;
        width: 17.75em;
        height: 100%;
        margin: 0;
        overflow-y: auto;
        z-index: 10;
        padding: 1em 1em 0 1em;
        background-color: rgba(0,0,0,0.1);
        transition: left 0.4s ease-in-out;
 
        scrollbar-width: thin;
    }
 
    #side-bar:target {
        left: 0;
    }
    #side-bar:focus-within:not(:target) {
        left: 0;
    }
 
    #side-bar:target .close-menu {
        display: block;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin-left: 19.75em;
        opacity: 0;
        z-index: -1;
        visibility: visible;
    }
    #side-bar:not(:target) .close-menu { display: none; }
 
    #top-bar .open-menu a:hover {
        text-decoration: none;
    }
 
    /* FIREFOX-SPECIFIC COMPATIBILITY METHOD */
    @supports (-moz-appearance:none) {
    #top-bar .open-menu a {
        pointer-events: none;
    }
    #side-bar:not(:target) .close-menu {
        display: block;
        pointer-events: none;
        user-select: none;
    }
 
    /* This pseudo-element is meant to overlay the regular sidebar button
    so the fixed positioning (top, left, right and/or bottom) has to match */
 
    #side-bar .close-menu::before {
        content: "";
        position: fixed;
        z-index: 5;
        display: block;
 
        top: 0.5em;
        left: 0.5em;
 
        border: 0.2em solid transparent;
        width: 30px;
        height: 30px;
        font-size: 30px;
        line-height: 0.9em;
 
        pointer-events: all;
        cursor: pointer;
    }
    #side-bar:focus-within {
        left: 0;
    }
    #side-bar:focus-within .close-menu::before {
        pointer-events: none;
    }
    }
}

▷ Mostrar Código ◁
Puntuación: +1+–x

Diego revoloteaba ligeramente por debajo de la línea de árboles, con cuidado de no hacer ruido. Estaba de vigía; un puesto inútil, en su opinión. No era como si alguien se adentrara voluntariamente en el bosque desierto durante el día, cuando había trabajo que hacer. Deseó no haber aceptado venir; los árboles le entristecían. Los troncos incinerados le recordaban una época más sencilla. Se desafiaba a sí mismo subiéndose y buscando la hoja con la forma más interesante. Incluso cuando su abuelo había sido enterrado aquí, se esforzaba por encontrar la hoja adecuada para él.

De algún modo, la lápida había sobrevivido a las bombas. Mientras observaba a Katy remover la tierra, sintió una punzada de culpabilidad por haber alterado la tumba.

Click. Plop. Click. Plop. La tierra hacía el click de metal golpeando metal cuando Katy clavaba la pala en el suelo, y un inquietante plop cuando la tierra se amontonaba. Por alguna razón, la tierra tenía un aspecto y un tacto metálicos. El sonido siempre se acercaba a la mente privada de sueño de Diego como pasos, y él seguía comprobando detrás de sí mismo, como si hubiera alguien esperando para saltar sobre él.

"De verdad creo que estás loca, Katy", comentó Diego, "Papá nos va a matar si se entera de que has hecho esto".

"Creo que te equivocas", respondió Katy. Ella continuó sin vacilar. A medida que penetraba en la capa inicial de tierra, la pala ya no hacía tanto click. La capa de tierra debajo parecía separarse sin mucha resistencia.

"A ver si lo entiendo. ¿Estás exhumando a nuestro abuelo muerto porque crees que agentes secretos secuestraron al científico del pueblo? ¿Estás loca?"

"También mataron al Sr. Dan. Además, el Abuelo lleva muerto años a estas alturas; no es como si fuera a saltar sobre nosotros. Te traje para vigilar, no para quejarte". Eso era mentira. Diego sabía que la única razón por la que Katy lo había traído era porque era una imbécil egoísta que necesitaba a alguien que presenciara sus momentos de genialidad.

"Solo porque la Dra. Andrea se mude, no significa que nos vayan a secuestrar."

"¿Todavía crees que se mudó? ¿Se mudó y dejó la urna de su marido?" Katy se detuvo un momento y se volvió hacia Diego. Tenía unos ojos fríos y analíticos que nunca mostraban excitación ni miedo. "La vi cuando se la llevaban en una furgoneta. No como cualquier furgoneta que tenemos. Una furgoneta de forasteros".

"¿Y en qué ayuda desenterrar la tumba de nuestro abuelo?"

"La paciencia es una virtud, Diego. Ya verás". Cuando Katy volvió a su trabajo, Diego pudo verla murmurar algo. Pudo adivinar que eran las últimas palabras del abuelo: Bosque de Ruibarbos. Trescientos metros al norte de la escuela. Vista del acantilado. Un metro bajo tierra.

El Abuelo había sido ingeniero y había calculado el lugar de su entierro como el lugar más importante de su vida. La escuela fue el lugar donde recibió la mayor parte de su educación y desarrolló su amor por el álgebra. En el acantilado besó a la Abuela por primera vez. Más tarde, le propuso matrimonio en el mismo acantilado. Si se avanzaba trescientos metros hacia el norte, se encontraba el viejo río, donde probó una rueda hidráulica casera que se convirtió en su primer invento. A quinientos metros al este, estaba la vieja casa que había heredado de sus padres y en la que vivió la mayor parte de su vida. Por desgracia, lo único que quedaba de ella eran los cimientos. Las bombas se encargaron de ello.

Resultó que, debido a lo accidentado del bosque, todos estos puntos estaban a diferentes altitudes. Cuando el Abuelo hizo la media, el resultado fue un metro bajo tierra. Y se habían asegurado de que el Abuelo estaba a un metro bajo tierra; Diego recordaba a su padre midiendo con una vara de medir y diciendo, con su notable acento atlántico: "Bingo. Está a un metro bajo tierra".

Bosque de Ruibarbos. Trescientos metros al norte de la escuela. Vista del acantilado. Un metro bajo tierra.

Resulta que ese lugar sería el escenario de otro impactante suceso.

Después de un tiempo agonizante escuchando nada más que un silencio espeluznante y el movimiento rítmico de la pala, Katy dio con algo. "Creo que lo hemos encontrado. Diego, ayúdame a quitar la suciedad".

Como Katy se olvidó de traer una pala para Diego, su contribución consistió en agarrar puñados de tierra de la superficie del ataúd y tirarla a un lado. Estaba decorado con gente, volando sobre nubes. Aunque su cara no lo dijera, el temblor de las manos de Katy transmitía miedo o expectación. Quitó la tapa del ataúd, revelando lo que el dúo había venido a buscar: un esqueleto en descomposición.

"Por Dios, qué asco. Vale, ¿por qué estoy mirando el cadáver infestado de gusanos de mi abuelo?"

"Échale un vistazo y piensa, Diego. ¿Qué falta en esta foto?"

"¿Algún sentido de la moralidad?"

"¿Dónde están sus alas?" Katy extendió la mano y agarró el hueso de las alas de Diego. Él retrocedió y le sacudió las manos. Ella tenía razón; no tenía alas.

"¿Tal vez se las cortaron? Es un ataúd muy pequeño, no cabrían sus alas".

Katy parecía esperar esa pregunta. "Siempre quiso que lo enterraran entero; ya sabes que estaba en contra de la donación de órganos. Además, todo esto lo pagó de su propio bolsillo. Era el tipo de persona que derrocharía en un ataúd del tamaño adecuado".

"Bueno, ¿quizás alguien vino y se llevó las alas? Puedes usarlas para alguna clase de sopa caníbal, ¿verdad?"

"Nadie ha estado aquí en los últimos…" Katy hizo una pausa para calcular los números en su cabeza. "…los últimos siete años. Desde antes de las bombas. La tierra estaba intacta. Es imposible que alguien haya venido, desenterrado al abuelo, tomado sus alas y vuelto a enterrar. Diego, sé alguna cosa que otra. Estás mirando hacia arriba y a la izquierda. Eso significa que estás tratando de inventar nuevos recuerdos, para tratar de refutarme. ¿Es tan difícil admitir que tengo razón, por una vez?"

"¿Qué estás tratando de probar? Has cometido un pecado capital".

"Escucha. Caen las bombas. Por alguna razón, todos los libros sobre antropología desaparecen. En respuesta, la Dra. Andrea hace un estudio antropológico sobre las alas. Llega a la conclusión de que las alas son un desarrollo extremadamente reciente. Extremadamente reciente. Al día siguiente, la furgoneta llega a su casa, y ella se "muda". Su vecino, el Sr. Smith, anuncia públicamente que ella estaba cerca de un "fascinante" descubrimiento sobre la naturaleza de la evolución. Dos días después, él aparece muerto en una zanja. Aparentemente, es un suicidio, pero el Alcalde Sturgis no dejó que nadie hiciera una autopsia".

"¿Así que estás diciendo que la gente no tenía alas?"

"Sí, y hay alguien que no quiere que lo sepamos. Y ese 'alguien' viene a por nosotros, así que deberíamos irnos. Ahora".

"¿Estás seguro de que no estás paranoica? ¿Por qué irían tras nosotros?"

"Porque sabemos de ellos. De hecho los he visto afuera en la noche, tratando de encontrar la mejor manera de entrar".

"Sabes que Papá nunca los dejaría entrar".

"Tienen ametralladoras. He leído sobre ellas. No tenemos ninguna posibilidad". Katy miró hacia arriba. "Es cerca del mediodía. Papá probablemente esté todavía en la reunión de la comuna. Si podemos sacar el viejo coche por los caminos secundarios, ni siquiera se daría cuenta de que nos hemos ido hasta que acabe la reunión".

Diego volvió a mirar el cadáver putrefacto y desenterrado de su abuelo. "Papá estaría aún más cabreado".

"Van a por ti y a por mí, no a por él. Si nos vamos ahora, y nos alejamos lo más que podamos, le estaremos haciendo un favor al quitárselos de encima".

"De acuerdo. ¿No podemos volver a enterrar al abuelo? Me parece una falta de respeto dejarlo así".

"Tenemos que alejarnos de este lugar. Ahora mismo. No hay tiempo para llorar a los muertos".

« Documento recuperado de un Universo Paralelo | Hub del Equipo Pájaro | A 1 Metro Bajo Tierra II »

equipo-pájarorelato
Si no se indica lo contrario, el contenido de esta página se ofrece bajo Creative Commons Attribution-ShareAlike 3.0 License