More actions
No edit summary |
No edit summary |
||
(94 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
@import url('https://fonts.googleapis.com/css2?family= | /* --- Importación de Google Fonts --- */ | ||
@import url('https://fonts.googleapis.com/css2?family=Cardo:wght@400;700&family=Crimson+Pro:wght@400;700&family=EB+Garamond:wght@400;700&family=Reddit+Sans:wght@400;700&display=swap'); | |||
/* | /* --- Configuración General --- */ | ||
body { | |||
font-family: 'Cardo', serif; /* Fuente principal para el texto normal */ | |||
background-color: #07070a; /* Fondo general del sitio */ | |||
color: #e4ddcf; /* Color del texto principal */ | |||
line-height: 1.5; /* Espaciado cómodo */ | |||
margin: 0; | |||
padding: 0; | |||
} | |||
/* --- Títulos del Artículo (no modificables) --- */ | |||
.firstHeading { | |||
font-family: 'Garamond', serif; /* Fuente Garamond */ | |||
font-size: 2.3rem; /* Tamaño ligeramente más pequeño */ | |||
font-weight: normal; /* Sin negrita */ | |||
color: #ffffff; /* Color blanco */ | |||
text-align: center; | |||
margin: 20px 0; | |||
border-bottom: 2px solid #f1c45e; /* Línea decorativa */ | |||
padding-bottom: 10px; | |||
} | } | ||
/* | /* --- Texto Normal de los Artículos --- */ | ||
.mw-parser-output { | |||
font-family: 'Cardo', serif; /* Fuente principal del contenido */ | |||
font-size: 1.1rem; /* Tamaño ligeramente más grande */ | |||
color: #e4ddcf; | |||
line-height: 1.8; /* Espaciado cómodo */ | |||
margin: 0 10%; | |||
} | } | ||
/* | /* --- Subrayado Exclusivo de los Enlaces en el Texto de Artículos --- */ | ||
.mw- | .mw-parser-output a { | ||
text-decoration: none; /* Sin subrayado predeterminado */ | |||
color: #ffffff; /* Color del texto */ | |||
border-bottom: 3.5px solid #f1c45e; /* Subrayado siempre visible */ | |||
position: relative; | |||
transition: color 0.3s ease-in-out; /* Transición para el cambio de color */ | |||
} | } | ||
/* | /* --- Efecto de Marcado en Enlaces (Deslizar de izquierda a derecha) --- */ | ||
.mw-parser-output a::after { | |||
content: ''; /* Sin contenido visible */ | |||
position: absolute; | |||
width: 0; /* Inicialmente no se ve */ | |||
height: 100%; /* Cubre toda la altura del texto */ | |||
background-color: #f1c45e; /* Color del marcado */ | |||
bottom: 0; /* Posicionado en la parte inferior del texto */ | |||
left: 0; /* Empieza desde la izquierda */ | |||
z-index: -1; /* Colocado detrás del texto */ | |||
transition: width 0.3s ease-in-out; /* Transición suave */ | |||
} | } | ||
/* | /* --- Efecto de Cambio de Color del Texto al Pasar el Mouse --- */ | ||
.mw-parser-output a:hover { | |||
color: #1a1a1f; /* El texto se pone del mismo color que el fondo */ | |||
} | } | ||
/* | /* --- Efecto de Expansión del Marcado (de izquierda a derecha) al Pasar el Mouse --- */ | ||
a | .mw-parser-output a:hover::after { | ||
width: 100%; /* El efecto de marcado se extiende */ | |||
} | } | ||
/* | /* --- Subheadings de Primer Nivel (Heading 2) --- */ | ||
.mw-parser-output h2 { | |||
font-family: 'EB Garamond', serif; /* Fuente EB Garamond */ | |||
font-size: 1.8rem; /* Tamaño reducido */ | |||
font-weight: bold; | |||
color: #ffffff; | |||
margin: 30px 0 10px; | |||
border-bottom: 2px solid #f1c45e; /* Línea decorativa */ | |||
} | } | ||
/* | /* --- Subheadings Secundarios (Heading 3 a 5) --- */ | ||
:: | .mw-parser-output h3 { | ||
font-family: 'Crimson Pro', serif; /* Fuente Crimson Pro */ | |||
font-size: 1.5rem; /* Tamaño reducido */ | |||
font-weight: bold; | |||
color: #ffffff; | |||
margin: 20px 0 10px; | |||
} | |||
.mw-parser-output h4, | |||
.mw-parser-output h5 { | |||
font-family: 'Crimson Pro', serif; | |||
font-size: 1.3rem; /* Tamaño ligeramente más pequeño */ | |||
font-weight: bold; | |||
color: #ffffff; | |||
margin: 15px 0 8px; | |||
} | |||
/* --- Heading 6 en Reddit Sans --- */ | |||
.mw-parser-output h6 { | |||
font-family: 'Reddit Sans', sans-serif; /* Fuente Reddit Sans */ | |||
font-size: 1.1rem; /* Tamaño reducido */ | |||
font-weight: normal; | |||
color: #ffffff; | |||
margin: 10px 0 5px; | |||
} | |||
/* --- Bloques de Cita Simplificados --- */ | |||
.mw-parser-output blockquote { | |||
font-family: 'Crimson Pro', serif; /* Fuente Crimson Pro */ | |||
font-size: 0.95rem; /* Tamaño más pequeño que el texto normal */ | |||
font-weight: normal; | |||
color: #e4ddcf; /* Igual al texto principal */ | |||
margin-left: 20px; /* Sangría para bloques de cita */ | |||
margin-right: 20px; | |||
border: none; /* Sin bordes ni estilos especiales */ | |||
padding: 0; /* Sin relleno adicional */ | |||
} | } | ||
::selection { | |||
background-color: #f1c45e; /* Color del fondo de la selección de texto */ | |||
color: #1a1a1f; /* Color del texto seleccionado */ | |||
} | } | ||
/* --- Estilo para la selección de texto --- */ | |||
::selection { | |||
background-color: #f1c45e; /* Color amarillo para el fondo de la selección */ | |||
color: #1a1a1f; /* El texto seleccionado tendrá el color del fondo de los artículos */ | |||
} | } |
Latest revision as of 04:05, 9 December 2024
/* --- Importación de Google Fonts --- */ @import url('https://fonts.googleapis.com/css2?family=Cardo:wght@400;700&family=Crimson+Pro:wght@400;700&family=EB+Garamond:wght@400;700&family=Reddit+Sans:wght@400;700&display=swap'); /* --- Configuración General --- */ body { font-family: 'Cardo', serif; /* Fuente principal para el texto normal */ background-color: #07070a; /* Fondo general del sitio */ color: #e4ddcf; /* Color del texto principal */ line-height: 1.5; /* Espaciado cómodo */ margin: 0; padding: 0; } /* --- Títulos del Artículo (no modificables) --- */ .firstHeading { font-family: 'Garamond', serif; /* Fuente Garamond */ font-size: 2.3rem; /* Tamaño ligeramente más pequeño */ font-weight: normal; /* Sin negrita */ color: #ffffff; /* Color blanco */ text-align: center; margin: 20px 0; border-bottom: 2px solid #f1c45e; /* Línea decorativa */ padding-bottom: 10px; } /* --- Texto Normal de los Artículos --- */ .mw-parser-output { font-family: 'Cardo', serif; /* Fuente principal del contenido */ font-size: 1.1rem; /* Tamaño ligeramente más grande */ color: #e4ddcf; line-height: 1.8; /* Espaciado cómodo */ margin: 0 10%; } /* --- Subrayado Exclusivo de los Enlaces en el Texto de Artículos --- */ .mw-parser-output a { text-decoration: none; /* Sin subrayado predeterminado */ color: #ffffff; /* Color del texto */ border-bottom: 3.5px solid #f1c45e; /* Subrayado siempre visible */ position: relative; transition: color 0.3s ease-in-out; /* Transición para el cambio de color */ } /* --- Efecto de Marcado en Enlaces (Deslizar de izquierda a derecha) --- */ .mw-parser-output a::after { content: ''; /* Sin contenido visible */ position: absolute; width: 0; /* Inicialmente no se ve */ height: 100%; /* Cubre toda la altura del texto */ background-color: #f1c45e; /* Color del marcado */ bottom: 0; /* Posicionado en la parte inferior del texto */ left: 0; /* Empieza desde la izquierda */ z-index: -1; /* Colocado detrás del texto */ transition: width 0.3s ease-in-out; /* Transición suave */ } /* --- Efecto de Cambio de Color del Texto al Pasar el Mouse --- */ .mw-parser-output a:hover { color: #1a1a1f; /* El texto se pone del mismo color que el fondo */ } /* --- Efecto de Expansión del Marcado (de izquierda a derecha) al Pasar el Mouse --- */ .mw-parser-output a:hover::after { width: 100%; /* El efecto de marcado se extiende */ } /* --- Subheadings de Primer Nivel (Heading 2) --- */ .mw-parser-output h2 { font-family: 'EB Garamond', serif; /* Fuente EB Garamond */ font-size: 1.8rem; /* Tamaño reducido */ font-weight: bold; color: #ffffff; margin: 30px 0 10px; border-bottom: 2px solid #f1c45e; /* Línea decorativa */ } /* --- Subheadings Secundarios (Heading 3 a 5) --- */ .mw-parser-output h3 { font-family: 'Crimson Pro', serif; /* Fuente Crimson Pro */ font-size: 1.5rem; /* Tamaño reducido */ font-weight: bold; color: #ffffff; margin: 20px 0 10px; } .mw-parser-output h4, .mw-parser-output h5 { font-family: 'Crimson Pro', serif; font-size: 1.3rem; /* Tamaño ligeramente más pequeño */ font-weight: bold; color: #ffffff; margin: 15px 0 8px; } /* --- Heading 6 en Reddit Sans --- */ .mw-parser-output h6 { font-family: 'Reddit Sans', sans-serif; /* Fuente Reddit Sans */ font-size: 1.1rem; /* Tamaño reducido */ font-weight: normal; color: #ffffff; margin: 10px 0 5px; } /* --- Bloques de Cita Simplificados --- */ .mw-parser-output blockquote { font-family: 'Crimson Pro', serif; /* Fuente Crimson Pro */ font-size: 0.95rem; /* Tamaño más pequeño que el texto normal */ font-weight: normal; color: #e4ddcf; /* Igual al texto principal */ margin-left: 20px; /* Sangría para bloques de cita */ margin-right: 20px; border: none; /* Sin bordes ni estilos especiales */ padding: 0; /* Sin relleno adicional */ } ::selection { background-color: #f1c45e; /* Color del fondo de la selección de texto */ color: #1a1a1f; /* Color del texto seleccionado */ } /* --- Estilo para la selección de texto --- */ ::selection { background-color: #f1c45e; /* Color amarillo para el fondo de la selección */ color: #1a1a1f; /* El texto seleccionado tendrá el color del fondo de los artículos */ }