MediaWiki:Common.css
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).
- Edge : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl + F5.
/* Cette page contrôle l'apparence pour toutes les skins. */ /*\ * * INTERFACE \*/ /* Pour utiliser la police d'écriture Nunito Sans */ @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans&display=swap'); body, .mw-body h1, .mw-body-content h1, .mw-body-content h2 { font-family: 'Nunito Sans', sans-serif; } /* Transferts août */ /* Pour masquer la dernière date de modification et la taille des pages affichées lors d'une recherche */ .mw-search-result-data { display: none; } /* Masquer "Politique de confidentialité", "Avertissements" et "Version mobile" dans le pied de page */ #footer-places-privacy, #footer-places-disclaimers { display: none !important; } /*\ * * PAGE D'ACCUEIL \*/ /* Pour le format vignettes de la page d'accueil */ .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); grid-gap: 1.5em; justify-content: center; width: 100%; text-align: center; } .grid .card { border: solid 2px var(--color-emphasized,#101418); border-radius: 20px; display: flex; flex-direction: column; position: relative; padding: 2.5rem 1.5rem 1.5rem 1.5rem; } .grid .card img { height: 70px; } .grid .card h2 { margin-top: 1.5em; border: none; font-weight:bold; } .grid .card h2 a { color: inherit !important; } /*\ * * PAGES DE DÉBATS ET D'ARGUMENTS \*/ .argument-carte { font-size: 95%; line-height: 1.25; margin-top: 0.25em; display: flex; } .argument-carte img { margin-right: 0.3em; } .titre-argument-carte { color: var(--color-progressive,#36c); } .visited { color: var(--color-visited,#6a60b0); } .contenu-argument-pour { border-left: 1px solid var(--accent-pro,#4dc2b1); } .contenu-argument-contre { border-left: 1px solid var(--accent-con,#e98495); } .bordure-argument-pour { border: 1px solid var(--accent-pro,#4dc2b1); } .bordure-argument-contre { border: 1px solid var(--accent-con,#e98495); } .NavFramex { border-radius: 0.6em; } .NavHead { border-bottom: 1px solid var(--border-color-muted,#dadde3); display: flex; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; } .titre-boite { display: flex; flex-direction: row; justify-content: start; flex-wrap: wrap; align-items: baseline; } /* BOUTONS D'AJOUT */ .bouton-ajouter { font-size: small; } .liste-arguments .bouton-ajouter { font-size: x-small; } .bouton-ajouter .oo-ui-image-progressive.oo-ui-icon-next, .mw-ui-icon-next-progressive::before { background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Eadd%3C/title%3E%3Cpath d=%22M11 9V4H9v5H4v2h5v5h2v-5h5V9z%22/%3E%3C/svg%3E"); } .oo-ui-buttonElement-framed.oo-ui-iconElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon, .oo-ui-buttonElement-framed.oo-ui-iconElement.oo-ui-indicatorElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon { min-width: 15px; } /* BOUTONS DE MODIFICATION */ .modifier-section a, .modifier-rubrique a, .modifier-argument a { display: inline-block !important; white-space: nowrap; vertical-align: middle; background-image: linear-gradient(transparent, transparent), url("/w/images/fr/b/ba/Modifier.svg"); background-repeat: no-repeat; background-position: center; cursor: pointer; font-size: 0; } .modifier-section a:active, .modifier-rubrique a:active, .modifier-argument a:active { outline: 2px solid #3366cc; } .modifier-section a:hover, .modifier-rubrique a:hover, .modifier-argument a:hover { transform: scale(1.03); } .modifier-argument a:focus { background-color: #e5e5e5; padding: 1px; } .ns-0 .argument-expandable-title:not(.expanded) .modifier-argument { display: none; } .modifier-rubrique, .modifier-argument { white-space: nowrap; } /* POUR LE MENU DÉROULANT "MODIFIER" */ .modifier-dropdown { display: block; position: absolute; top: 100%; /* placer le menu sous le bouton "modifier" */ right: 0; /* au lieu de left: 0, pour l’aligner à droite */ border: 1px solid; padding: 4px 5px; border-radius: 4px; } .modifier-dropdown span { display: block; margin: 3px 0; } .modifier-dropdown a { display: block; text-decoration: none; transition: background-color 0.2s, color 0.2s; } img.picto-dropdown { max-width: 14px; max-height: 17px; margin-right: 10px; vertical-align: middle; opacity: 0.75; } .pictogramme { position: relative; bottom: 1px; } .carte-debat-detaille { color: var(--color-emphasized,#101418); background-color: var(--background-color-neutral-subtle, #f8f9fa); font-size: 95%; width: 100%; padding: 5px; } .titre-debat-detaille { font-weight: bold; font-size: 115%; line-height: 1.25; margin-bottom: 0.25em; } .aucun-contenu { font-size: 90%; margin-bottom: 0.5em; } .aucune-reference { margin: 0.25em 0.5em 0 0.5em; font-size: 90%; } .titre-references { font-size: 105%; font-weight: bold; color: inherit; margin: 1em 0 0.5em 0; } .bandeau-en-tete { padding-bottom: .5em; margin-bottom: .5em; background-color: var(--background-color-base, #fff); border-bottom: 1px var(--border-color-subtle, #a2a9b1) solid; } .boite-info { padding: 1em 1.5em; overflow-wrap: break-word; overflow: hidden; } blockquote { quotes: "" ""; font-family: 'Linux Libertine','Georgia','Times',serif; } blockquote .bandeau-avertissement { font-size: 82% !important; } .reference-citation { text-align: right; font-family: 'Linux Libertine','Georgia','Times',serif; } .quotes-expandable-button { cursor: pointer; color: var(--color-progressive,#36c); } .quotes-content-drop.show { display: inline; } .more-content-button { cursor: pointer; color: var(--color-progressive,#36c); font-size: 95%; } .argument-expandable-title.level-sup::before { background-size: 11px; width: 18px; } .fleche-deroulante { opacity: .8; margin-right: 0.45em; } .liste-arguments .fleche-deroulante { margin-right: 0.4em; } .argument-expandable-title.expanded .fleche-deroulante img, .fr-collapsible-toggle-expanded .fleche-deroulante img { transform: scaleY(-1); } .pictogramme-h3 { margin-right: 0.45em; } .pictogramme-h4 { margin-right: 0.4em; } .argument-expandable-title.open { color: var(--color-disabled, #72777d) !important; } .argument-expandable-title:hover { text-decoration: underline; } .gallery.mw-gallery-traditional { margin-top: 1em; } .interwikiextract br { display: none; } .resume-modifications { font-size: 95%; display: inline; margin-right: 1em; color: var(--color-progressive,#36c); cursor: pointer; } .resume-modifications:hover { text-decoration: underline; } .latest-changes-button.mw-ui-button { max-width: none; } .question-FAQ { font-size: 84%; color: var(--color-subtle,#54595d); width: auto; } /*\ * * FONCTION DE SECTIONS DÉROULANTES (mw-collapsible-toggle amélioré) \*/ /* Sections déroulantes — version minimale */ .fr-collapsible { overflow-anchor: none; } .fr-collapsible-toggle { cursor: pointer; opacity: .95; outline: 0; } .fr-collapsible-toggle:focus, .fr-collapsible-toggle:hover { text-decoration: underline; } /* Contenu (important : jamais display:none) */ .fr-collapsible .fr-collapsible-content { display: block !important; overflow: hidden; height: 0; opacity: 0; transition: height .22s ease, opacity .22s linear; } .fr-expanded .fr-collapsible-content { opacity: 1; } /* Optionnel : masquer les libellés texte up/down selon l'état */ .fr-collapsible-toggle-expanded span.up { display: none; } .fr-collapsible-toggle-collapsed span.down { display: none; } /* Accessibilité */ @media (prefers-reduced-motion: reduce) { .fr-collapsible .fr-collapsible-content { transition: none !important; } } .encadre-section-deroulante { border: 1px solid #aaa; border-radius: 5px; } /*\ * * AUTOÉVALUATIONS \*/ .bouton-selectionne .oo-ui-buttonElement-button { border: 3px solid !important; } .bouton-non-selectionne .oo-ui-buttonElement-button { padding: 0.546875em 1em !important; border: 1px solid #36c !important; background-color: #36c !important; color: #fff !important; font-weight: bold !important; cursor: pointer; } /*\ * * EXTENSIONS \*/ /* Abusefilter */ .mw-abusefilter-diff-context, .mw-abusefilter-diff-multiline td { /* les longues lignes sans espace sont fréquentes */ word-wrap: break-word; max-width: 40em; } /* Masque un champ inutile dans Special:Nouvelles pages */ .mwe-pt-snippet { display: none; } /* Pour masquer un champ dans Template Data */ .ve-ui-mwTemplatePage-description-extra { display: none; } /* Comments */ .c-delete a { color: var(--color-destructive,#d73333) !important; } /* Pour l'extension Flow */ h2.flow-topic-title, h2.flow-board-header-title { margin-top : 0 !important; } .flow-component.flow-board-page.flow-full-height-side-rail .flow-board-header::before { background-color: var(--background-color-neutral-subtle,#f8f9fa); border: 1px solid var(--border-color-subtle, #a2a9b1); box-shadow: none; } .flow-board-header * { color: var(--color-base,#202122) !important; } /*\ * * FORMULAIRES SÉMANTIQUES \*/ .select2-match-entire { font-weight: normal; } /* Pour les champs de formulaire */ table.formtable th { vertical-align: middle; } #pfForm textarea { font-size: 1em; line-height: 1.5em; } #pfForm .createboxInput, #pfForm .mandatoryField { width: -moz-available !important; width: -webkit-fill-available; min-height: 2.5em; } /* Pour les cases à cocher des formulaires */ #pfForm input[type="checkbox"] { margin-right: 0; margin-left: 0.25em; } .checkboxLabel { font-size: 0.875em; white-space: nowrap; margin-right: 1em !important; display: inline-flex !important; align-items: center; } /* Pour les caractères des tokens */ li.select2-search-choice { font-size:0.875em; } /* Pour les champs de résumés et de citations des formulaires */ .champ-texte-formulaire { font-family: serif !important; font-size: 100% !important; line-height: 1.5; } /* Boites de multi-instances dans les formulaires */ .multipleTemplateInstance { background-color: #f6f6f6; height: unset !important; } /* Pour enlever l'opacité du bouton "Supprimer une instance" */ td.instanceRemove, td.instanceAddAbove { opacity: 100; } .tippy-tooltip.light-border-theme { max-width: 600px !important; } .tippy-content-container { max-height: none !important; } .tippy-header { display: none; } .logo-aide-parametre { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAjtJREFUeNrEl90rZHEYx88Z1Ma42JCX2dj2QlmlRUoujLjaKLlwsVIuJNn9ExSbi0GScoHEBW64keLGxW4zXCGUFSUvkYzduVjbmiWG2e/DQwcz5/zO2D2/pz7NnDPnPN/v/N4ftdR9qQhGDCgAxSAXvALx/NspOASrYB4sgguRpNECzySBelALsg2erebPTTAGhsEPvRdsBgkbwQpoFxDXRhZw8btNkRhIAJNggJs60nCAPjAFEkUNpIFZUKWX2ZmkKl+c0Te0vI0yMlLJOR1GBuifT4N8vWypL9QHomSm4Y1Rbyp5nDsxnAH6PsIP6kb+S/XJvUy7KtIlNHtGtbpaAzRYykWyLP8MPrl3dB4UHRfvwafHBpLBZ9EMXoi1bVwpvwO31x5fUBnavTYzOFtBinYdaAo3SsMFiXp8gUhnB421j6CFWiAW1CnWB2nGUQsUgddm36bpp42erWtlxmuqG9JJm1qgVJEXZTaeGrLinS3U6mRhOMiAXaKBeDKgSjRwsxD5Jer7yYBXooFjMrAm0cAaGXBLNOAmA3PUFBLEv9OWQgZ+gXEJBibAyd123GvxbPCz5v15YA90WWigG+w8PhF1ggULxJdAR6gj2TmoAfv/UfwAfABn4SqjXVABZkCG7j7qCUQiXnHX9Hp1wTrl/8fdscA5v4lWRjt8UHE9c3b4OQfl2jZbG/4BzaAQDAKfCWEqSPu5mm7mXCFDNVGe0zG6hAohkMPXMfzbJa9stK94wFe+Noy/AgwAS/d56gvLz80AAAAASUVORK5CYII="); background-position: right; background-repeat: no-repeat; background-size: 12px; padding-right: 17px; cursor: pointer; } .logo-aide { margin-left: 0.25em; position: relative; bottom: 1px; cursor: pointer; } .champ-requis { background-image: url(//fr.wikidebates.org/w/images/fr/a/a9/Champ-requis.svg); background-repeat: no-repeat; background-position: 5px; background-size: 13px; padding-right: 20px; cursor: pointer; } /* Pour les messages d'erreurs en haut de formulaire */ #form_error_header { margin: 1em 0 -0.85em 0 !important; } /* Pour agrandir le champ "Résumé des modifications" */ #wpSummary { max-width: none !important; } /* Pour masquer la recherche avancée dans le formulaire "Nouveau titre d'argument" */ .page-Spécial_RunQuery_Nouveau_titre_d_argument .pf-runquery-formcontent, .page-Special_RunQuery_New_argument_title .pf-runquery-formcontent, .page-Spécial_RunQuery_Nouveau_titre_d_argument #ooui-1, .page-Special_RunQuery_New_argument_title #ooui-1 { display: none !important; } .select2-dropdown { border-color: var(--border-color-base,#e7e7e7); border-radius: 1px; } .select2-dropdown, .ve-area-wrapper { background-color: var(--background-color-base, #fff); } #pfForm .createboxInput, #pfForm .mandatoryField, #pfForm textarea { border-color: var(--border-color-base,#e7e7e7); } #pfForm .multipleTemplateInstance, .action-formedit .select2-dropdown { background-color: var(--background-color-interactive); } #pfForm .formtable textarea, #pfForm .createboxInput, #pfForm .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input, #pfForm .pfTokens, .select2-results__option, #pfForm .multipleTemplateInstance select, .ve-area-wrapper .oo-ui-toolbar-bar { background-color: var(--background-color-base, #fff); } #pfForm .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: var(--background-color-neutral); border: none; } .action-formedit .select2-container--default .select2-results__option[aria-selected="true"] { background-color: var(--background-color-disabled); } #pfForm select { min-height: 3.35em !important; } #pfForm .oo-ui-checkboxInputWidget { display: inline-flex; align-items: center; padding: 0.5em 0; } /* Exception pour les boutons "Modification mineure" et "Suivre cette page" */ #pfForm label[title] > .oo-ui-checkboxInputWidget { display: inline-block; padding: 0; } span#wpMinoredit, span#wpWatchthis { margin-right: 6px !important; } .barre-arborescence { color: var(--color-subtle,#54595d); font-size: 95%; } #pfForm .loadingImage { display: none; } #pfForm .editOptions .oo-ui-layout.oo-ui-labelElement.oo-ui-fieldLayout.oo-ui-fieldLayout-align-top .oo-ui-fieldLayout-header { font-weight: bold; font-size: 115%; } #formName { margin-top: 1.5em; } /*\ * * MODE SOMBRE \*/ @media (prefers-color-scheme: dark) { h1, h2, .c-item, .mw-footer { border-color: var(--border-color-subtle, #c8ccd1); } .vector-page-titlebar::after { background-color: var(--border-color-subtle, #c8ccd1); } html.skin-theme-clientpref-os img.mw-file-element, html.skin-theme-clientpref-os .modifier-section, html.skin-theme-clientpref-os .modifier-argument, html.skin-theme-clientpref-os .modifier-rubrique, html.skin-theme-clientpref-os .argument-expandable-title::before, html.skin-theme-clientpref-os .bouton-ajouter .oo-ui-iconElement-icon, html.skin-theme-clientpref-os img.picto-dropdown, html.skin-theme-clientpref-os .flow-board-header .mw-ui-icon-speechBubbles::before, html.skin-theme-clientpref-os .mw-ui-icon-close::before { filter: invert(1) hue-rotate(180deg); } html.skin-theme-clientpref-os .mw-no-invert img, html.skin-theme-clientpref-os .gallery img { filter: none !important; } html.skin-theme-clientpref-os .mw-notification, html.skin-theme-clientpref-os .hover-content-wrapper { box-shadow: none !important; } html.skin-theme-clientpref-os .tippy-box[data-theme~="light-border"][data-placement^="top"] .tippy-arrow::before, html.skin-theme-clientpref-os .tippy-box[data-theme~="light-border"][data-placement^="top"] .tippy-arrow::after { border-top-color: var(--border-color-subtle, #a2a9b1) !important; } html.skin-theme-clientpref-os .tippy-box[data-theme~="light-border"][data-placement^="bottom"] .tippy-arrow::before, html.skin-theme-clientpref-os .tippy-box[data-theme~="light-border"][data-placement^="bottom"] .tippy-arrow::after { border-bottom-color: var(--border-color-subtle, #a2a9b1) !important; } html.skin-theme-clientpref-os a.addAboveButton, html.skin-theme-clientpref-os a.removeButton { border: 1px solid var(--border-color-interactive); } html.skin-theme-clientpref-os:root { --border-color-base: #363431; --border-color-subtle: #363431; } html.skin-theme-clientpref-os .hover-content-wrapper, html.skin-theme-clientpref-os .modifier-dropdown { background-color: var(--background-color-neutral-subtle, #f8f9fa); } } html.skin-theme-clientpref-night img.mw-file-element, html.skin-theme-clientpref-night .modifier-section, html.skin-theme-clientpref-night .modifier-argument, html.skin-theme-clientpref-night .modifier-rubrique, html.skin-theme-clientpref-night .argument-expandable-title::before, html.skin-theme-clientpref-night .bouton-ajouter .oo-ui-iconElement-icon, html.skin-theme-clientpref-night img.picto-dropdown, html.skin-theme-clientpref-night .flow-board-header .mw-ui-icon-speechBubbles::before, html.skin-theme-clientpref-night .mw-ui-icon-close::before { filter: invert(1) hue-rotate(180deg); } html.skin-theme-clientpref-night .mw-no-invert img, html.skin-theme-clientpref-night .gallery img { filter: none !important; } html.skin-theme-clientpref-night .mw-notification, html.skin-theme-clientpref-night .hover-content-wrapper { box-shadow: none !important; } html.skin-theme-clientpref-night .tippy-box[data-theme~="light-border"][data-placement^="top"] .tippy-arrow::before, html.skin-theme-clientpref-night .tippy-box[data-theme~="light-border"][data-placement^="top"] .tippy-arrow::after { border-top-color: var(--border-color-subtle, #a2a9b1) !important; } html.skin-theme-clientpref-night .tippy-box[data-theme~="light-border"][data-placement^="bottom"] .tippy-arrow::before, html.skin-theme-clientpref-night .tippy-box[data-theme~="light-border"][data-placement^="bottom"] .tippy-arrow::after { border-bottom-color: var(--border-color-subtle, #a2a9b1) !important; } html.skin-theme-clientpref-night a.addAboveButton, html.skin-theme-clientpref-night a.removeButton { border: 1px solid var(--border-color-interactive); } html.skin-theme-clientpref-night .hover-content-wrapper, html.skin-theme-clientpref-night .modifier-dropdown { background-color: var(--background-color-neutral-subtle, #f8f9fa); } /* Pour la couleur du texte */ .smw-column-header, .c-form-title { color: var(--color-emphasized,#101418); } /* Pour la couleur de fond des bandeaux */ .bandeau, .boite-info, #Argument_map { background-color: var(--background-color-neutral-subtle, #f8f9fa); } /* Pour la couleur des bordures */ .bandeau-section, .hover-content-wrapper, .modifier-dropdown { background-color: var(--background-color-base, #fff); border-color: var(--border-color-muted,#dadde3) !important; } /* Pour les boutons */ .bouton-ajouter .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .site-button, .c-order-select select { border-color: var(--border-color-subtle, #a2a9b1) !important; background-color: var(--background-color-interactive-subtle,#f8f9fa); color: var(--color-base,#202122); } /* ========================================================= Spotify-like dark (Vector 2022) — Menus plus foncés ========================================================= */ html.skin-theme-clientpref-night { /* Fond du contenu (page) */ --background-color-base: #121212; /* Surfaces « neutres » (menus, barres latérales, TOC, panneaux) */ --background-color-neutral-subtle: #0d0d0d; /* (Optionnel) couleurs d’accent de Wikidébats */ --accent-pro: #3ba58c; --accent-con: #d95a6f; } @media (prefers-color-scheme: dark) { html.skin-theme-clientpref-os { --background-color-base: #121212; --background-color-neutral-subtle: #0d0d0d; /* (Optionnel) accents */ --accent-pro: #3ba58c; --accent-con: #d95a6f; } } html.skin-theme-clientpref-night .vector-sidebar-container, html.skin-theme-clientpref-night .vector-toc, html.skin-theme-clientpref-night .vector-page-toolbar, html.skin-theme-clientpref-night .vector-sticky-header, html.skin-theme-clientpref-night .vector-pinned-container, @media (prefers-color-scheme: dark) { html.skin-theme-clientpref-os .vector-sidebar-container, html.skin-theme-clientpref-os .vector-toc, html.skin-theme-clientpref-os .vector-page-toolbar, html.skin-theme-clientpref-os .vector-sticky-header, html.skin-theme-clientpref-os .vector-pinned-container { background-color: var(--background-color-neutral-subtle); } } html.skin-theme-clientpref-night .vector-menu-tabs li a:hover, html.skin-theme-clientpref-night .vector-menu-tabs li a:focus, @media (prefers-color-scheme: dark) { html.skin-theme-clientpref-os .vector-menu-tabs li a:hover, html.skin-theme-clientpref-os .vector-menu-tabs li a:focus { background-color: #151515; } } .tippy-box[data-placement^="bottom"] > .tippy-arrow::before { top: -9px; left: 2px; } .tippy-box[data-placement^="top"] > .tippy-arrow::before { top: 16px; left: 2px; } .tippy-box[data-theme~="light-border"][data-placement^="bottom"] > .tippy-arrow::after, .tippy-box[data-theme~="light-border"][data-placement^="top"] > .tippy-arrow::after { display: none; } .minerva__tab-container .minerva__tab.new .minerva__tab-text { color: var(--color-subtle,#54595d); } }