Ascuas
Ascuas
Hecho porㅤ Lt FlopsLt Flops
Traducido por Dc_YerkoDc_Yerko
Traducido el 08 Sep 2022 11:53
Puntuación: +2+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;
    }
    }
}

Ascuas

Puntuación: +2+x

En un oscuro bosquecillo de solemnes abedules, el hombre que alguna vez fue Magnus Kinslow se encontraba sentado — semioculto entre el juego de luces y sombras que proyecta un fuego humeante — observando la lenta muerte de otro mundo desplegarse ante él.

Él había conocido una gran cantidad de nombres y títulos: alquimista, arcanista, taumturgo, pero, a medida que los años pasaban, le hicieron entrar suavemente en un papel muy demandado. Como intermediario del conocimiento, viajaba entre el aquí y el allá, el ahora y el entonces, portando un caudal de saberes esotéricos largamente acumulados, ofreciendo trueque e intercambio. En este mercado oculto de susurros, compraba los desvaríos de locos y profetas, aquellos cuyas miradas se deslizaban en las fracturas siempre presentes de la existencia, que veían lo que era y lo que no era. Haciendo referencias cruzadas y conjeturas, fue reconstruyendo respuestas cada vez más amplias a las preguntas que le pisaban los talones.

Buscó el conocimiento, atrajo hacia sí mismo la sustancia del pensamiento, extrajo el significado de la tinta. Lo que quedaba lo quemaba, lo echaba al fuego como leña para evitar las noches tan oscuras.

La obra que tenía ante sí, una adquisición reciente, estaba en sus manos sin ser molestada. El delicado pergamino aguantó, sin quemarse. Fue un acto de economía, no de generosidad.

Todas las noches venideras serían oscuras, y cuando las ideas desaparecieran serían las personas las que arderían.

Ya había tenido experiencias previas con tratos que se torcían; su línea de trabajo estaba impregnada de codicia y de manos con mentes codiciosas. Se acostumbró a esperar las traiciones, las rebajas, las mentiras y las ofuscaciones de las intenciones. El reto era en ir un paso por delante, en atravesar esas corrientes de infortunio, un reto, se recordaba a sí mismo. El reto era uno de los que llevaba más cerca de su pecho. Era un propósito que le fue dado, plantado en su forma rota y congelada cuando colgaba moribundo y sangrando. El propósito que le había salvado había echado raíces y había florecido, reparando la cerámica destrozada de su ser y su espíritu con mineral dorado.

Resonaba en su interior, con potencial y poder, con decisión y exigencia: mantener a raya el fin, o al menos documentar a los que se perdieron por él.

Y aquí lo encontró, de nuevo. Aunque esta vez era de su propia cosecha.

Había subestimado su ambición, la sombría resolución que formaba los cimientos de su torre babilónica. Si hubiera sabido que lo harían, nunca les habría ofrecido los medios por los que podrían hacerlo; no por el precio que les costó el conocimiento, ni mucho menos.

Mientras estaba sentado en medio de la oscuridad que se avecinaba, la inconfundible proclamación de la divinidad agraviada -el grito de la muerte- resonó en su mente y en la de innumerables personas:

Dios está Muerto,

Dios es Vengativo.

Para que La Muerte Perdure,

Y Dios esté Muerto.



Suspiró mientras se levantaba, y apagó el fuego para dejar que la noche lo tragara en el abrazo de un amante celoso. Algunas cosas eran más fáciles en la oscuridad.

El hombre concentró su voluntad. Volviéndose hacia el interior para agarrar la intención y la determinación con ambas manos, las dobló sobre sí mismas y las manipuló en un único filo. De esta creación de determinación surgió el ya conocido cuchillo irreal, una única dimensión moldeada por el pensamiento y el propósito. Esta hoja, más afilada que la esperanza, empuñada por manos cuidadosas y entrenadas, se deslizaría entre los átomos hacia el vacío.

Con un solo movimiento, cortó. Incidiendo a través de la noche, a través del vacío, abriendo el sangriento vientre de la potencialidad, y empujando a través de él. La laceración tomó forma, el "allí" se deslizó hacia el "aquí", desenrollando la materia que se apresuró a llenar el temido espacio de la nada, conectando mundos dispares: un puente cortado a cuchillo del pensamiento que da luz a la sustancia. Si lo eligiera, sería un escape.

Pero él volvería a este mundo maldito. Habló de su promesa al círculo de árboles, confiando en que fueran testigos.

No les condenaría al final que se cernía ante ellos, no les dejaría perderse entre la noche eterna, víctimas de la ira de un dios herido.

Pero no podía hacerlo él solo.

Y entonces pasó de la noche más oscura al resplandor de una luz fluorescente.


Fire3.png

GRABACIÓN DE SEGURIDAD DEL SITIO-73


Prólogo: La siguiente transcripción detalla los hechos relacionados con una brecha de seguridad y el posterior robo de SCP-529, el cual ocurrió el 28/04/2021.

Estas imágenes fueron registradas por las cámaras de vigilancia situadas en el interior y en el pasillo adyacente a la oficina de la Dra. Hannah Montaire.


03:42: La Dra. Montaire se halla en su despacho, archivando papeles. SCP-529 está sentado en el alféizar de la ventana, dando toques a un juguete para gatos colgado, tal y como permiten los Procedimientos Especiales de Contención pertinentes.

03:45: Una distorsión en el espacio se manifiesta directamente fuera de la oficina de la Dra. Montaire, quien inicialmente parece no darse cuenta. Esta distorsión se expande, formando una abertura en el pasillo, solo visible desde el lado que da al ya citado despacho. El área más allá de la abertura se enfoca y parece estar oscura con formas específicas difíciles de determinar.

03:46: Una figura humanoide con ropajes llenos y embarrados de barro se dirige a través de la abertura hacia las instalaciones de la Fundación. Su rostro está parcialmente obstruido por una capa y una capucha con detalles. La figura abre la puerta del despacho de la Dra. Montaire. Se registra la siguiente conversación:

Dra. Montaire: Yo— oh, ¿quién eres?

Figura no Identificada: No te alarmes, no me di cuenta de que tendría compañía. Ahora, ¿dónde estás, pequeña? Es hora de irse.

La Dra. Montaire activa el botón de pánico bajo su escritorio y le envía una notificación a la seguridad del sitio en su ubicación.

Dra. Montaire: No estoy seguro de lo que está pasando, pero ¿por qué no te sientas? Estoy segura de que podemos resolver esto.

Figura no Identificada: Me temo que no, supongo que tengo un momento o dos. ¡Ah! Ahí estás, mon couer. Ven ahora, será mejor que nos vayamos.

SCP-529: Miau.

Figura no Identificada: Bueno, ciertamente le gustas, parece que tomamos la decisión correcta. Ahora, conmigo, pequeña.

03:48: SCP-529 desciende del alféizar de la ventana y camina hacia la figura, rozando sus piernas. La figura se inclina para recoger a SCP-529, la acuna bajo un brazo y sale de la oficina. La seguridad del lugar dobla la esquina y exige a la figura que se detenga. Mientras sigue caminando, uno de los miembros del personal de seguridad intenta disparar un arma de electroshock contra la figura: el proyectil se mantiene suspendido en el aire a unos metros del individuo mientras éste se adentra en la abertura que lleva a SCP-529, que se cierra bruscamente tras él.




Man-sun.png
Si no se indica lo contrario, el contenido de esta página se ofrece bajo Creative Commons Attribution-ShareAlike 3.0 License