MediaWiki:Citizen.css: Difference between revisions
MediaWiki interface page
More actions
No edit summary |
No edit summary |
||
| Line 24: | Line 24: | ||
} | } | ||
.wikitable { | .wikitable { | ||
border- | border-collapse: collapse; /* Collapsed borders */ | ||
border: | border-radius: 10px; /* Rounded corners for the table */ | ||
overflow: hidden; /* Ensures the border-radius affects children */ | overflow: hidden; /* Ensures the border-radius affects children */ | ||
position: relative; /* To contain the pseudo-elements */ | |||
} | } | ||
.wikitable td, .wikitable th { | .wikitable td, .wikitable th { | ||
border: 3px solid # | border: 3px solid #ccc; /* Example cell borders */ | ||
border-radius: 0; /* Reset border radius for individual cells */ | |||
position: relative; /* Ensure cells have their own stacking context */ | |||
} | |||
/* Pseudo-elements for rounding the table corners */ | |||
.wikitable::before, .wikitable::after { | |||
content: ""; | |||
position: absolute; | |||
border-radius: 10px; | |||
border: 3px solid #111; /* Example border to match the table */ | |||
width: 100%; | |||
height: 100%; | |||
top: 0; | |||
left: 0; | |||
pointer-events: none; /* Ensure these do not interfere with clicks */ | |||
box-sizing: border-box; | |||
} | |||
.wikitable::after { | |||
clip-path: inset(0 round 10px); | |||
} | } | ||
Revision as of 15:58, 27 October 2024
/* All CSS here will be loaded for users of the Citizen skin */
:root {
/* My colour variables*/
--myblueone: hsl(207, 45%, 8%); /*0B151D*/
--mybluetwo: hsl(207, 44%, 12%); /*11202C*/
--mybluetest: hsl(207, 44%, 14%); /*11202C*/
/* The actual colours */
--color-surface-0: var(--myblueone);
--color-surface-1: var(--mybluetow);
--color-surface-2: var(--mybluetwo);
--color-surface-3: var(--mybluetwo);
--color-surface-4: var(--mybluetwo);
/* Pink is the new black
--color-primary__h: 209; */
}
.wikitable {
border-collapse: collapse; /* Collapsed borders */
border-radius: 10px; /* Rounded corners for the table */
overflow: hidden; /* Ensures the border-radius affects children */
position: relative; /* To contain the pseudo-elements */
}
.wikitable td, .wikitable th {
border: 3px solid #ccc; /* Example cell borders */
border-radius: 0; /* Reset border radius for individual cells */
position: relative; /* Ensure cells have their own stacking context */
}
/* Pseudo-elements for rounding the table corners */
.wikitable::before, .wikitable::after {
content: "";
position: absolute;
border-radius: 10px;
border: 3px solid #111; /* Example border to match the table */
width: 100%;
height: 100%;
top: 0;
left: 0;
pointer-events: none; /* Ensure these do not interfere with clicks */
box-sizing: border-box;
}
.wikitable::after {
clip-path: inset(0 round 10px);
}
* {
box-shadow: none !important;
}