« MediaWiki:Citizen.css » : différence entre les versions
Page de l’interface de MediaWiki
Autres actions
m add updates from BI work |
m sidebar golden color change |
||
| Ligne 75 : | Ligne 75 : | ||
--color-base: #adbedf; | --color-base: #adbedf; | ||
color: var(--color-base); | color: var(--color-base); | ||
--color-base: # | --color-base: #b19456; | ||
color: # | color: #b19456; | ||
} | } | ||
Version du 25 mai 2026 à 19:42
/* La totalité du CSS placé ici s'appliquera aux utilisateurs de l'habillage Citizen. */
/* Archivum Céleste — basé sur la BI, palette céleste (or + bleu profond + teal) */
.citizen-page-container {
text-align: justify;
}
#mw-searchoptions label.oo-ui-labelElement-label {
white-space: nowrap;
overflow: hidden;
max-width: 200px;
text-overflow: ellipsis;
display: block;
}
input, select, textarea {
background: white;
border: 1px solid grey;
border-radius: 3px;
}
input[name="wpUpload"] {
color: #f5be6b;
background-color: var(--background-color-progressive,#36c);
border-color: var(--background-color-progressive,#36c);
display: flex;
gap: var(--space-sm);
align-items: center;
min-height: 2.25rem;
padding-inline: var(--space-md);
font-weight: var(--font-weight-medium);
transition: var(--transition-hover);
transition-property: opacity;
font-size: inherit;
}
input[name="wpUpload"]:hover {
background-color: var(--color-progressive--hover, #4b77d6);
border-color: var(--color-progressive--hover, #4b77d6);
}
.citizen-header__logo img.mw-logo-icon {
width: 42px;
height: 42px;
}
html {
scroll-padding-top: 80px !important;
}
.citizen-body-container {
min-height: 60vh;
}
.ext-WikiEditor-realtimepreview-preview {
background: #f4f2ea;
}
/** Ajustement auto des images **/
figure[typeof="mw:File"] > a img,
figure[typeof="mw:File/Thumb"] > a img {
max-width: 100%;
height: auto;
}
/** Composants custom **/
.react-zoom {
transition: 0.3s all ease-in-out;
position: relative;
z-index: 0;
}
.react-zoom:hover {
transform: scale(1.05);
z-index: 1;
}
.citizen-drawer__header {
background: #20273312;
}
header.mw-header.citizen-header {
background: url(/resources/assets/sidebar-blue-bg.jpg);
background-size: cover;
box-shadow: inset 0 0 20px #040404, 0 0 2px 1px #42260d, 0 0 0 6px #f5be6b, 0 0 6px 6px #42260d, 0 0 0px 7px #42260d;
--color-base: #adbedf;
color: var(--color-base);
--color-base: #b19456;
color: #b19456;
}
#skin-client-prefs-skin-theme form {
grid-template-columns: repeat(2,1fr);
}
div#skin-client-prefs-skin-theme,
#skin-client-prefs-citizen-feature-pure-black {
display: none;
}
div#citizen-drawer__card {
--color-1: #ffffff;
--color-2: #cfc9bd;
--color-3: #aa8a58;
--color-4: #ffa754;
--color-5: black;
background: linear-gradient(0deg,var(--color-1),var(--color-1),var(--color-2));
box-shadow: var(--color-3) 0px 0px 2px inset,var(--color-1) 0px 0px 15px inset,var(--color-1) 0px 0px 15px inset,var(--color-3) 0px 0px 70px -20px inset,var(--color-5) 0px 5px 15px -10px !important;
}
.citizen-siteStats {
color: #012a40;
}
.citizen-menu .mw-list-item a {
display: flex;
gap: var(--space-sm);
align-items: center;
min-height: 2.25rem;
padding-inline: var(--space-md);
font-weight: var(--font-weight-medium);
color: #302608;
transition: var(--transition-hover);
transition-property: opacity;
}
#citizen-drawer__card .citizen-menu .mw-list-item a .citizen-ui-icon {
display: none;
}
.citizen-client-prefs-radio__label {
border-color: transparent;
color: #012a40;
}
.citizen-client-prefs-radio__input:checked ~ .citizen-client-prefs-radio__label {
border-color: inherit;
color: var(--color-base);
background: var(--color-progressive);
}
.citizen-header__logo .citizen-header__button {
color: transparent;
border-radius: 50%;
--color-1: #d49d3a;
--color-2: #000000;
--color-4: #b86f2b;
--color-3: white;
--color-5: black;
background: linear-gradient(0deg,var(--color-1),var(--color-1),var(--color-2));
box-shadow: var(--color-3) 0px 0px 2px inset,var(--color-1) 0px 0px 15px inset,var(--color-1) 0px 0px 15px inset,var(--color-3) 0px 0px 70px -20px inset,var(--color-5) 0px 5px 15px -10px !important;
width: calc(var(--header-button-size) + 2px);
height: calc(var(--header-button-size) + 2px);
}
.citizen-header__logo .citizen-header__button:hover {
color: var(--color-base);
color: black;
}
@media screen and (min-width: 640px) {
.citizen-drawer__logo img {
display: none;
}
}
div#citizen-preferences__card,
div#citizen-userMenu__card {
--color-1: #e8e5df;
--color-2: #cfc9bd;
--color-3: #aa8a58;
--color-4: #ffa754;
--color-5: black;
background: linear-gradient(0deg, var(--color-1), var(--color-1), var(--color-2));
box-shadow: var(--color-3) 0px 0px 2px inset, var(--color-1) 0px 0px 15px inset, var(--color-1) 0px 0px 15px inset, var(--color-3) 0px 0px 70px -20px inset, var(--color-5) 0px 5px 15px -10px !important;
}
.citizen-userInfo-usergroups a ,
.citizen-userInfo-stats-item-value {
color: #012a40;
}
.citizen-userInfo #pt-userpage-2 > a > span {
font-family: 'Spectral SC',serif;
font-weight: normal;
color: var(--color-progressive);
}
:root {
--background-color-base: #cfc9bc;
--color-surface-0: #cfc9bc;
--transform-image-hover: 1;
--delta-lightness-state-base: 4%;
--delta-lightness-surface-base: -2%;
--color-progressive-oklch__l: 53.25%;
--color-progressive-oklch__c: 0.1679;
--color-progressive-oklch__h: 262.29;
--color-surface-0-oklch__l: 96%;
--color-surface-0-oklch__c: 0.01;
--color-emphasized-oklch__l: 5%;
--color-emphasized-oklch__c: 0.07000000000000001;
--color-base-oklch__l: 20%;
--color-base-oklch__c: 0.09;
--color-subtle-oklch__l: 35%;
--color-subtle-oklch__c: 0.11;
--color-placeholder-oklch__l: 40%;
--color-placeholder-oklch__c: 0.07000000000000001;
--color-disabled-oklch__l: 60%;
--color-disabled-oklch__c: 0.05;
--color-inverted-primary: #fff;
--color-destructive__h: 340;
--color-destructive__l: 40%;
--color-success__h: 170;
--color-success__l: 17%;
--color-warning__h: 48;
--color-warning__l: 40%;
--background-color-subtle__s: 95%;
--background-color-subtle__l: 95%;
--background-color-icon: rgba(0,0,0,var(--opacity-icon-base));
--background-color-icon--hover: rgba(0,0,0,var(--opacity-icon-base--hover));
--background-color-icon--active: rgba(0,0,0,var(--opacity-icon-base--active));
--color-link: var(--color-progressive);
--color-link--hover: var(--color-progressive--hover);
--color-link--active: var(--color-progressive--active);
--color-syntax-red: #e53935;
--color-syntax-orange: #f76d47;
--color-syntax-yellow: #e2931d;
--color-syntax-green: #91b859;
--color-syntax-cyan: #39adb5;
--color-syntax-blue: #6182b8;
--color-syntax-paleblue: #8796b0;
--color-syntax-purple: #9c3eda;
--color-syntax-brown: #916b53;
--color-syntax-pink: #ff5370;
--color-syntax-violet: #945eb8;
--color-syntax-grey: #90a4ae;
--backdrop-filter-frosted-glass: blur(16px) saturate(140%);
--backdrop-opacity: 0.65;
--filter-invert: none;
--filter-invert-primary: invert(1) hue-rotate(180deg);
--opacity-glass: 0.9;
--font-grade: 25;
--shadow-color-oklch__l: 12%;
--shadow-color-oklch__c: 0.01;
--shadow-color-hsl__s: 10%;
--shadow-color-hsl__l: 20%;
--shadow-opacity: 0.03;
color-scheme: light;
--color-progressive-hsl__h: 220;
--color-progressive-hsl__s: 60%;
--color-progressive-hsl__l: 50%;
--color-surface-0-hsl__s: 30%;
--color-surface-0-hsl__l: 96%;
--color-surface-1-hsl__s: 40%;
--color-emphasized-hsl__s: 85%;
--color-emphasized-hsl__l: 5%;
--color-base-hsl__s: 30%;
--color-base-hsl__l: 20%;
--color-subtle-hsl__s: 40%;
--color-subtle-hsl__l: 35%;
--color-placeholder-hsl__s: 85%;
--color-placeholder-hsl__l: 40%;
--color-disabled-hsl__s: 85%;
--color-disabled-hsl__l: 60%;
--border-radius-medium: calc(var(--border-radius-base) * 2);
--border-radius-large: calc(var(--border-radius-base) * 3);
--box-shadow-border: var(--border-color-base) 0 0 0 1px;
--filter-invert-fixed: invert(1) hue-rotate(180deg);
--font-family-citizen-base: 'Roboto','Roboto-fallback';
--font-family-citizen-serif: 'Roboto Serif','Roboto Serif-fallback';
--font-family-citizen-monospace: 'Roboto Mono','Roboto Mono-fallback';
--font-family-language-base: '';
--font-family-language-serif: '';
--font-family-language-monospace: '';
--size-icon: 1.25rem;
--toolbar-size: 2.5rem;
--height-sticky-header: 0px;
--header-size: 3.5rem;
--header-card-maxheight: 80vh;
--overflow-gradient-size: 2rem;
--width-layout: 1080px;
--width-layout--extended: calc(var(--width-layout) * 1.5);
--width-layout--extended-alt: calc(var(--width-layout) * 1);
--width-toc: 240px;
--width-page: 1080px;
--padding-page: 16px;
--border-width-base: 1px;
--border-width-thick: 2px;
--border-radius-base: 4px;
--border-radius-sharp: 0;
--border-radius-pill: 9999px;
--border-radius-circle: 50%;
--box-shadow-small: 0 0 0 1px var(--border-color-base);
--box-shadow-medium: 0 0.5px 0.6px var(--box-shadow-color-alpha-base),0 1.6px 1.8px -0.8px var(--box-shadow-color-alpha-base),0 4px 4.5px -1.7px var(--box-shadow-color-alpha-base),0 9.8px 11px -2.5px var(--box-shadow-color-alpha-base);
--box-shadow-large: 0 0.5px 0.6px var(--box-shadow-color-alpha-base),0 2.8px 3.1px -0.4px var(--box-shadow-color-alpha-base),0 5.3px 6px -0.7px var(--box-shadow-color-alpha-base),0 8.7px 9.8px -1.1px var(--box-shadow-color-alpha-base),0 13.9px 15.6px -1.4px var(--box-shadow-color-alpha-base),0 21.8px 24.5px -1.8px var(--box-shadow-color-alpha-base);
--font-family-base: var(--font-family-citizen-base),var(--font-family-language-base),system-ui,-apple-system,sans-serif;
--font-family-serif: var(--font-family-citizen-serif),var(--font-family-language-serif),'Linux Libertine','Georgia','Times','Source Serif Pro',serif;
--font-family-monospace: var(--font-family-citizen-monospace),var(--font-family-language-monospace),'Menlo','Consolas','Liberation Mono','Fira Code','Courier New',monospace;
--font-weight-normal: 400;
--font-weight-medium: calc(var(--font-weight-normal) + 100);
--font-weight-semi-bold: calc(var(--font-weight-normal) + 200);
--font-weight-bold: calc(var(--font-weight-normal) + 300);
--font-family-overline: var(--font-family-base);
--font-weight-overline: var(--font-weight-medium);
--font-size-overline: var(--font-size-small);
--line-height-overline: var(--line-height-small);
--text-transform-overline: none;
--letter-spacing-overline: normal;
--color-primary__h: var(--color-progressive-hsl__h);
--color-primary__s: var(--color-progressive-hsl__s);
--color-primary__l: var(--color-progressive-hsl__l);
/* override Archivum Céleste : direction céleste (or + bleu profond + teal) */
--color-link: #30818b !important;
--color-link--hover: #005173;
--color-link--active: #005173;
--color-visited: #30818b !important;
--color-visited--hover: #005173;
--color-visited--active: #005173;
--color-progressive-oklch__l: 33.25%;
--color-progressive-oklch__c: 0.3079;
--color-progressive-oklch__h: 200;
--color-destructive__h: 340;
--color-destructive__l: 20%;
--color-subtle-oklch__l: 38%;
--color-subtle-oklch__c: 0.32;
--background-color-button-quiet--hover: rgb(0 80 115 / 47%);
--background-color-button-quiet--active: rgb(0 80 115 / 29%);
}
input {
--background-color-base: white;
}
.skin-citizen .mw-ui-container {
background: var(--color-surface-3);
}
.citizen-menu__heading {
font-family: 'Spectral SC',serif;
font-weight: normal;
color: #005173;
text-shadow: 0 0 1px #005173;
}
.citizen-drawer__siteinfo {
display: flex;
flex-direction: column-reverse;
gap: var(--space-xxs);
}
.mw-logo-wordmark {
font-family: 'Spectral SC',serif;
font-weight: normal;
color: #005173;
letter-spacing: -0.5px;
}
.citizen-footer__sitetitle {
display: flex;
flex-direction: row;
gap: var(--space-sm);
align-items: center;
}
.citizen-footer__sitetitle .mw-logo-wordmark {
font-size: var(--font-size-xxx-large);
color: var(--color-progressive);
}
@media screen and (min-width: 640px) {
.mw-logo-wordmark {
font-size: 1.35rem;
}
}
footer.mw-footer.citizen-footer {
--color-1: #e8e5df;
--color-2: #cfc9bd;
--color-3: #aa8a58;
--color-4: #ffa754;
--color-5: black;
background: linear-gradient(0deg, var(--color-1), var(--color-1), var(--color-2));
box-shadow: var(--color-3) 0px 0px 2px inset, var(--color-1) 0px 0px 15px inset, var(--color-1) 0px 0px 15px inset, var(--color-3) 0px 0px 70px -20px inset, var(--color-5) 0px 5px 15px -10px !important;
}
.citizen-footer__content,
.citizen-footer__bottom {
gap: 0 var(--space-xxl);
}
#footer-places ul {
display: flex;
align-items: center;
justify-content: space-around;
}
nav#footer-places ul a {
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
@media screen and (min-width: 1120px) {
body.citizen-toc-enabled .page-actions {
padding-right: 50px;
}
:root.citizen-header-position-left {
--header-size-inline-start: 85px;
}
.citizen-page-container {
padding-left: 85px;
}
.citizen-page-sidebar {
padding-right: 22px;
}
.citizen-page-container {
position: relative;
--bg-color: #0d476529;
background-position: center top,left top,right top;
background-repeat: no-repeat,no-repeat,no-repeat;
background-attachment: fixed,fixed,fixed;
background: linear-gradient(90deg,#00263c00,var(--bg-color) 20%,var(--bg-color) 80%,#cfc9bd00);
}
.citizen-page-container > * {
z-index: 2;
}
html.citizen-feature-custom-width-clientpref-standard .citizen-page-container::after {
content: '';
--content-margin: calc(calc(95% - calc(var(--width-layout) + var(--width-toc))) / 2);
position: absolute;
inset: 0 var(--content-margin) 0 calc(var(--content-margin) + 40px);
background: var(--color-surface-0);
box-shadow: 0 0 12px black,0 0 30px -10px black,0 0 50px black;
background: url(/resources/assets/top-border.webp), linear-gradient(90deg,transparent,#cfc9bd 50px,#CFC9BB calc(100% - 50px),transparent),url(/resources/assets/deco/Border-page.jpg),url(/resources/assets/deco/Border-page-mirror.jpg) #cfc9bd;
background-repeat: repeat no-repeat, no-repeat no-repeat,no-repeat repeat,no-repeat repeat;
background-position: left top, center center,-20px top,calc(100% + 20px) top;
background-size: auto 21px, auto auto, 78px auto,78px auto;
}
html.citizen-feature-custom-width-clientpref-standard .citizen-page-container {
position: relative;
--bg-color: #0d476529;
background: linear-gradient(90deg,#00263c00,var(--bg-color) 20%,var(--bg-color) 80%,#cfc9bd00) #010106eb;
}
.citizen-page-container > footer.mw-footer.citizen-footer {
z-index: 1;
}
header.mw-header.citizen-header::after {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 14px;
transform: translateX(21px);
background: url(/resources/assets/frise-v.jpg);
background-size: 100% auto;
box-shadow: 4px 0 #f5be6b, 4px 0 10px black;
}
html.citizen-feature-custom-width-clientpref-standard .citizen-page-container::before {
--img-height: 900px;
content: '';
position: fixed;
height: var(--img-height);
top: 0;
left: 84px;
right: 0;
background: url(/resources/assets/deco/B-5.webp),url(/resources/assets/deco/A-3.webp);
z-index: 0;
background-position: -100px top,calc(100% + 130px) top;
background-size: auto var(--img-height),auto var(--img-height);
background-repeat: no-repeat,no-repeat;
filter: sepia(1) hue-rotate(-15deg);
-webkit-mask: linear-gradient(180deg,white,transparent 75%);
mask: linear-gradient(180deg,white,transparent 75%);
}
}
.citizen-userInfo-stats-item-label {
font-family: 'Spectral SC',serif;
font-weight: normal;
color: var(--color-progressive);
}
kbd.citizen-keyboard-hint-key {
display: none;
}
.citizen-drawer__menu {
--size-icon: 1rem;
display: grid;
grid-template-columns: repeat(auto-fit,minmax(15rem,auto));
gap: var(--space-sm);
justify-content: center;
max-width: inherit;
padding: var(--space-xs);
background: #000000bf;
padding: 0.7em;
box-sizing: border-box;
box-shadow: 0 5px 5px #00000082,inset 0 0 0 1px #ffffff1a;
background: #806d4f2e;
margin: 0;
}
.citizen-drawer__menu #n-Communauté a,
.citizen-drawer__menu #n-Nos-wikis a {
pointer-events: none;
margin-left: var(--space-xs);
padding-left: var(--space-md);
padding-right: var(--space-xs);
border-left: 1px solid var(--border-color-base);
border-radius: 0;
letter-spacing: 0.05em;
font-weight: var(--font-weight-normal);
color: #002a40 !important;
}
.mw-portlet-External {
position: sticky;
bottom: 0;
margin-top: var(--space-md);
margin-inline: calc(var(--space-xs) * -1);
padding: var(--space-xs);
border-top: var(--border-base);
backdrop-filter: var(--backdrop-filter-frosted-glass);
font-size: var(--font-size-x-small);
grid-column: 1 / -1;
white-space: nowrap;
}
.mw-portlet-External .citizen-menu__heading {
display: none;
}
.mw-portlet-External ul {
display: flex;
overflow: auto;
}
li#n-sidebar-icon-discord a::before {
content: "\f392";
--_fa-family: var(--fa-family, var(--fa-style-family, "Font Awesome 7 Free"));
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
display: var(--fa-display, inline-block);
font-family: var(--_fa-family);
font-feature-settings: normal;
font-style: normal;
font-synthesis: none;
font-variant: normal;
font-weight: var(--fa-style, 900);
line-height: 1;
text-align: center;
text-rendering: auto;
--fa-family: var(--fa-family-brands);
--fa-style: 400;
width: var(--fa-width, 1.25em);
color: #012a40;
font-size: 1rem;
}
li#n-sidebar-icon-discord a * {
display: none;
}
.citizen-siteStats {
color: #697381;
}
li#t-upload {
display: none;
}
.card-subtype:first-child,
.card-subtype:not([class*="2"]) + * + [class*="2"],
.card-subtype:not([class*="3"]) + * + [class*="3"],
.card-subtype:not([class*="4"]) + * + [class*="4"],
.card-subtype:not([class*="5"]) + * + [class*="5"] {
display: block !important;
}
.card-custom {
transition-timing-function: var(--transition-timing-function-ease-out);
transition-duration: var(--transition-duration-medium);
--bg-color: #001a2cf0;
--title-spacing: 1.5rem;
--title-size: 20px;
}
.card-custom:hover {
transform: translate(0, -5px);
box-shadow: 0 0 0 1px #00000012, 2px 2px 15px -3px black, 2px 10px 15px -8px black !important;
}
.card-custom > a {
position: absolute;
inset: 0 0 0 0;
opacity: 0;
user-select: none;
z-index: 5;
}
.card-custom .image-item-wrapper * {
position: absolute;
inset: 0 0 0 0;
display: block;
height: 100%;
width: 100%;
}
.card-custom .image-item-wrapper img {
object-fit: cover;
}
.card-custom .card-custom-color::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 30px;
background: linear-gradient(rgba(0, 0, 0, 0) 0%, var(--bg-color) 50%);
}
/** customized card (cf. Modèle:CardResultCustomerClass) **/
.card-custom[class*="faction-"] {
width: 140px !important;
}
.card-custom[class*="faction-"] * {
--title-spacing: 0.75rem;
--title-size: 16px;
}
.card-custom[class*="faction-"] .card-custom-title {
box-shadow: 0 0 1px 1px #0000006b,0 0 0 1px #00000070 !important;
border-radius: 2px !important;
padding: 5px !important;
color: #f0f0f0 !important;
background: #161515ba !important;
}
/* Couleurs spécifiques des factions AOS à compléter ici, par ex. :
.card-custom.faction-stormcast-eternals { --bg-color: #1a3a5c; }
.card-custom.faction-sylvaneth { --bg-color: #1f3a25; }
.card-custom.faction-slaves-to-darkness{ --bg-color: #3a0d12; }
.card-custom.faction-skaven { --bg-color: #34483b; }
.card-custom.faction-nighthaunt { --bg-color: #0c2a2e; }
... etc.
*/
@media screen and (min-width: 1680px) {
.ns-14 {
--width-layout--extended: var(--width-layout--extended-alt);
}
}
@media screen and (min-width: 1680px) {
:root.citizen-feature-custom-width-clientpref-standard {
--width-layout: 1080px !important;
}
:root.citizen-feature-custom-width-clientpref-wide {
--width-layout: 1600px !important;
}
custom-width-clientpref-full {
--width-layout: 100vw !important;
}
.ns-14 {
--width-layout: var(--width-layout) !important;
--width-page: calc(var(--width-layout) + var(--width-toc) + var(--space-lg)) !important;
}
.ns-6, .ns-14 {
--width-layout: var(--width-layout--extended) !important;
--width-page: calc(var(--width-layout--extended) + var(--width-toc) + var(--space-lg)) !important;
}
}
.accueil-message {
position: relative;
border-radius: 5px;
overflow: hidden;
}
.accueil-message::before {
content: '';
position: absolute;
inset: 0 auto 0 0;
width: 600px;
background: url(/resources/assets/AC-intro.jpg);
background-size: calc(100% + 200px);
background-repeat: no-repeat;
background-position-y: 50%;
background-position-x: -200px;
border-radius: 10px;
}
.accueil-message-content {
position: relative;
margin: 30px 0 30px 30%;
}
.accueil-message-content > * {
padding: 20px 30px;
color: #000000;
backdrop-filter: blur(0);
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%), radial-gradient(#ffffff 70%, transparent 150%) !important;
box-shadow: 0 5px #0000006b, 0 6px #005173, 0 7px 2px #00000070, 0 -6px #0000006b, 0 -7px #005173, 0 -8px #00000070;
}
.accueil-message-content-sign {
text-align: end;
font-style: italic;
}
@media screen and (max-width: 1119px) {
.accueil-message {
margin: 0 -20px;
}
.accueil-message-content {
margin: 7px 30px 100px 30px;
}
.accueil-message::before {
content: '';
position: absolute;
inset: 0 auto 0 0;
width: 100%;
background: url(/resources/assets/AC-image.png);
background-repeat: no-repeat;
background-position-y: -82px;
background-position-x: center;
border-radius: 0;
}
body, .citizen-page-container {
background: #cfc9bd !important;
}
}
.discord-pane:hover {
box-shadow: 0 1px 16px -5px #001a2c !important;
}
.discord-pane-logo > a {
border-radius: 50%;
box-shadow: 0 4px 10px black;
padding: 4px;
background: #515dc5;
width: 65px;
height: 65px;
display: flex;
align-items: center;
justify-content: center;
font-size: 35px;
z-index: 1;
text-decoration: none;
}
.discord-pane-logo > a::before,
.discord-pane-logo > a::after {
display: none !important;
}
.discord-pane-top-message {
position: absolute;
bottom: 100%;
left: 50%;
transform: translateX(-50%) translateY(17px);
padding: 8px 16px;
z-index: 5;
border-radius: 3px;
color: #f5be6b;
font-family: 'Spectral SC', serif;
font-weight: normal;
background: #141517;
background: url(/resources/assets/topbar-bg-grey.jpg);
background-size: auto 100%;
box-shadow: inset 0 5px 20px -5px black, inset 0 5px 20px -5px black;
}
.discord-pane-top-message img {
filter: saturate(0.7) hue-rotate(-10deg) brightness(0.8) contrast(1.1);
}
@media screen and (max-width: 1119px) {
.discord-pane-character {
inset: 100% 0 0 0;
transform: translateX(30%) !important;
}
}
h1,
h2 {
font-family: 'Spectral SC', serif;
font-weight: normal;
}
.citizen-sticky-header-background {
background: #141517;
background: url(/resources/assets/topbar-bg-grey.jpg);
background-size: auto 100%;
box-shadow: inset 0 10px 40px -10px black;
}
.citizen-sticky-header {
--color-base: #f5be6b;
}
.citizen-sticky-header-page-title {
color: white;
font-family: 'Spectral SC', serif;
font-weight: normal;
}
.citizen-page-container {
--bg-color: #cfc9bd;
}
#ca-edit > a, #ca-ve-edit > a {
color: #f5be6b;
background-color: var(--background-color-progressive);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
color: #f5be6b;
background-color: var(--background-color-progressive,#36c);
border-color: var(--background-color-progressive,#36c);
}
.citizen-command-palette__footer-hints {
display: none;
}
div#footer-tagline,
p#footer-desc {
color: black;
}
.citizen-footer a {
color: var(--color-link);
text-decoration: none;
}
.citizen-footer a:hover {
color: var(--color-link-hover);
}
.citizen-footer a:active {
color: var(--color-link-active);
}
@media (min-width: 1120px) {
table.wikitable[style*="float:left"],
table.wikitable[style*="float: left"] {
float: left !important;
margin-right: 10px;
margin-bottom: 10px;
}
table.wikitable[style*="float:right"],
table.wikitable[style*="float: right"] {
float: right !important;
margin-left: 10px;
margin-bottom: 10px;
}
}
#footer-places {
align-items: center;
}
li#footer-places-about {
display: none;
}
.mw-cookiewarning-container {
bottom: 0;
right: 0;
top: unset;
margin: 0;
border-radius: 0;
background: #141517;
display: flex;
flex-direction: column;
}
@media only screen and (min-width: 1120px) {
.citizen-header-position-left .mw-cookiewarning-container {
left: unset;
bottom: 0;
right: 0;
top: unset;
width: min(500px, calc(100vw + calc(2 * var(--space-xs))));
}
}
.mw-cookiewarning-container .oo-ui-layout.oo-ui-horizontalLayout {
gap: var(--space-md);
grid-template-columns: minmax(0,1fr);
}
.mw-cookiewarning-container .mw-cookiewarning-text {
color: #fff !important;
padding: 10px 0;
color: white;
}
.citizen-menu__card {
backdrop-filter: unset;
}
@media (min-width: 1120px) {
.accueil-subtitle {
position: relative;
}
.accueil-subtitle::before {
content: '';
position: absolute;
right: calc(100% + 60px);
top: 100%;
width: 100%;
height: 3px;
background: radial-gradient(at right, black, transparent 70%);
}
.accueil-subtitle::after {
content: '';
position: absolute;
left: calc(100% + 60px);
top: 100%;
width: 100%;
height: 3px;
background: radial-gradient(at left, black, transparent 70%);
}
}
.wikiEditor-ui-view.wikiEditor-ui-view-wikitext {
background: white;
}
figcaption {
margin: 4px 0 0 0 !important;
padding: 5px 10px !important;
font-family: var(--font-family-citizen-serif);
font-size: var(--font-size-medium);
color: black;
--color-1: #ffffff;
--color-2: #ffffff;
--color-3: #44423e;
--color-4: #ffa754;
--color-5: black;
background: linear-gradient(0deg,var(--color-1),var(--color-1),var(--color-2));
box-shadow: inset 0 0 0 1px #00000047,var(--color-3) 0px 0px 2px inset,var(--color-1) 0px 0px 15px inset,var(--color-1) 0px 0px 15px inset,var(--color-3) 0px 0px 70px -20px inset,var(--color-5) 0px 5px 15px -10px,0 4px #005173,0 5px 2px #00000070,0 -4px #0000006b,0 -5px #005173,0 -7px #00000070;
}
div#catlinks div#mw-normal-catlinks li > a {
background: white;
color: black;
}
nav#footer-icons {
display: none;
}
/** default button **/
button.btn {
vertical-align: top;
text-align: center;
position: relative;
min-height: 32px;
text-decoration: none;
border-style: solid;
border-width: 1px;
padding-left: 12px;
padding-right: 12px;
font-weight: var(--font-weight-medium);
border-radius: var(--border-radius-base);
line-height: 1;
transition-property: background-color,color,border-color,box-shadow;
transition-duration: 100ms;
padding-top: 5px;
padding-bottom: 5px;
cursor: pointer;
display: inline-block;
box-sizing: border-box;
white-space: nowrap;
font-size: inherit;
background-color: var(--background-color-interactive-subtle, #f8f9fa);
color: var(--color-base, #202122);
border-color: var(--border-color-base, #a2a9b1);
}
button.btn:hover {
background-color: var(--background-color-base, #fff);
color: var(--color-base--hover, #404244);
border-color: var(--border-color-base, #a2a9b1);
}
button.btn.btn-primary {
color: #f5be6b;
background-color: var(--background-color-progressive,#36c);
border-color: var(--background-color-progressive,#36c);
}
button.btn.btn-primary:hover {
background-color: var(--color-progressive--hover, #4b77d6);
border-color: var(--color-progressive--hover, #4b77d6);
}
#Sources,
#Source {
clear: both;
display: block;
}
table.formtable input, table.formtable select, table.formtable textarea, textarea#pf_free_text {
background: white;
font-size: 0.85rem;
outline: 0;
}
.runQueryEmbedded .search-inputs-wrapper,
.runQueryEmbedded form#pfForm > .mw-content-ltr.mw-parser-output,
.runQueryEmbedded .search-inputs-wrapper * {
display: flex;
align-items: center;
margin: 0;
flex-direction: row-reverse;
justify-content: center;
gap: 10px;
}
.leaflet-container {
background-color: #e9e5d6;
border-radius: 5px;
}
img.map-icon-overlay.leaflet-interactive:hover {
filter: brightness(1.2) contrast(120%);
}
.leaflet-popup {
--x-color: #003044;
}
.leaflet-popup-content-wrapper {
box-shadow: inset 0 0 0 4px var(--x-color),inset 0 0 0 8px black,#aa8a58 0px 0px 2px 8px inset,#e8e5df 0px 0px 15px 8px inset,#e8e5df 0px 0px 15px 8px inset,#aa8a58 0px 0px 70px -12px inset,black 0px 5px 15px -10px;
background: #e9e5d6;
}
.leaflet-popup-tip {
background: var(--x-color);
}
.leaflet-popup-content {
margin: 0;
}
img.popup-image {
float: right;
margin: 0 0 4px 4px;
}
.leaflet-popup-content .popup-title {
padding: 6px 10px 4px 10px;
border-radius: 5px 5px 0 0;
border-bottom: 0;
box-shadow: 0 0 0 1px var(--x-color),0 11px 0 -7px #cc8a26,0 10px 10px -6px black;
z-index: 10;
position: relative;
background: linear-gradient(90deg,black, var(--x-color) 20%);
}
.leaflet-popup-content .popup-title a {
color: #f5be6b;
font-family: 'Spectral SC', serif;
font-weight: normal;
font-size: 14px;
}
.leaflet-popup-content .popup-desc {
padding: 13px 24px 13px 20px;
font-family: var(--font-family-base);
font-variation-settings: 'GRAD' var(--font-grade);
font-weight: var(--font-weight-normal);
font-size: var(--font-size-small);
line-height: 1.4;
}
.leaflet-popup-content .popup-desc::first-letter,
.leaflet-popup-content .popup-desc span::first-letter {
font-family: "Germania Versalien";
font-size: 40px;
float: left;
margin: -9px 4px -10px 0;
}
.map-icon-overlay {
pointer-events: auto;
}
.leaflet-zoom-animated .map-icon-overlay {
transition: transform 0.15s linear;
}
.leaflet-container a.leaflet-popup-close-button {
z-index: 10;
}
@font-face{
font-family: "Germania Versalien";
src: url("/resources/assets/fonts/germania-versalien/d36b44b6a3db50effb9a46cb68e5627c.eot");
src: url("/resources/assets/fonts/germania-versalien/d36b44b6a3db50effb9a46cb68e5627c.eot?#iefix")format("embedded-opentype"),
url("/resources/assets/fonts/germania-versalien/d36b44b6a3db50effb9a46cb68e5627c.woff")format("woff"),
url("/resources/assets/fonts/germania-versalien/d36b44b6a3db50effb9a46cb68e5627c.woff2")format("woff2"),
url("/resources/assets/fonts/germania-versalien/d36b44b6a3db50effb9a46cb68e5627c.ttf")format("truetype"),
url("/resources/assets/fonts/germania-versalien/d36b44b6a3db50effb9a46cb68e5627c.svg#Germania Versalien")format("svg");
font-weight: normal;
font-style: normal;
font-display: swap;
}
span#wpRunQuery button {
background: linear-gradient(90deg, black, #2e2e2e 20%);
box-shadow: inset 0 0 0 4px black, 0 0 2px black, 0 0 0 4px #3d3419;
padding: 10px 15px 10px 2.71428571em;
outline: 0;
border: 0;
border-radius: 1px;
position: relative;
transition: all 0.3s ease-in-out;
user-select: none;
}
span#wpRunQuery button:hover {
background: linear-gradient(90deg, black, #003044 20%);
}
span#wpRunQuery button::after {
content: '';
position: absolute;
inset: -4px 0 0 -4px;
background: url('/resources/assets/button-corner.webp');
background-repeat: no-repeat;
background-size: 24px 24px;
z-index: 100;
pointer-events: none;
}
/* SMW – Parcourir les propriétés */
#t-smwbrowselink a::before {
content: '';
display: inline-block;
width: 1.25em;
height: 1.25em;
margin-right: 0.5em;
vertical-align: -0.15em;
/* icône OOUI */
background: currentColor;
-webkit-mask: url("/resources/lib/ooui/themes/wikimediaui/images/icons/article-ltr.svg") no-repeat center;
mask: url("/resources/lib/ooui/themes/wikimediaui/images/icons/article-ltr.svg") no-repeat center;
}
/* fix: remove auto <br> injection */
p > br:first-child:last-child {
display: none;
}