Traducción sin revisar. Es posible que encuentres errores en este documento. Puedes corregir los problemas que veas, pero la revisión no será aprobada hasta que el Equipo de Traducciones se haga cargo.
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;
}
}
SCP-PL-302 visto a través de un visualizador.
Ítem №: SCP-PL-302
Clase de Objeto: Seguro
Procedimientos Especiales de Contención: Dada la información del Anexo PL-302/2, la nave KENNEDY-3848-XK tiene prohibido responder a cualquier transmisión de radio.
Descripción: SCP-PL-302 es una transmisión de radio recibida como respuesta a numerosos intentos realizados por miembros de la tripulación de KENNEDY-3848-XK para establecer comunicación en el espacio exterior en búsqueda de formas de vida extraterrestres e inteligentes.
SCP-PL-302 está codificado en un idioma desconocido, por lo que actualmente se están realizando intentos para traducir el mensaje, así como rastrear el origen del sistema planetario exacto desde el que se envió. Durante el mensaje grabado no se escuchan rasgos característicos que puedan utilizarse para identificar al remitente.
Los efectos anómalos del objeto se manifiestan después de que un ser humano lo escuche. En ese momento, el oyente no podrá vocalizar durante un breve período de tiempo; las cuerdas vocales de los evaluadores no sufrieron daños de ninguna manera.
Anexo PL-302/1: Recepción
SCP-PL-302 fue descubierto durante la exploración-colonización de planetas capaces de albergar vida más allá del Sistema Solar por la Nave de Colonización de la Fundación KENNEDY-3848-XK. Con el tiempo, se intentó establecer comunicación con cualquier civilización alienígena para reabastecerse de alimentos. El mensaje fue modificado anómalamente para traducirlo instantáneamente al idioma nativo del oyente. La siguiente es una transcripción del mensaje enviado por la tripulación del KENNEDY-3848-XK.
MENSAJE DE EMERGENCIA KENNEDY-3848-XK
A quien llegue este mensaje. Mi nombre es George Mallory y estoy a cargo de la Nave de Colonización KENNEDY-3848-XK. Responda a la brevedad una vez que lo reciba. Nos estamos quedando sin alimentos y suministros de agua. Hay mujeres y niños a bordo. Rogamos ayuda y mensaje de respuesta inmediata.
— George Mallory
Capitán de KENNEDY-3848-XK
Después de 24 horas de transmisión, el personal de KENNEDY-3848-XK informó que recibió un mensaje de respuesta de origen desconocido con propiedades anómalas.
Anexo PL-302/2: Traducción completada
El 28/11/2045, el Departamento de Lingüística completó la traducción del contenido de SCP-PL-302. Debido al contexto alarmante del mensaje, el comando de investigación de KENNEDY-3848-XK decidió cambiar el rumbo de su misión y no responder al mensaje. El siguiente es el contenido de SCP-PL-302.
Guarda silencio o te escucharán.