MediaWiki:Common.css
De gahan
Révision datée du 20 juin 2024 à 13:17 par Helyss (discussion | contributions)
Note : après avoir publié vos modifications, il se peut que vous deviez forcer le rechargement complet du cache de votre navigateur pour voir les changements.
- Firefox / Safari : maintenez la touche Maj (Shift) en cliquant sur le bouton Actualiser ou appuyez sur Ctrl + F5 ou Ctrl + R (⌘ + R sur un Mac).
- Google Chrome : appuyez sur Ctrl + Maj + R (⌘ + Shift + R sur un Mac).
- Internet Explorer / Edge : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl + F5.
- Opera : appuyez sur Ctrl + F5.
/*====================*/
/* VARIABLES GLOBALES */
/*====================*/
:root {
--color_main: #661810; /* Couleur général du site - Bordeaux */
--color_main2: #923F31; /* Couleur général +clair */
--color_main3: #CAADA8; /* Couleur général ++clair */
--color_main_dark: #47100B; /* Couleur général +sombre */
--color_main_grey1: #F5F5F5; /* Gris clair+ */
--color_main_grey2: #EAEAEA; /* Gris clair */
--color_main_grey3: #E0E0E0; /* Gris moyen - Fond du site */
--color_main_grey4: #D8D8D8; /* Gris foncé */
--color_main_grey5: #CACACA; /* Gris foncé+ */
--color_gradient1: #496D27; /* ok */
--color_gradient2: #9F4A3B; /* ok */
--color_gradient3: #448086; /* ok */
--color_gradient4: #00BA97; /* pas testé */
--color_gradient5: #00DBF2; /* pas testé */
--color_home_h2: #4D1712; /* Couleur Titre niv 2 de l'accueil */
--color_a: #0752CA; /* Couleur des liens hypertexte (save #0858D9) */
--a_link_title_icon: "⮊"; /* Flèches des liens de titre */
--a_link_title_color: #002C75; /* Couleurs des flèches (save #002C75) */
--fs: 12.5px; /* Police de base - Taille */
--ff: Calibri, sans-serif; /* Police de base - Police */
--fs_XXS: 85%; --fs_XS: 90%; --fs_S: 95%; --fs_M: 100%; --fs_L: 105%; --fs_XL: 110%; --fs_XXL: 115%; /* Taille de police modifiée */
--h1_size: 230%; --h2_size: 210%; --h3_size: 170%; --h4_size: 140%; --h5_size: 125%; --h6_size: 110%; /* Taille des titrs */
--content_marg_left: 140px; /* Marge du site : à droite */
--content_marg_right: 200px; /* Marge du site : à gauche */
--menu_marg_top: 140px; /* Marge du site : en haut */
--box_shadow_menu: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px; /* Ombre des menus - TOC et menu de gauche */
--ibox_size: 270px; /* Taille de l'infobox */
}
/*====================*/
/* BODY et BASE */
/*====================*/
body {
background-image: none;
background-color: var(--color_main_grey3);
font-family: var(--ff);
font-size: var(--fs);
}
.mw-body {line-height: 1.4}
.mw-body h1, .mw-body-content h1, .mw-body-content h2 {font-family: var(--ff);}
/*====================*/
/* ADAPTATION VECTOR */
/*====================*/
.vector-body {font-size: 130%;} /* Ajustement de la taille la police) */
#mw-page-base {background-image: none; background-color: var(--color_main_grey3);} /* Bandeau du haut */
/*====================*/
/* MAIN DU SITE */
/*====================*/
#content {
margin-left: var(--content_marg_left);
margin-right: var(--content_marg_right);
text-align: justify;
border-right: 1px solid #aaaaaa;
}
#footer, .mw-footer {position: relative; text-align: center; z-index: 0;}
/*====================*/
/* HEADER */
/*====================*/
h1, h2, h3, h4, h5, h6, .mw-body h1, .mw-body h2, .mw-body h3, .mw-body h4, .mw-body h5, .mw-body h6 {
font-variant-caps: small-caps;
font-weight: bold;
color: var(--color_main);
padding-top: 0.1em;
padding-bottom: 0.1em;
padding-left: 0.2em;
margin-top: 0.5em;
margin-bottom: 0.5em;
line-height: 1em;
}
h1, .mw-body h1 {
font-size: var(--h1_size);
background-color: var(--color_main);
border-radius: 15px 15px 15px 15px;
color: white;
padding-left: 0.5em;
box-shadow: rgba(0, 0, 0, 0.22) 0px 10px 10px;
line-height: 1.3em;
}
h2, .mw-body h2 {
font-size: var(--h2_size);
box-shadow: 0px 13px 10px -5px var(--color_main_grey4);
border-bottom: 3px solid var(--color_main);
}
.page-Accueil h2 {
color: var(--color_home_h2);
border: 1px solid var(--color_home_h2);
border-bottom: 3px solid var(--color_home_h2);
border-right: 3px solid var(--color_home_h2);
border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.2) 1.95px 1.95px 2.6px;
background-color: var(--color_main_grey1);
line-height: 1.2em;
padding-left: 0.5em;
}
h3, .mw-body h3 {
font-size: var(--h3_size);
border-bottom: 2px solid var(--color_main2);
/* border-image: linear-gradient(to right, var(--color_main), var(--color_main3)) 1; */
}
h4, .mw-body h4 {
font-size: var(--h4_size);
color: black;
border-bottom: 1px solid var(--color_main2);
/* border-image: linear-gradient(to right, var(--color_main), white) 1; */
}
h5, .mw-body h5 {font-size: var(--h5_size); color: black;}
h6, .mw-body h6 {font-size: var(--h6_size); color: black;}
/* Ajouter une icône après les titres contenant des liens, sauf pour les liens "MODIFIER" */
h1 a:not(.mw-editsection a), h2 a:not(.mw-editsection a), h3 a:not(.mw-editsection a),
h4 a:not(.mw-editsection a), h5 a:not(.mw-editsection a), h6 a:not(.mw-editsection a),
.mw-body h1 a:not(.mw-editsection a), .mw-body h2 a:not(.mw-editsection a),
.mw-body h3 a:not(.mw-editsection a), .mw-body h4 a:not(.mw-editsection a),
.mw-body h5 a:not(.mw-editsection a), .mw-body h6 a:not(.mw-editsection a) {
color: inherit; /* Conserver la couleur du titre */
text-decoration: none; /* Supprimer le soulignement par défaut des liens */
position: relative; /* Nécessaire pour le pseudo-élément */
}
h1 a:not(.mw-editsection a)::after, h2 a:not(.mw-editsection a)::after, h3 a:not(.mw-editsection a)::after,
h4 a:not(.mw-editsection a)::after, h5 a:not(.mw-editsection a)::after, h6 a:not(.mw-editsection a)::after,
.mw-body h1 a:not(.mw-editsection a)::after, .mw-body h2 a:not(.mw-editsection a)::after,
.mw-body h3 a:not(.mw-editsection a)::after, .mw-body h4 a:not(.mw-editsection a)::after,
.mw-body h5 a:not(.mw-editsection a)::after, .mw-body h6 a:not(.mw-editsection a)::after {
font-family: -apple-system;
vertical-align: middle;
content: var(--a_link_title_icon);
font-size: 1em;
color: var(--a_link_title_color);
margin-left: 0.4em;
}
/*====================*/
/* HEADER non-header */
/*====================*/
.nh2, .nh3, .nh4, .nh5, .nh6 {
font-variant-caps: small-caps;
font-weight: bold;
color: var(--color_main);
padding-top: 0.1em;
padding-bottom: 0.1em;
margin-top: 0.5em;
line-height: 1em;
}
.nh2 {font-size: var(--h2_size);}
.nh3 {font-size: var(--h3_size);}
.nh4 {font-size: var(--h4_size);}
.nh5 {font-size: var(--h5_size);}
.nh6 {font-size: var(--h6_size);}
.nh4, .nh5, .nh6 {color: black;}
/*====================*/
/* SIDEBAR */
/*====================*/
#sidebar, #mw-panel {
position: fixed;
background-color: var(--color_main_grey3);
top: var(--menu_marg_top);
left: 0px;
box-shadow: var(--box_shadow_menu);;
border-radius: 0px 10px 10px 0px;
padding: 6px 0px 6px 0px;
z-index: 1;
}
#sidebar a, {font-size: var(--fs_S);}
body.skin--responsive #sidebar .pBody {
background-color: transparent;
border: none;
}
/* Taille du menu pour Vector */
.vector-menu-portal .vector-menu-content li {font-size: var(--fs_M);}
.vector-user-menu-legacy li {font-size: var(--fs_M);}
.vector-menu-tabs li a {font-size: var(--fs_M);}
.vector-menu-heading {font-size: var(--fs_M);}
.vector-menu-heading-label {font-size: 150%;}
#left-navigation {margin-left: 13em;}
#p-search, #sidebar .portlet {width: calc(var(--content_marg_left) - 5px); margin: 0;}
#p-search h3, #p-NAVIGATION h3, #p-tb h3, #p-OUTILS_SPECIAUX h3, #p-RACCOURCIS h3, #p-REGIONS h3 {font-weight: bold; border: none; box-shadow: none; font-size: var(--fs_XL);}
#p-search ul, #p-NAVIGATION ul, #p-tb ul, #p-OUTILS_SPECIAUX ul, #p-RACCOURCIS ul, #p-REGIONS ul {margin: 0.25em;}
#p-search input[type="search"] {
font-family: var(--ff);
width: 9.1em;
font-size: var(--fs_XS);
}
#p-search input[type="submit"] { /* Style du bouton de recherche */
font-family: var(--ff);
background-color: var(--color_main2);
color: #fff;
border: none;
border-radius: 4px;
padding: 5px 10px;
cursor: pointer;
font-size: var(--fs_XS);
box-shadow: rgba(0, 0, 0, 0.20) 0px 5px 5px;
}
#p-search input[type="submit"] {display: none;} /* Supprime les boutons de recherche inutiles */
#p-search-label {display: none;} /* Supprime le titre du bouton Rechercher */
#sidebar ul {list-style-type: "●";}
#sidebar ul li {padding-left: 0.1em;}
#sidebar li::marker {color: #6F6F6F; font-size: 100%;}