A 1 Metro Bajo Tierra III |
Autora: Lt Flops |
Traductor: morhadow |
Publicado el 26 Aug 2023 10:21 |
Qué es esto
Un puñado de "mejoras" CSS varias que yo, Croquembouche, 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.
.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;
}
}
}
@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&display=swap);
/* Encabezado Centrado Sigma-9
* [2021 Wikidot Component]
* Por Lt Flops (CC BY-SA 3.0)
* Bifurcado de:
* Tema Penumbra por EstrellaYoshte
* También basado en:
* Encabezado Centrado BHL por Woedenaz
**/
/* ---- VARS ---- */
:root{
--titleColor: hsl(0, 0%, 95%);
--subtitleColor: hsl(60, 62%, 85%);
--lgurl: url(https://lafundacionscp.wdfiles.com/local--files/component%3Acentered-header-sigma-9/logo.svg);
}
/* ---- SITE BANNER ---- */
#header,
div#header{
background-image: none;
}
#header::before{
position: absolute;
width: 100%;
height: 100%;
content: "";
background-image: var(--lgurl);
background-position: center top;
background-repeat: no-repeat;
background-size: auto 10.55em;
opacity: .33;
}
#header h1,
#header h2{
float: none;
margin-left: 0;
text-align: center;
}
#header h1 span,
#header h2 span{
/* Hide the Existing Text */
display: none;
}
#header h1 a::before,
#header h2::before{
/* Style the New Text */
font-family: "Montserrat", "Arial", sans-serif;
text-shadow: none;
}
#header h1 a::before{
position: relative;
bottom: .15em;
color: var(--titleColor);
font-size: 115%;
font-weight: 700;
}
#header h2::before{
position: relative;
top: .1em;
color: var(--subtitleColor);
font-size: 130%;
font-weight: 600;
}
#header h1 a::before{
/* Set the New Text's Content From Variable */
content: var(--header-title, "FUNDACIÓN SCP");
}
#header h2::before{
content: var(--header-subtitle, "SEGURIDAD - CONTENCIÓN - PROTECCIÓN");
}
/* ---- SEARCH ---- */
#search-top-box{
top: 1em;
right: 0;
}
#search-top-box-form input.button{
margin-right: 0;
}
#search-top-box-input,
#search-top-box-input:hover,
#search-top-box-input:focus,
#search-top-box-form input[type=submit],
#search-top-box-form input[type=submit]:hover,
#search-top-box-form input[type=submit]:focus{
border-radius: 0;
box-shadow: none;
font-size: 100%;
}
/* ---- TOP BAR ---- */
#top-bar{
right: 0;
display: flex;
justify-content: center;
}
#top-bar ul li ul{
border-bottom: 1px solid hsl(0, 0%, 40%);
box-shadow: none;
}
/* ---- LOGIN ---- */
#login-status{
top: 1.1em;
right: initial;
color: hsl(0, 0%, 87%);
}
#account-topbutton{
border-color: hsl(0, 0%, 87%);
font-size: 100%;
}
/* ---- PAGE TITLE ---- */
.meta-title,
#page-title{
text-align: center;
}
/* ---- BREADCRUMBS ---- */
.pseudocrumbs,
#breadcrumbs{
text-align: center;
}
/* ---- MOBILE DISPLAY ---- */
@media (max-width: 767px){
#search-top-box{
top: 1.85em;
width: unset;
}
.mobile-top-bar{
position: relative;
left: 0;
display: flex;
justify-content: center;
}
#login-status{
top: 0;
right: 0;
}
#header .printuser{
font-size: 0;
}
#header .printuser img.small{
margin: 0;
transform: translate(6px, 4px);
}
#my-account{
display: none;
}
#account-topbutton{
margin-left: 2px;
}
}
El Dr. Hoygull dio un sorbo a su café mientras examinaba los formularios que tenía delante. Sabía que el hábito era destructivo para él; no solo porque el café fuera malo para los pájaros, sino porque tener mil millones de voraces hombres-pájaro engullendo todo lo que se pareciera a un grano significaba que el suministro de café era peligrosamente escaso. Sin embargo, desempeñar un papel clave en la reestructuración del mundo durante los últimos seis años había pasado factura a Hoygull. La mayoría de las aves ni siquiera vivían tanto tiempo. Sentía que el corazón se le iba a salir del pecho.
Lo que realmente no ayudó fue que las alarmas se activaran y su asesor de seguridad irrumpiera en la habitación. A Hoygull casi le da un infarto.
"Señor, tenemos unos treinta hostiles atacando la Torre. Parecen ser asaltantes…"
"Entonces eso no debería ser ningún problema, ¿no?" El dispositivo de traducción de Hoygull tenía dificultades para enfatizar la tensión en su tono. Había mantenido a algunos de los grupos de asaltantes, principalmente porque no valía la pena enviar buenos hombres y armas tras ellos. Había encontrado la manera de convertir a algunos de los más molestos en sus marionetas, al igual que había hecho con los líderes de las comunas locales.
"De hecho, lo es. Tienen lanzacohetes. Ya han pasado la valla".
"Perdone, ¿ha dicho que los asaltantes van armados con lanzacohetes?" El dispositivo de traducción de Hoygull tuvo dificultades para enfatizar la ira en su voz.
"Sí, señor".
"¿Cómo han conseguido armas de uso militar? Creía que habíamos limpiado todas las bases militares de este hemisferio".
"Dije la mayoría. Existe la posibilidad de que se nos haya pasado alguna. Además, siempre existe la posibilidad de que estén en contacto con Eurasia". Cualquier cosa fuera del hemisferio era un territorio desconocido para la nueva Fundación. Por lo que Hoygull sabía, allí reinaba la anarquía. Por supuesto, aquí era prácticamente una anarquía, pero a Hoygull le gustaba pensar que la COG sobrevivía de algún modo y mantenía el orden en el otro hemisferio. "¿Dijo que habían logrado pasar la valla?"
"Sí, y me gustaría obtener autorización para usar armamento anómalo".
"¿Qué? ¿Qué? ¿Por qué? Son asaltantes y tenemos los mejores rifles del país".
"A decir verdad, Hoygull, nuestro 'ejército' se mantiene unido por un hilo. En su mayoría son voluntarios, y están desmoralizados porque nuestro plan de restauración se está retrasando. Usted dijo que tendríamos los gobiernos nacionales de nuevo en su lugar en este momento".
"Todo el mundo rechaza las marionetas que intentamos colocar. Es mucho más difícil de lo que parece". Hoygull tomó otro sorbo de café.
"La cuestión es que necesitamos una ventaja moral. La oportunidad de sacar los Cañones de Luz sin duda entusiasmará a todos".
"De acuerdo, de acuerdo, claro. Asegúrese de deshacerse de estos tipos, ¿de acuerdo?"
"No le defraudaré, señor".
Una vez que el Dr. Kastra salió de la habitación, Hoygull enterró la cabeza en sus alas. "¿Por qué?", murmuró para sí mismo. "¿Por qué me diste este puesto, Calvin?" Tenía muchas ganas de dimitir, pero sabía que su presencia era lo que mantenía unida a la incipiente Fundación. Ahogó sus sentimientos, tragó lo que le quedaba de café y bajó al pasillo para verlo mejor.
Una vez que la Orden atravesó las puertas principales, a Katy y Diego les resultó fácil colarse. El sonido de los gritos, la detonación de cohetes y el fuego de las armas ligeras resonó por los pasillos. Al contrario que la Orden del Arrendajo Azul, que parecía disfrutar de la oportunidad de utilizar los "misiles mágicos", Diego se mostraba temeroso de coger un arma. Nunca había empuñado un arma en su vida; la única razón por la que tenía una pistola enterrada en su capa era porque Katy le obligó a coger una.
"Tenemos que encontrar a la Dra. Andrea", se repitió Katy. "Mierda. Ojalá tuviera un mapa de este lugar. ¿Dónde tienen a los prisioneros?"
Finalmente tropezaron con lo que parecía una celda de prisión. La puerta estaba cerrada con llave, pero el explosivo plástico que Katy había encontrado en la base militar no tardó en abrirla. Dentro, en lugar de prisioneros, había un espejo de mano dorado sobre una almohada de terciopelo.
"¿No hablaban los caballeros de ese espejo?". preguntó Diego.
"Creo que sí". Katie sacó el espejo del pedestal y le echó un buen vistazo. "Deberíamos devolverlo. La Orden se va a cabrear si pierden gente por esto; les dije que las armas les harían invencibles. Podemos usar esto para suavizar el golpe. Además, creo que me queda muy bien".
Era la primera vez que Diego oía a Katy referirse a sí misma como "guapa". Ese momento de sorpresa fue rápidamente suplantado por otro, al oír una voz robótica que les gritaba "¡Quietos!"
Se dieron la vuelta y vieron a un pájaro, con bata de laboratorio y algún tipo de dispositivo metálico alrededor del cuello, escoltado por un hombre con traje de negocios que sostenía una escopeta.
Katy sacó su pistola y empujó el cañón contra el espejo. "Si das un paso más, rompo el espejo".
"Por favor, rompa el espejo", dijo Hoygull. Graznó suavemente en el aparato, que emitió entonces una voz fría y robótica. "Hemos pasado el último mes intentando romperlo. Si su arma es más fuerte que una prensa hidráulica y 30 libras de TNT, le invito a disparar al espejo".
Katy procesó esta información en su cabeza, antes de apretar el gatillo con la intención de llamar al farol de la gaviota. La bala rebotó en el espejo y se incrustó en algún lugar de las paredes de espuma de la habitación.
"Ahora, por favor, desháganse de sus armas", dijo Hoygull. Fue entonces cuando Katy respiró hondo, apuntó al Dr. Kastra y disparó. Consiguió disparar dos veces antes de que Kastra disparara su escopeta, tirándola al suelo.
"¡Katy!", gritó Diego. Se agachó junto a ella para intentar tomarle el pulso. Antes de que pudiera hacer una evaluación precisa, sintió el cañón de una escopeta clavándose en un lado de su cabeza.
"¿Se encuentra bien, Dr. Kastra?", preguntó Hoygull.
"Estoy bien, no se preocupe. No tenía tan buena puntería. Tendré el hombro magullado una semana o así, pero estoy bien".
Diego se miró en el espejo. Katy se había agarrado a él al caer al suelo. En el espejo, no se vio a sí mismo. Era difícil describir lo que veía. Era como un lugar combinado con una idea. Vio a Katy, y a su padre, y a su madre, y a la Orden, y un aura azul que parecía cubrirlo todo. Mirarlo le hizo sentirse contento. Como si no tuviera un cañón de escopeta impreso en la cabeza.
"¡Suelta el espejo!", gritó el Dr. Kastra.
Diego no se había dado cuenta de que lo tenía en la mano.
"No, no quiero matar a dos personas en un día", dijo Hoygull, "sujételo y se lo arrancaré de las manos".
El guardia rodeó a Diego con los brazos y lo levantó. La gaviota revoloteó hasta el pecho de Diego y agarró el espejo con sus garras. Aunque el ave era bastante vieja, con la ayuda del Dr. Kastra, el espejo pareció escapársele de las manos. La gaviota intentó entonces llevarlo hasta la almohada donde estaba guardado originalmente, pero de repente se desmayó y cayó al suelo.
"¿Se encuentra bien, Hoygull?", preguntó el Dr. Kastra. De repente, Hoygull empezó a brillar. Al mismo tiempo, el espejo empezó a emitir el sonido de metal rascándose contra metal. A Diego le entró una migraña y empezó a gritar. Antes de desmayarse, vio salir algo del espejo: una especie de figura humanoide que brillaba junto con el resto de la habitación.
La visión de Diego se desvaneció al tiempo que oía un ensordecedor graznido en todo el mundo.
La luna se volvió azul.