Citizen.css: Difference between revisions
MediaWiki interface page
More actions
Content deleted Content added
No edit summary |
Blanked the page Tags: Blanking Manual revert |
||
| (86 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 */ |
|||
/* Light mode styles */ |
|||
:root.skin-theme-clientpref-light { |
|||
--color-surface-0: red; |
|||
--color-surface-1: lime; |
|||
--color-surface-2: fuchsia; |
|||
--color-surface-3: yellow; |
|||
--color-surface-4: aqua; |
|||
--color-base: blue; |
|||
--color-base--emphasized: darkblue; |
|||
--color-base--subtle: cornflowerblue; |
|||
} |
|||
/* General body styling */ |
|||
body { |
|||
font-family: var(--font-family-base); |
|||
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; |
|||
} |
|||