MediaWiki:Citizen.css: Difference between revisions
MediaWiki interface page
More actions
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* All CSS here will be loaded for users of the Citizen skin */ | /* All CSS here will be loaded for users of the Citizen skin */ | ||
:root { | :root { | ||
--width-layout: 1800px; /* Slightly wider content */ | |||
--color-primary__l: 60%; | --color-primary__l: 60%; | ||
--color-surface-0: hsl(var(--color-primary__h),20%,10%); | --color-surface-0: hsl(var(--color-primary__h),20%,10%); | ||
| Line 32: | Line 33: | ||
} | } | ||
Revision as of 04:30, 6 April 2024
/* All CSS here will be loaded for users of the Citizen skin */
:root {
--width-layout: 1800px; /* Slightly wider content */
--color-primary__l: 60%;
--color-surface-0: hsl(var(--color-primary__h),20%,10%);
--color-surface-1: hsl(var(--color-primary__h),25%,12%);
--color-surface-2: hsl(var(--color-primary__h),25%,15%);
--color-surface-3: hsl(var(--color-primary__h),15%,20%);
--color-surface-4: hsl(var(--color-primary__h),15%,25%);
--color-base--emphasized: hsl(var(--color-primary__h),80%,95%);
--color-base: hsl(var(--color-primary__h),25%,80%);
--color-base--subtle: hsl(var(--color-primary__h),25%,65%);
--background-color-primary--hover: hsl(var(--color-primary__h),var(--color-primary__s),15%);
--background-color-primary--active: hsl(var(--color-primary__h),var(--color-primary__s),20%);
--background-color-overlay: hsla(var(--color-primary__h),20%,10%,0.95);
--background-color-overlay--lighter: hsla(var(--color-primary__h),20%,10%,0.6);
--color-surface-2--hover: hsl(var(--color-primary__h),30%,19%);
--color-surface-2--active: hsl(var(--color-primary__h),30%,11%);
--surface-shadow: var(--color-primary__h),50%,3%;
--shadow-strength: 0.8;
--filter-invert: invert(1) hue-rotate(180deg);
--font-grade: -25
/* Resimlere uygulanacak temel stil /
.customImage {
transition: transform 0.3s ease; / Animasyon süresi ve türü /
box-shadow: 0px 0px 5px #888888; / Gölge efekti /
}
/ Fare ile resmin üzerine gelindiğinde uygulanacak stil /
.customImage:hover {
transform: scale(1.1); / Resmi %10 büyüt */
}
}