Template:CategoryHeaderBox/styles.css: Difference between revisions
Appearance
Created page with ".category-header-box { margin: 0; padding: 0; } .category-header-table { width: 100%; border-radius: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); background-color: #e8f4fa; border: none; margin: 0; } .category-header-title { font-size: 200%; padding: 20px; background-color: #4B9CD3; color: white; text-align: center; } .category-header-subtitle { font-size: 120%; padding: 10px; text-align: center; } /*..." |
Added dark mode support |
||
| (2 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
.mw-no-invert | |||
.category-header-box { | .category-header-box { | ||
margin: 0; | margin: 0; | ||
| Line 27: | Line 29: | ||
} | } | ||
/* Dark mode | /* Dark mode */ | ||
html.skin-theme-clientpref-night .category-header-table { | |||
background-color: #1e2a35; | |||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); | |||
} | |||
} | |||
html.skin-theme-clientpref-night .category-header-title { | |||
background-color: #2d6a9f; | |||
} | |||
html.skin-theme-clientpref-night .category-header-subtitle { | |||
color: #d0d0d0; | |||
} | } | ||
@media (prefers-color-scheme: dark) { | @media (prefers-color-scheme: dark) { | ||
html.skin-theme-clientpref-os .category-header-table | html.skin-theme-clientpref-os .category-header-table { | ||
background-color: #1e2a35; | |||
background-color: # | box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); | ||
} | } | ||
html.skin-theme-clientpref-os .category-header-title { | html.skin-theme-clientpref-os .category-header-title { | ||
background-color: # | background-color: #2d6a9f; | ||
} | } | ||
html.skin-theme-clientpref-os .category-header-subtitle { | html.skin-theme-clientpref-os .category-header-subtitle { | ||
color: # | color: #d0d0d0; | ||
} | } | ||
} | } | ||
Latest revision as of 22:20, 26 March 2026
.mw-no-invert
.category-header-box {
margin: 0;
padding: 0;
}
.category-header-table {
width: 100%;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
background-color: #e8f4fa;
border: none;
margin: 0;
}
.category-header-title {
font-size: 200%;
padding: 20px;
background-color: #4B9CD3;
color: white;
text-align: center;
}
.category-header-subtitle {
font-size: 120%;
padding: 10px;
text-align: center;
}
/* Dark mode */
html.skin-theme-clientpref-night .category-header-table {
background-color: #1e2a35;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}
html.skin-theme-clientpref-night .category-header-title {
background-color: #2d6a9f;
}
html.skin-theme-clientpref-night .category-header-subtitle {
color: #d0d0d0;
}
@media (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .category-header-table {
background-color: #1e2a35;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}
html.skin-theme-clientpref-os .category-header-title {
background-color: #2d6a9f;
}
html.skin-theme-clientpref-os .category-header-subtitle {
color: #d0d0d0;
}
}