67 lines
1.5 KiB
CSS
67 lines
1.5 KiB
CSS
|
|
:root {
|
|
--gap: 24px;
|
|
--content-gap: 20px;
|
|
--nav-width: 1024px;
|
|
--main-width: 720px;
|
|
--header-height: 70px;
|
|
--footer-height: 70px;
|
|
--radius: 8px;
|
|
|
|
/* Paleta */
|
|
--theme: #ffffff;
|
|
--entry: #f9f9f9;
|
|
--primary: #A10F2B; /* Rojo profundo */
|
|
--secondary: #555555; /* Gris sobrio */
|
|
--tertiary: #FFC400; /* Dorado */
|
|
--content: #2e2e2e;
|
|
--code-block-bg: #1c1c1c;
|
|
--code-bg: #f4f4f4;
|
|
--border: #ddd;
|
|
|
|
/* Color especial para hover en header */
|
|
--header-hover-color: #003d7a; /* Azul marino */
|
|
--header-bg: #A10F2B; /* Rojo rojigualda */
|
|
--header-color: #FFC400; /* Dorado rojigualda */
|
|
--header-hover: #003d7a; /* Azul marino */
|
|
}
|
|
|
|
/* 🔥 Tema oscuro */
|
|
.dark {
|
|
--theme: #1a1a1a;
|
|
--entry: #2b2b2b;
|
|
--primary: #FFC400; /* Dorado como base */
|
|
--secondary: #bbbbbb;
|
|
--tertiary: #A10F2B; /* Rojo como hover */
|
|
--content: #e6e6e6;
|
|
--code-block-bg: #2e2e2e;
|
|
--code-bg: #3a3a3a;
|
|
--border: #444;
|
|
--header-hover-color: #003d7a; /* Puede mantenerse o ajustarse si quiere */
|
|
}
|
|
|
|
/* 🔗 Estilo global de enlaces */
|
|
a {
|
|
color: var(--primary);
|
|
text-decoration: none;
|
|
transition: color 0.3s ease;
|
|
}
|
|
|
|
a:hover {
|
|
color: var(--header-hover-color);
|
|
}
|
|
|
|
nav {
|
|
background-color: var(--header-bg);
|
|
color: var(--header-color);
|
|
}
|
|
|
|
nav a {
|
|
color: var(--header-color);
|
|
text-decoration: none;
|
|
transition: color 0.3s ease;
|
|
}
|
|
|
|
nav a:hover {
|
|
color: var(--header-hover);
|
|
}
|