Citizen.css: Difference between revisions
MediaWiki interface page
More actions
Content deleted Content added
No edit summary |
Blanked the page Tags: Blanking Manual revert |
||
| (90 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* All CSS here will be loaded for users of the Citizen skin */ |
|||
/* Font import */ |
|||
@font-face { |
|||
font-family: 'Afacad-Regular'; |
|||
src: url('https://wiki.arcitex.net/images/fonts/Afacad-Regular.ttf') format('truetype'); |
|||
} |
|||
:root { |
|||
--font-family-base: 'Afacad-Regular', sans-serif; |
|||
--font-size-base: 1.175rem !important; |
|||
} |
|||
/* Light/Dark Mode Support */ |
|||
/* Dark mode styles */ |
|||
body.dark-mode { |
|||
background: #000B1A; /* Dark background */ |
|||
color: #fff; /* Light text color */ |
|||
} |
|||
/* Light mode styles */ |
|||
body.light-mode { |
|||
background: #ffffff; /* Light background */ |
|||
color: #000; /* Dark text color */ |
|||
} |
|||
/* General body styling */ |
|||
body { |
|||
font-family: var(--font-family-base); |
|||
background: #000B1A; /* Default dark background */ |
|||
color: #fff; /* Default text color */ |
|||
transition: background 0.3s, color 0.3s; /* Smooth transition for mode toggle */ |
|||
} |
|||
/* Font size control */ |
|||
body.font-small { |
|||
font-size: 0.875rem !important; /* Smaller font */ |
|||
} |
|||
body.font-medium { |
|||
font-size: 1.175rem !important; /* Standard font */ |
|||
} |
|||
body.font-large { |
|||
font-size: 1.5rem !important; /* Larger font */ |
|||
} |
|||
/* Normal links */ |
|||
a { |
|||
color: #f72a57; |
|||
transition: color 0.3s; |
|||
} |
|||
/* Visited links */ |
|||
a:visited { |
|||
color: #f72a57; |
|||
} |
|||
/* Links when hovered */ |
|||
a:hover { |
|||
color: #f72a57; |
|||
} |
|||
/* Active (clicked) links */ |
|||
a:active { |
|||
color: #f72a57; |
|||
} |
|||
/* New page links */ |
|||
a.new { |
|||
color: #6A38B3 !important; |
|||
} |
|||
/* Additional customizations for dark/light mode if needed */ |
|||
body.dark-mode a { |
|||
color: #f72a57; /* Maintain link color in dark mode */ |
|||
} |
|||
body.light-mode a { |
|||
color: #f72a57; /* Maintain link color in light mode */ |
|||
} |
|||
/* Optional: style for quote blocks or figures (if used) */ |
|||
blockquote p { |
|||
color: #2A3D57; |
|||
} |
|||
figure.mw-default-size figcaption { |
|||
color: #2A3D57; |
|||
} |
|||