Qué es esto
Un puñado de "mejoras" CSS varias que yo, Croquembouche 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.
@importurl('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap'); :root{ --mono-font: "Fira Code", Cousine, monospace; }#edit-page-textarea, .codepre, .codep, .code, tt, .page-source{font-family: var(--mono-font); }.codepre*{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.2em0.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:1pxsolid 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-infop{margin:0; }
/* fuente: http://ah-sandbox.wikidot.com/component:collapsible-sidebar-x1*/ #top-bar.open-menua{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.2emsolid#888; background-color:#fff; border-radius:3em; color:#888; }@media (min-width: 768px) {#top-bar.mobile-top-bar{display:block; }#top-bar.mobile-top-barli{display:none; }#main-content{max-width:708px; margin:0auto; 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:1em1em01em; background-color: rgba(0,0,0,0.1); transition:left0.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-menua:hover{text-decoration:none; } /*FIREFOX-SPECIFICCOMPATIBILITYMETHOD*/ @supports (-moz-appearance:none) {#top-bar.open-menua{pointer-events:none; }#side-bar:not(:target) .close-menu{display:block; pointer-events:none; user-select:none; } /*Thispseudo-elementismeanttooverlaytheregularsidebarbuttonsothefixedpositioning (top, left, rightand/orbottom) hastomatch*/ #side-bar.close-menu::before{content: ""; position:fixed; z-index:5; display:block; top:0.5em; left:0.5em; border:0.2emsolidtransparent; 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; }} }
[フレーム]
@importurl(https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&display=swap); /*EncabezadoCentradoSigma-9*[2021WikidotComponent]*PorLtFlops (CCBY-SA 3.0) *Bifurcado de: *TemaPenumbraporEstrellaYoshte*Tambiénbasado en: *EncabezadoCentradoBHLporWoedenaz**/ /* ---- 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); } /* ---- SITEBANNER ---- */ #header, div#header{background-image:none; }#header::before{position:absolute; width:100%; height:100%; content: ""; background-image: var(--lgurl); background-position:centertop; background-repeat:no-repeat; background-size:auto10.55em; opacity:.33; }#headerh1, #headerh2{float:none; margin-left:0; text-align:center; }#headerh1span, #headerh2span{ /*HidetheExistingText*/ display:none; }#headerh1a::before, #headerh2::before{ /*StyletheNewText*/ font-family: "Montserrat", "Arial", sans-serif; text-shadow:none; }#headerh1a::before{position:relative; bottom:.15em; color: var(--titleColor); font-size:115%; font-weight:700; }#headerh2::before{position:relative; top:.1em; color: var(--subtitleColor); font-size:130%; font-weight:600; }#headerh1a::before{ /*SettheNewText'sContentFromVariable*/ content: var(--header-title, "FUNDACIÓN SCP"); }#headerh2::before{content: var(--header-subtitle, "SEGURIDAD - CONTENCIÓN - PROTECCIÓN"); } /* ---- SEARCH ---- */ #search-top-box{top:1em; right:0; }#search-top-box-forminput.button{margin-right:0; }#search-top-box-input, #search-top-box-input:hover, #search-top-box-input:focus, #search-top-box-forminput[type=submit], #search-top-box-forminput[type=submit]:hover, #search-top-box-forminput[type=submit]:focus{border-radius:0; box-shadow:none; font-size:100%; } /* ---- TOPBAR ---- */ #top-bar{right:0; display: flex; justify-content:center; }#top-barulliul{border-bottom:1pxsolid 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%; } /* ---- PAGETITLE ---- */ .meta-title, #page-title{text-align:center; } /* ---- BREADCRUMBS ---- */ .pseudocrumbs, #breadcrumbs{text-align:center; } /* ---- MOBILEDISPLAY ---- */ @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.printuserimg.small{margin:0; transform: translate(6px, 4px); }#my-account{display:none; }#account-topbutton{margin-left:2px; }}
AVISO POR PARTE DEL DEPARTAMENTO DE MALENTENDIDOS DE LA FUNDACIÓN
El Departamento de Malentendidos (DdMe) manejará toda la documentación y comunicaciones pertinentes al Dr.Michaels, siguiendo un estricto protocolo. Es imposible presentar dicho protocolo de manera explícita; sin embargo, hemos diseñado este documento de tal manera que lo implica fuertemente.
—Eli Forkley, Director, DdMe
AVISO DEL DDME: Este archivo requiere inoculación no-anómala.
El Dr. Michaels es el Dr. Michaels. El Dr. Michaels no es el Dr. Michaels.La tierra es redonda. La tierra es plana.El cielo es azul. El cielo es verde.
[✔] Inoculación completa. Puede proceder.
ÍNDICE DE COMUNICABILIDAD: Cumpliendo con el Código de Integridad Linguística del personal del DdMe, la información aquí contenida es 100% precisa y comunicable por medios textuales, gráficos, visuales, auditivos y subliminales. El personal cuestionable debe proceder al Ala Médica del Sitio-96 para la administración de Veritantes de Clase-A, y de ser necesario, la administración de Amnésticos de Clase-C.
Ítem #: Dr. Michaels
Clasificación de Contención: Seguro
Procedimientos Especiales de Contención: El Dr. Michaels no está en peligro. Se debe asegurar el bienestar personal del Dr.Michaels. Para ello, el Dr. Michaels es mantenido en el Sitio-96 y no se le permite interactuar con el personal a menos que este haga parte de su contención e investigación.
Un equipo de mantenimiento seguirá al Dr. Michaels durante el día y desinfectará el área cuando él se retire. No se permite a ningún miembro de este equipo el discutir sus labores o las situaciones que les rodean.
Descripción: El Doctor Jeremy Feldson Michaels es un varón no-anómalo de ascendencia indio-británica, actualmente empleado como un investigador de Nivel-3 en el Sitio-96. El Dr. Michaels tiene 33 años y ha trabajado para la Fundación durante 8 años. Él no está casado y es hijo único, sin familia inmediata a excepción de sus padres.
Materiales Adicionales
I. Serie de Evaluación de Seguridad Personal
REGISTRO DE VIDEO
FECHA: 20/10/2019
HORA: 08:16 UTC
PREÁMBULO: El Dr. Michaels es un elemento valioso para la Fundación dadas sus competencias en el campo de la linguística y los malentendidos. El uso de una Serie de Evaluación de Seguridad Personal (o SESP) es necesario para identificar los riesgos para su bienestar personal. El personal asignado llevó a cabo la SESP en una cámara de contención sellada para identificar problemas relacionados a la salud mental del Dr.Michaels.
[INICIO DEL REGISTRO]
Una imagen reciente del Dr.Michaels. Alrededores inmediatos censurados.
Entrevistador: Okay. Entonces dígame su nombre, de acuerdo al protocolo, y comenzaremos. ¿Qué tal suena eso?
Dr. Michaels: [Respira profundamente.] Okay, mi nombre es Doctor Jeremy Feldson Michaels.
Interviewer: Perfecto, ahora–
[El Entrevistador mira brevemente sobre la cabeza del Dr. Michaels y se coloca en su asiento.]
Entrevistador: Eh, lo siento. Así que, ayer usted asistió a una cita con el Psiquiatra del Sitio. Ahora, esto tiene la intención de ser un seguimiento a su visita. ¿Podría contarme cómo fue?
Michaels: Sí, bueno, he estado un poco mareado estos días. Ya sabe cómo es— todos nos ponemos así cuando nos alejan de nuestras familias ¿no?
Entrevistador: Hmm ¿Podría ser más específico? ¿Cómo se manifiesta este ''mareo''?
Michaels: Tengo un constante sentimiento amenazador que no me puedo sacar de la cabeza. Como si algo no me dejara ir. Estoy hablando de manera metafórica, claro está.
Entrevistador: ¿Sabe, aproximadamente, cuándo comenzó esta sensación?
Michaels: Diría que cuándo perdimos a D-4428-3. Como, en segundos.
Entrevistador: [Escribe en un bloc de notas.] Bien, okay, entonces tuvo una experiencia traumática.
Michaels: Fue algo así.
Entrevistador: Este Clase-D en particular hacía parte de su equipo de investigación. ¿Estoy en lo correcto al afirmar esto?
Michaels: Lo está.
Entrevistador: ¿Quién más estaba en el equipo?
Michaels: Bueno, sin ningún orden en particular, serían el Agente Rosewood, D-4428-1,
D-4428-2, el Ingeniero de Contención Howard Winters, y la Investigadora Gabi Kalpana.
Entrevistador: Ya veo. Así que Jeremy, ¿diría usted que estos sentimientos son recurrentes?
Michaels: No. Bueno, va y viene. A veces tira de mí más fuerte de lo que espero.
Entrevistador: Correcto. Sus archivos establecen que su familia no tiene un historial de experiencias traumáticas — ah, a excepción de su hermano. ¿Tiene un hermano, Jeremy?
Michaels: Sí, tengo un hermano.
Entrevistador: El doctor se refirió a él como un "estresor" ¿Podría explicar esto? ¿Qué le pasó a él?
Michaels: Bueno, No podría decirle dónde está ahora. No es que no sepa. Es que no quiero hablar de él.
Entrevistador: Corríjame si estoy mal… Su hermano era una fuente de hostilidad hacia usted.
Michaels: Él era un cabrón, claro, pero con él, era más malicioso que eso. Mis padres lo acogieron desde que era un niño, y fue mi hermano adoptivo desde entonces, nos llevábamos relativamente bien. Sin embargo, mientras crecíamos, algo dentro de él se quebró. Después de eso, todo lo que hizo fue ser un peso para nuestra familia.
Entrevistador: ¿Y eso era cuando era hostil?
Michaels: Él no era confrontacional— no era así— era como si él fuese un peso muerto sobre nosotros, pero especialmente en mí. Crecimos juntos, después de todo, y él era más apegado a mí. Pero cuando me fui a la universidad, él– Bueno, él no me dejaba ir.
Entrevistador: Las notas del doctor dicen que lo llamó un– ¿Qué era? Lo llamó "un parásito".
Michaels: [Se inquieta por un breve momento, suspira y recupera la compostura.] Quería vivir por mí mismo, es todo. Pero mientras me estaba mudando, semanas después de haberlo visto por última vez, él sólo estaba ahí. Estaba a cientos de millas de distancia, pero de alguna manera él estaba ahí. Él también le ha hecho esto a otras personas. Yo– Nosotros no fuimos los primeros.
Entrevistador: Captado. [Pasa las páginas.] Ahora, Jeremy ¿Cuál es su color favorito?
Michaels: Púr– No, espere, tal vez podemos saltarnos esa.
Entrevistador: Está– Eh ¿seguro?
Michaels: Sólo pase a la siguiente pregunta.
Entrevistador: [Pausa, poniendo una mano en su oreja, oculta del dispositivo de grabación.] De hecho, Dr. Michaels, usted estaba aquí por el refuerzo de la alcantarilla, ¿no es así?
[El Dr. Michaels asiente.]
Entrevistador: A decir verdad, recientemente obtuve un reporte de que encontraron la fuente de eso. Un miembro del personal de seguridad — encontró una gran fuga en una tubería de uno de los sub-niveles de sótanos abandonados. Era una completa inundación allí abajo. Aunque nadie está seguro de la causa.
Michaels: ¿Justo ahora?
Entrevistador: No, fue hace casi una semana. Enviaron a un destacamento y perdieron a uno entre la mierda, y cuando volvieron para buscarlo, era como si estuviera incapacitado. Estaba bien, pero se movía demasiado despacio.
Michaels: Okay.
Entrevistador: [Inhala abruptamente y se inclina hacia adelante en su silla.] El destacamento también dijo que sentían mareo, como usted.
Michaels: ¿Ah sí? Huh, qué coincidencia.
Entrevistador: En efecto.
[FIN DEL REGISTRO]
II. Nota final
NOTA DEL INVESTIGADOR
He intentado ser lo más claro posible en este documento. Estoy completamente bien, aunque no sé cuánto más de esto pueda soportar. Por favor, si estás leyendo esto, y entiendes que nada está mal: Esto no puede seguir por mucho. Uno de estos días, alguien puede cometer un desliz, o incluso yo, y… No me puedo hacer eso a mí mismo, o a mi familia, o a mis colegas del personal. Malentendidos está haciendo maravillas, y es un milagro que hayan sido capaces de ayudarme a pasar por esto, pero hay un límite a lo que pueden manejar. ¿Finalmente? Estoy bien, ¿entiendes? Por favor, por favor entiéndelo, y encuentra una manera de resolver todo esto.
Dr. Jeremy Michaels
Investigador del Sitio-96
20/10/2019
[FIN DEL ARCHIVO]