Modifie cette page si tu souhaites l’améliorer. Mort de rire

MediaWiki

« Foreground.css » : différence entre les versions

sur le Dico des Ados : ton dictionnaire collaboratif, libre et gratuit !

style des listes à puces, notamment dans le formulaire d’édition d’un mot, section "Liens externes pertinents"
Vivian (discussion | contributions)
Refonte de la page complète (on croise les doigts...)
Balise : Révoqué
Ligne 1 : Ligne 1 :
/* ===============================
  VARIABLES GLOBALES
  =============================== */
:root {
  --clr-bg:        #fff;
  --clr-text:      #222;
  --clr-accent:    #3498db;
  --clr-accent-dark:#206dc2;
  --clr-accent-light:#5a9ce6;
  --clr-border:    #cfd9e8;
  --clr-panel-bg:  #f4f7fc;
  --clr-label:      #008cba;
  --clr-btn-sec:    #f1f3f4;
  --radius-xs:      3px;
  --radius-s:      5px;
  --radius-m:      10px;
  --shadow:        0 2px 10px 0 rgb(0 0 0 / 15%);
  --font-main:      'Poppins', sans-serif;
}
/* ===============================
  TOP BAR
  =============================== */
nav.top-bar,
.top-bar,  
.top-bar,  
.top-bar-section ul,  
.top-bar-section ul,  
Ligne 5 : Ligne 29 :
.top-bar-section li a:not(.button),  
.top-bar-section li a:not(.button),  
.top-bar-section .has-form {
.top-bar-section .has-form {
    background-color: #fff;
  background: var(--clr-bg);
    color: #222;
  color: var(--clr-text);
}
 
.top-bar-logo {    margin-top: .3rem;}
 
/* ---- Help button style ---- */
.dico-help-modal .content {
    max-width:300px;
    padding: 1rem;
}
}


.dico-help-modal .content ul {
.top-bar-logo { margin-top: .3rem; }
    list-style: none;
    margin: 0;
}


.dico-help-modal {
.top-bar.expanded .title-area { background: var(--clr-bg); }
    position:fixed;
    bottom: 100px;
    left:20px;
}
 
.dico-help-btn {
    background: rgb(90,156,230);
    background: linear-gradient(90deg,rgba(90,156,230,1) 0%,rgba(32,109,194,1) 100%);
    border-radius: 100px;
    padding: .8rem 1rem .8rem 5rem;
    color: #fff;
    position:relative;
    width: fit-content;
}
 
.dico-help-btn-img {
background-image:url('https://fr.dicoado.org/w/images/2/24/Help-icon.png');
    display: block;
    width: 68px;
    height: 95px;
    position: absolute;
    top: -20px;
    left: 10px;
}
 
/* ---- Top bar style ---- */
.top-bar.expanded .title-area {background:#fff;}
 
.top-bar .toggle-topbar.menu-icon a {
    color: #222;
}


.top-bar .toggle-topbar.menu-icon a { color: var(--clr-text); }
.top-bar .toggle-topbar.menu-icon a span::after {
.top-bar .toggle-topbar.menu-icon a span::after {
box-shadow : 0 0 0 1px #000000, 0 7px 0 1px #000000, 0 14px 0 1px #000000;
  box-shadow: 0 0 0 1px #000, 0 7px 0 1px #000, 0 14px 0 1px #000;
}
 
#pt-notifications-alert .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read, #pt-notifications-notice .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read {
    opacity: 1;
}
 
.group {margin-top:1.5rem}
 
.mainmedia {margin-bottom:1.5rem; text-align: center;}
 
.mainmedia img {border-radius:5px;}
 
.dico-btn a,
span.dico-btn {
    padding: .8rem 1rem;
    border: 1px solid #CFD9E8;
    border-radius: 3px;
    color: #181818;
}
 
.margin-bottom-0 {
    margin-bottom:0 !important;
}
 
.pfTreeInput {
    background: #fff;
    border: 1px solid #ccc;
width: 100% !important;
border-radius : 5px;
}
 
.articlebox {
    width: 100%;
    padding: 1.5rem;
    border: 1px solid #ccc;
    border-radius: 10px;
    margin-bottom: 1.5rem;
}
 
.mediabox {margin: 0 0 1.5rem 0; width: 100%;}
 
.top-bar-section li.active:not(.has-form) a:not(.button), .top-bar-section li.active:not(.has-form) a:hover:not(.button) {
    background-color: inherit;
}
.top-bar-section li.active:not(.has-form) a:not(.button), .top-bar-section li.active:not(.has-form) a:hover:not(.button) {
    background-color: inherit;
    color: #222;
}
@media only screen and (min-width: 40.0625em) {
.top-bar-section li.active:not(.has-form) a:not(.button) {
font-size:.9rem;
line-height:3.5rem;
}
}
 
.form-bar {
  position: relative;
  padding: 9px 0 !important;
}
 
.form-bar:hover {
  background:transparent !important;
}
 
.form-bar input {
    height: auto;
    line-height: unset;
    border: 1px solid #ccc !important;
    padding-left: 30px;
    border-radius: 5px;
  background:#f1f1f1;
}
}


.form-bar input:active,.form-bar input:focus {
nav.top-bar { box-shadow: var(--shadow); }
  background:#fff;
}
 
.form-bar .button.search {
  color:transparent;
  width: 29px;
  position: absolute;
  left: 4px;
  overflow:hidden;
  background-color: transparent;
  background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguMTY2NjcgMTQuODMzM0MxMS44NDg2IDE0LjgzMzMgMTQuODMzMyAxMS44NDg2IDE0LjgzMzMgOC4xNjY2N0MxNC44MzMzIDQuNDg0NzcgMTEuODQ4NiAxLjUgOC4xNjY2NyAxLjVDNC40ODQ3NyAxLjUgMS41IDQuNDg0NzcgMS41IDguMTY2NjdDMS41IDExLjg0ODYgNC40ODQ3NyAxNC44MzMzIDguMTY2NjcgMTQuODMzM1oiIHN0cm9rZT0iIzcyNzc3RCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTE2LjUgMTYuNUwxMi44NzUgMTIuODc1IiBzdHJva2U9IiM3Mjc3N0QiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=");
    border-radius: 0;
    margin:0;
    height: 100%;
    bottom: 0;
    background-position: center;
    background-repeat: no-repeat;
}
 
nav.top-bar {
    box-shadow: 0px 2px 10px 0 rgb(0 0 0 / 15%);
}
 
a#actions-button {z-index: 1}
 
.form-panel {
padding: 1rem;
background: #F4F7FC;
border: 1px solid #CFD9E8;
border-radius: 10px;
margin-top: 2rem;
}
 
.form-panel-multiple .multipleTemplateInstance {
    padding: 1rem;
    background: #F4F7FC !important;
    border: 1px solid #CFD9E8 !important;
    border-radius: 10px;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
 
.mw-special-FormEdit footer,
.action-formedit footer {
  visibility:hidden;
}
 
.top-bar-section ul #echo-notifications li {
    margin: 0 !important;
}
 
.top-bar-section ul #echo-notifications a {
    background-color: transparent;
    overflow: hidden;
}
 
.top-bar-section .has-dropdown > a:after {
    content:unset;
}
 
.top-bar-section .has-dropdown > a {
    padding-right: 15px !important;
}


.top-bar-section .has-dropdown > a:after { content: unset; }
.top-bar-section .has-dropdown > a { padding-right: 15px !important; }
.top-bar-section > ul > .divider,
.top-bar-section > ul > .divider,
.top-bar-section > ul > [role="separator"] {
.top-bar-section > ul > [role="separator"] { border-color: #000; }
  border-color: black;
}


#navwrapper {
#navwrapper { background: var(--clr-bg); }
    background-color: #fff;
}


ul#top-bar-left li:hover,
ul#top-bar-left li:hover,
Ligne 208 : Ligne 55 :
ul#top-bar-right li:hover:not(.has-form),
ul#top-bar-right li:hover:not(.has-form),
ul#top-bar-right li a:hover {
ul#top-bar-right li a:hover {
    background-color: #3498db;
  background: var(--clr-accent);
    color: #fff;
  color: #fff;
    /* font: bold; */
}
}
ul#top-bar-right i {
ul#top-bar-right i {
    font-size: 1.1rem;
  font-size: 1.1rem;
    transform: translateY(3px);
  transform: translateY(3px);
}
}
.top-bar-section .has-dropdown > a:hover:after {
 
    border-color: #fff transparent transparent transparent;
li#echo-notifications { color: var(--clr-accent); }
 
.top-bar-section li.active:not(.has-form) a:not(.button),
.top-bar-section li.active:not(.has-form) a:hover:not(.button) {
  background: inherit;
  color: var(--clr-text);
}
}
.top-bar-section .has-dropdown > a:hover:after {
 
     border-color: #333 transparent transparent transparent;
@media only screen and (min-width: 40.0625em) {
  .top-bar-section li.active:not(.has-form) a:not(.button) {
    font-size: .9rem;
     line-height: 3.5rem;
  }
}
}
li#echo-notifications {color:#3498db;}


#catlinks {
/* ===============================
    border-style: solid none none;
  HELP BUTTON
  =============================== */
.dico-help-modal {
  position: fixed;
  bottom: 100px;
  left: 20px;
}
}
 
.dico-help-modal .content {
#catlinks .label{
  max-width: 300px;
    background-color: #008CBA;
  padding: 1rem;
}
}
 
.dico-help-modal .content ul {
.button.secondary {
  list-style: none;
    background-color: #f1f3f4;
  margin: 0;
    color: #008cba;
}
}
 
.dico-help-btn {
button.secondary:hover, button.secondary:focus, .button.secondary:hover, .button.secondary:focus  {
  background: linear-gradient(90deg, var(--clr-accent-light) 0%, var(--clr-accent-dark) 100%);
    background-color: #008cba;
  border-radius: 100px;
    color: #ffffff;
  padding: .8rem 1rem .8rem 5rem;
  color: #fff;
  position: relative;
  width: fit-content;
}
}
 
.dico-help-btn-img {
.show-for-medium-up {
  background-image: url('https://fr.dicoado.org/w/images/2/24/Help-icon.png');
    font-family: 'Poppins',sans-serif;
  display: block;
  width: 68px;
  height: 95px;
  position: absolute;
  top: -20px;
  left: 10px;
}
}


#pt-notifications-alert .mw-echo-notifications-badge, #pt-notifications-notice .mw-echo-notifications-badge {
/* ===============================
    height: 56px;
  NOTIFICATIONS BADGES
    margin: 0;
  =============================== */
    background-repeat: no-repeat;
#pt-notifications-alert .mw-echo-notifications-badge,
    background-position: center;
#pt-notifications-notice .mw-echo-notifications-badge {
    text-indent: unset;
  height: 56px;
    border-radius: 0px;
  margin: 0;
    cursor: pointer;
  background-repeat: no-repeat;
    top:0px;
  background-position: center;
    text-decoration: none;
  text-indent: unset;
    line-height: unset;
  border-radius: 0;
    -webkit-box-sizing: unset;
  cursor: pointer;
    -moz-box-sizing: unset;
  top: 0;
    box-sizing: unset;
  text-decoration: none;
  line-height: unset;
  box-sizing: unset;
}
}
@media (max-width: 639px) {
@media (max-width: 639px) {
    #pt-notifications-alert .mw-echo-notifications-badge, #pt-notifications-notice .mw-echo-notifications-badge {
  #pt-notifications-alert .mw-echo-notifications-badge,
        font-size: .8rem;
  #pt-notifications-notice .mw-echo-notifications-badge {
    }
    font-size: .8rem;
  }
}
}
#pt-notifications-notice .mw-echo-notifications-badge {
#pt-notifications-notice .mw-echo-notifications-badge {
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%3Etray%3C/title%3E%3Cpath d=%22M3 1a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V3a2 2 0 00-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z%22/%3E%3C/svg%3E");
  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%3Etray%3C/title%3E%3Cpath d=%22M3 1a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V3a2 2 0 00-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z%22/%3E%3C/svg%3E");
    color: transparent !important;
  color: transparent !important;
}
}
#pt-notifications-alert .mw-echo-notifications-badge {
#pt-notifications-alert .mw-echo-notifications-badge {
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%3Ebell%3C/title%3E%3Cpath d=%22M16 7a5.38 5.38 0 00-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 004 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 003-3H7a3 3 0 003 3z%22/%3E%3C/svg%3E");
  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%3Ebell%3C/title%3E%3Cpath d=%22M16 7a5.38 5.38 0 00-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 004 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 003-3H7a3 3 0 003 3z%22/%3E%3C/svg%3E");
    color: transparent !important;
  color: transparent !important;
}
}
#top-bar-right #echo-notifications-notice:hover #pt-notifications-notice .mw-echo-notifications-badge {
#top-bar-right #echo-notifications-notice:hover #pt-notifications-notice .mw-echo-notifications-badge {
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 fill=%22white%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Etray%3C/title%3E%3Cpath d=%22M3 1a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V3a2 2 0 00-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z%22/%3E%3C/svg%3E");
  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 fill=%22white%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Etray%3C/title%3E%3Cpath d=%22M3 1a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V3a2 2 0 00-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z%22/%3E%3C/svg%3E");
}
}
#top-bar-right #echo-notifications-alerts:hover #pt-notifications-alert .mw-echo-notifications-badge {
#top-bar-right #echo-notifications-alerts:hover #pt-notifications-alert .mw-echo-notifications-badge {
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 fill=%22white%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Ebell%3C/title%3E%3Cpath d=%22M16 7a5.38 5.38 0 00-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 004 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 003-3H7a3 3 0 003 3z%22/%3E%3C/svg%3E");
  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 fill=%22white%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Ebell%3C/title%3E%3Cpath d=%22M16 7a5.38 5.38 0 00-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 004 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 003-3H7a3 3 0 003 3z%22/%3E%3C/svg%3E");
}
}
 
#pt-notifications-alert .mw-echo-notifications-badge:focus,
#pt-notifications-alert .mw-echo-notifications-badge:focus, #pt-notifications-notice .mw-echo-notifications-badge:focus {
#pt-notifications-notice .mw-echo-notifications-badge:focus {
  -webkit-box-shadow: 0;
  box-shadow: none;
    box-shadow: none;
}
}
 
#pt-notifications-alert .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read,
/* clear fix */
#pt-notifications-notice .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read {
.grid:after {
   opacity: 1;
   content: '';
  display: block;
  clear: both;
}
}


/* ---- .grid-item ---- */
/* ===============================
 
  FORMULAIRE DE RECHERCHE
.grid-sizer,
  =============================== */
.grid-item {
.form-bar {
   width: 33.333%;
  position: relative;
   padding: 9px 0 !important;
}
}
 
.form-bar:hover { background: transparent !important; }
.grid-item {
.form-bar input {
   float: left;
   height: auto;
    padding-left: 0.9375rem;
  line-height: unset;
    padding-right: 0.9375rem;
  border: 1px solid #ccc !important;
  padding-left: 30px;
  border-radius: var(--radius-s);
  background: #f1f1f1;
}
}
 
.form-bar input:active,
.grid-item.item-img img.illustration {
.form-bar input:focus { background: var(--clr-bg); }
   display: block;
.form-bar .button.search {
   width: 100%;
   color: transparent;
   width: 29px;
  position: absolute;
  left: 4px;
  overflow: hidden;
  background-color: transparent;
  background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguMTY2NjcgMTQuODMzM0MxMS44NDg2IDE0LjgzMzMgMTQuODMzMyAxMS44NDg2IDE0LjgzMzMgOC4xNjY2N0MxNC44MzMzIDQuNDg0NzcgMTEuODQ4NiAxLjUgOC4xNjY2NyAxLjVDNC40ODQ3NyAxLjUgMS41IDQuNDg0NzcgMS41IDguMTY2NjdDMS41IDExLjg0ODYgNC40ODQ3NyAxNC44MzMzIDguMTY2NjcgMTQuODMzM1oiIHN0cm9rZT0iIzcyNzc3RCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTE2LjUgMTYuNUwxMi44NzUgMTIuODc1IiBzdHJva2U9IiM3Mjc3N0QiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=");
  border-radius: 0;
  margin: 0;
  height: 100%;
  bottom: 0;
  background-position: center;
  background-repeat: no-repeat;
}
}


@media screen and (max-width: 768px) {
/* ===============================
  /* 5 columns for larger screens */
  BOUTONS & PANELS
  .grid-item { width: 100%; }
  =============================== */
 
.dico-btn a,
.dico-help-modal {display:none;}
span.dico-btn {
 
  padding: .8rem 1rem;
.mw-special-FormEdit .dico-save-bar #wpMinoredit + label,
  border: 1px solid var(--clr-border);
.action-formedit .dico-save-bar #wpMinoredit + label {
  border-radius: var(--radius-xs);
    width: calc(100% - 55px);
  color: #181818;
    text-align: left;
    margin-bottom: 10px;
}
}
 
.button.secondary {
#pt-notifications-alert .mw-echo-notifications-badge,
  background: var(--clr-btn-sec);
#pt-notifications-notice .mw-echo-notifications-badge {
  color: var(--clr-label);
    background: 0;
    color: #222 !important;
    width: auto;
    height: auto;
}
}
 
.button.secondary:hover,
#top-bar-right #echo-notifications-alerts:hover #pt-notifications-alert .mw-echo-notifications-badge,
.button.secondary:focus {
#top-bar-right #echo-notifications-notice:hover #pt-notifications-notice .mw-echo-notifications-badge {
  background: var(--clr-label);
    background-image:none;
  color: #fff;
}
}
 
.form-panel {
#echo-notifications-alerts {
  padding: 1rem;
    float: none !important;
  background: var(--clr-panel-bg);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-m);
  margin-top: 2rem;
}
}
 
.form-panel-multiple .multipleTemplateInstance {
#pt-notifications-alert .mw-echo-notifications-badge:after, #pt-notifications-notice .mw-echo-notifications-badge:after {
  padding: 1rem;
display:none;
  background: var(--clr-panel-bg) !important;
  border: 1px solid var(--clr-border) !important;
  border-radius: var(--radius-m);
  margin: 1rem 0;
}
}
#pfForm {margin-bottom:5rem;}
}
.multipleTemplateList + p {text-align:center;}
.multipleTemplateAdder {
.multipleTemplateAdder {
    color: #345478;
  color: #345478;
    border: 1px solid #CFD9E8;
  border: 1px solid var(--clr-border);
    border-radius: 50px;
  border-radius: 50px;
    padding: 1rem 1.5rem .9rem;
  padding: 1rem 1.5rem .9rem;
    font-size: 1rem;
  font-size: 1rem;
    background:#fff;
  background: var(--clr-bg);
    cursor: pointer;
  cursor: pointer;
}
}
/* OOUI Hide */
.multipleTemplateAdder a.oo-ui-buttonElement-button {
.multipleTemplateAdder a.oo-ui-buttonElement-button {
    border: none !important;
  border: none !important;
    background: #fff !important;
  background: var(--clr-bg) !important;
}
}


@media screen and (min-width: 768px) {
/* ===============================
#pfForm .dico-save-bar input#wpSummary {
  GRILLE & MÉDIAS
max-width:250px !important;
  =============================== */
.grid:after { content: ''; display: block; clear: both; }
.grid-sizer,
.grid-item { width: 33.333%; }
.grid-item { float: left; padding-left: .9375rem; padding-right: .9375rem; }
.grid-item.item-img img.illustration { display: block; width: 100%; }
.mainmedia { margin-bottom: 1.5rem; text-align: center; }
.mainmedia img { border-radius: var(--radius-s); }
.articlebox {
  width: 100%;
  padding: 1.5rem;
  border: 1px solid #ccc;
  border-radius: var(--radius-m);
  margin-bottom: 1.5rem;
}
}
.mediabox { margin: 0 0 1.5rem 0; width: 100%; }
/* ===============================
  CHAMPS & FORMULAIRES
  =============================== */
.pfTreeInput {
  background: var(--clr-bg);
  border: 1px solid #ccc;
  width: 100% !important;
  border-radius: var(--radius-s);
}
}
.margin-bottom-0 { margin-bottom: 0 !important; }
.group { margin-top: 1.5rem; }


.mw-special-FormEdit .dico-save-bar,
.mw-special-FormEdit .dico-save-bar,
.action-formedit .dico-save-bar {
.action-formedit .dico-save-bar {
    position: fixed;
  position: fixed;
    bottom: 0;
  bottom: 0;
    background: #345478;
  background: #345478;
    left: 0;
  left: 0;
    z-index: 2;
  z-index: 2;
    right: 0;
  right: 0;
    padding: 1rem 0;
  padding: 1rem 0;
    box-shadow: 0 0 10px rgb(0 0 0 / 50%);
  box-shadow: 0 0 10px rgb(0 0 0 / 50%);
    margin:0;
  margin:0;
}
}
.mw-special-FormEdit .dico-save-bar label,
.mw-special-FormEdit .dico-save-bar label,
.mw-special-FormEdit .dico-save-bar a,
.mw-special-FormEdit .dico-save-bar a,
Ligne 395 : Ligne 289 :
.action-formedit .dico-save-bar a,
.action-formedit .dico-save-bar a,
.action-formedit .dico-save-bar .fas {
.action-formedit .dico-save-bar .fas {
    color:#fff;
  color: #fff;
}
}
.mw-special-FormEdit .dico-save-bar #wpSummary,
.mw-special-FormEdit .dico-save-bar #wpSummary,
.action-formedit .dico-save-bar #wpSummary {
.action-formedit .dico-save-bar #wpSummary {
    max-width: 300px;
  max-width: 300px;
    display: inline-block;
  display: inline-block;
    border-radius: 3px;
  border-radius: var(--radius-xs);
    margin:0;
  margin: 0;
}
}
.mw-special-FormEdit .dico-save-bar #wpMinoredit,
.mw-special-FormEdit .dico-save-bar #wpMinoredit,
.action-formedit .dico-save-bar #wpMinoredit {
.action-formedit .dico-save-bar #wpMinoredit { margin: 0; }
    margin:0;
}


@media (hover: none), (pointer: none), (pointer: coarse) {
@media screen and (min-width: 768px) {
td.instanceAddAbove, td.instanceRemove {
  #pfForm .dico-save-bar input#wpSummary { max-width: 250px !important; }
    position: absolute;
}
}
 
.oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel, .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-title {
    display: inline-block;
    padding-left: 2.3rem;
}
}


/* ---- Barre du formulaire ---- */
/* ===============================
/* Alignement des éléments de la barre */
  FORMULAIRES D'ÉDITION (ALIGNEMENT)
  =============================== */
.mw-special-FormEdit .container-fields-form,
.mw-special-FormEdit .container-fields-form,
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body,
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body,
.action-formedit .container-fields-form,
.action-formedit .container-fields-form,
.action-formedit .container-fields-form .oo-ui-fieldLayout-body {
.action-formedit .container-fields-form .oo-ui-fieldLayout-body {
    display: flex;
  display: flex;
    justify-content: space-evenly;
  justify-content: space-evenly;
    align-items: center;
  align-items: center;
}
}
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body,
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body,
.action-formedit .container-fields-form .oo-ui-fieldLayout-body {
.action-formedit .container-fields-form .oo-ui-fieldLayout-body {
    display: flex;
  display: flex;
    align-items: center;
  align-items: center;
}
}
/* Supression des expacements déformants */
.mw-special-FormEdit .container-fields-form .minorform div,
.mw-special-FormEdit .container-fields-form .minorform div,
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body span.oo-ui-fieldLayout-header,
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body span.oo-ui-fieldLayout-header,
.action-formedit .container-fields-form .minorform div,
.action-formedit .container-fields-form .minorform div,
.action-formedit .container-fields-form .oo-ui-fieldLayout-body span.oo-ui-fieldLayout-header {
.action-formedit .container-fields-form .oo-ui-fieldLayout-body span.oo-ui-fieldLayout-header {
    padding: 0 !important;
  padding: 0 !important;
}
}
.action-formedit .container-fields-form .oo-ui-layout.oo-ui-labelElement.oo-ui-fieldLayout,
.action-formedit .container-fields-form .oo-ui-layout.oo-ui-labelElement.oo-ui-fieldLayout {
.action-formedit .container-fields-form .oo-ui-layout.oo-ui-labelElement.oo-ui-fieldLayout {
    margin: 0;
  margin: 0;
}
}
/* Espace entre le résumé et son label */
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body .oo-ui-fieldLayout-header,
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body .oo-ui-fieldLayout-header,
.action-formedit .container-fields-form .oo-ui-fieldLayout-body .oo-ui-fieldLayout-header {
.action-formedit .container-fields-form .oo-ui-fieldLayout-body .oo-ui-fieldLayout-header {
    margin-right: 0.5rem;
  margin-right: .5rem;
}
}
/* Espace entre la checkbox et son label */
.mw-special-FormEdit .container-fields-form #wpMinoredit,
.mw-special-FormEdit .container-fields-form #wpMinoredit,
.action-formedit .container-fields-form #wpMinoredit {
.action-formedit .container-fields-form #wpMinoredit {
    margin-right: 13px;
  margin-right: 13px;
}
}
/* Listes à puces, notamment dans le formulaire d’édition d’un mot, section "Liens externes pertinents" */
.mw-special-FormEdit ul,
.mw-special-FormEdit ul,
.action-formedit ul {
.action-formedit ul { list-style: none; }
    list-style: none;
}
.mw-special-FormEdit ul li div.pf-checkbox-input-container,
.mw-special-FormEdit ul li div.pf-checkbox-input-container,
.action-formedit ul li div.pf-checkbox-input-container {
.action-formedit ul li div.pf-checkbox-input-container {
    display: inline-block;
  display: inline-block;
}
}


/* Responsivité */
/* ===============================
@media (max-width: 820px) {
  RESPONSIVITÉ
    /* Alignement en colonne des éléments */
  =============================== */
    .mw-special-FormEdit .container-fields-form,
@media screen and (max-width: 820px) {
    .mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body,
  .mw-special-FormEdit .container-fields-form,
    .action-formedit .container-fields-form,
  .mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body,
    .action-formedit .container-fields-form .oo-ui-fieldLayout-body {
  .action-formedit .container-fields-form,
            flex-direction: column;
  .action-formedit .container-fields-form .oo-ui-fieldLayout-body {
            align-items: flex-end;
    flex-direction: column;
    }
    align-items: flex-end;
  }
  .mw-special-FormEdit .dico-save-bar #wpMinoredit + label,
  .action-formedit .dico-save-bar #wpMinoredit + label { width: auto; }
  .oo-ui-inputWidget-input { width: 300px !important; }
}


    /* Rectification de la taille du label de la checkbox */
@media screen and (max-width: 768px) {
    .mw-special-FormEdit .dico-save-bar #wpMinoredit + label,
  .grid-item { width: 100%; }
    .action-formedit .dico-save-bar #wpMinoredit + label {
  .dico-help-modal { display: none; }
        width: auto;
  .mw-special-FormEdit .dico-save-bar #wpMinoredit + label,
     }
  .action-formedit .dico-save-bar #wpMinoredit + label {
    width: calc(100% - 55px);
    text-align: left;
    margin-bottom: 10px;
  }
  #pt-notifications-alert .mw-echo-notifications-badge,
  #pt-notifications-notice .mw-echo-notifications-badge {
    background: 0;
    color: var(--clr-text) !important;
    width: auto;
     height: auto;
  }
  #top-bar-right #echo-notifications-alerts:hover #pt-notifications-alert .mw-echo-notifications-badge,
  #top-bar-right #echo-notifications-notice:hover #pt-notifications-notice .mw-echo-notifications-badge {
    background-image: none;
  }
  #echo-notifications-alerts { float: none !important; }
  #pt-notifications-alert .mw-echo-notifications-badge:after,
  #pt-notifications-notice .mw-echo-notifications-badge:after { display: none; }
  #pfForm { margin-bottom: 5rem; }
}


    /* Agrandissement du champ de résumé */
/* ===============================
    .oo-ui-inputWidget-input {
  AUTRES
        width: 300px !important;
  =============================== */
    }
.show-for-medium-up { font-family: var(--font-main); }
#catlinks { border-style: solid none none; }
#catlinks .label { background: var(--clr-label); }
.multipleTemplateList + p { text-align: center; }
.mw-special-FormEdit footer,
.action-formedit footer { visibility: hidden; }
.oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel,
.oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-title {
  display: inline-block;
  padding-left: 2.3rem;
}
@media (hover: none), (pointer: none), (pointer: coarse) {
  td.instanceAddAbove, td.instanceRemove { position: absolute; }
}
}

Version du 8 juillet 2025 à 15:37

/* ===============================
   VARIABLES GLOBALES
   =============================== */
:root {
  --clr-bg:         #fff;
  --clr-text:       #222;
  --clr-accent:     #3498db;
  --clr-accent-dark:#206dc2;
  --clr-accent-light:#5a9ce6;
  --clr-border:     #cfd9e8;
  --clr-panel-bg:   #f4f7fc;
  --clr-label:      #008cba;
  --clr-btn-sec:    #f1f3f4;
  --radius-xs:      3px;
  --radius-s:       5px;
  --radius-m:       10px;
  --shadow:         0 2px 10px 0 rgb(0 0 0 / 15%);
  --font-main:      'Poppins', sans-serif;
}

/* ===============================
   TOP BAR
   =============================== */
nav.top-bar,
.top-bar, 
.top-bar-section ul, 
.top-bar-section ul li,
.top-bar-section ul li.active > a, 
.top-bar-section li a:not(.button), 
.top-bar-section .has-form {
  background: var(--clr-bg);
  color: var(--clr-text);
}

.top-bar-logo { margin-top: .3rem; }

.top-bar.expanded .title-area { background: var(--clr-bg); }

.top-bar .toggle-topbar.menu-icon a { color: var(--clr-text); }
.top-bar .toggle-topbar.menu-icon a span::after {
  box-shadow: 0 0 0 1px #000, 0 7px 0 1px #000, 0 14px 0 1px #000;
}

nav.top-bar { box-shadow: var(--shadow); }

.top-bar-section .has-dropdown > a:after { content: unset; }
.top-bar-section .has-dropdown > a { padding-right: 15px !important; }
.top-bar-section > ul > .divider,
.top-bar-section > ul > [role="separator"] { border-color: #000; }

#navwrapper { background: var(--clr-bg); }

ul#top-bar-left li:hover,
ul#top-bar-left li a:hover,
ul#top-bar-right li:hover:not(.has-form),
ul#top-bar-right li a:hover {
  background: var(--clr-accent);
  color: #fff;
}

ul#top-bar-right i {
  font-size: 1.1rem;
  transform: translateY(3px);
}

li#echo-notifications { color: var(--clr-accent); }

.top-bar-section li.active:not(.has-form) a:not(.button),
.top-bar-section li.active:not(.has-form) a:hover:not(.button) {
  background: inherit;
  color: var(--clr-text);
}

@media only screen and (min-width: 40.0625em) {
  .top-bar-section li.active:not(.has-form) a:not(.button) {
    font-size: .9rem;
    line-height: 3.5rem;
  }
}

/* ===============================
   HELP BUTTON
   =============================== */
.dico-help-modal {
  position: fixed;
  bottom: 100px;
  left: 20px;
}
.dico-help-modal .content {
  max-width: 300px;
  padding: 1rem;
}
.dico-help-modal .content ul {
  list-style: none;
  margin: 0;
}
.dico-help-btn {
  background: linear-gradient(90deg, var(--clr-accent-light) 0%, var(--clr-accent-dark) 100%);
  border-radius: 100px;
  padding: .8rem 1rem .8rem 5rem;
  color: #fff;
  position: relative;
  width: fit-content;
}
.dico-help-btn-img {
  background-image: url('https://fr.dicoado.org/w/images/2/24/Help-icon.png');
  display: block;
  width: 68px;
  height: 95px;
  position: absolute;
  top: -20px;
  left: 10px;
}

/* ===============================
   NOTIFICATIONS BADGES
   =============================== */
#pt-notifications-alert .mw-echo-notifications-badge,
#pt-notifications-notice .mw-echo-notifications-badge {
  height: 56px;
  margin: 0;
  background-repeat: no-repeat;
  background-position: center;
  text-indent: unset;
  border-radius: 0;
  cursor: pointer;
  top: 0;
  text-decoration: none;
  line-height: unset;
  box-sizing: unset;
}
@media (max-width: 639px) {
  #pt-notifications-alert .mw-echo-notifications-badge,
  #pt-notifications-notice .mw-echo-notifications-badge {
    font-size: .8rem;
  }
}
#pt-notifications-notice .mw-echo-notifications-badge {
  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%3Etray%3C/title%3E%3Cpath d=%22M3 1a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V3a2 2 0 00-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z%22/%3E%3C/svg%3E");
  color: transparent !important;
}
#pt-notifications-alert .mw-echo-notifications-badge {
  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%3Ebell%3C/title%3E%3Cpath d=%22M16 7a5.38 5.38 0 00-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 004 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 003-3H7a3 3 0 003 3z%22/%3E%3C/svg%3E");
  color: transparent !important;
}
#top-bar-right #echo-notifications-notice:hover #pt-notifications-notice .mw-echo-notifications-badge {
  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 fill=%22white%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Etray%3C/title%3E%3Cpath d=%22M3 1a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V3a2 2 0 00-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z%22/%3E%3C/svg%3E");
}
#top-bar-right #echo-notifications-alerts:hover #pt-notifications-alert .mw-echo-notifications-badge {
  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 fill=%22white%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Ebell%3C/title%3E%3Cpath d=%22M16 7a5.38 5.38 0 00-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 004 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 003-3H7a3 3 0 003 3z%22/%3E%3C/svg%3E");
}
#pt-notifications-alert .mw-echo-notifications-badge:focus,
#pt-notifications-notice .mw-echo-notifications-badge:focus {
  box-shadow: none;
}
#pt-notifications-alert .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read,
#pt-notifications-notice .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read {
  opacity: 1;
}

/* ===============================
   FORMULAIRE DE RECHERCHE
   =============================== */
.form-bar {
  position: relative;
  padding: 9px 0 !important;
}
.form-bar:hover { background: transparent !important; }
.form-bar input {
  height: auto;
  line-height: unset;
  border: 1px solid #ccc !important;
  padding-left: 30px;
  border-radius: var(--radius-s);
  background: #f1f1f1;
}
.form-bar input:active,
.form-bar input:focus { background: var(--clr-bg); }
.form-bar .button.search {
  color: transparent;
  width: 29px;
  position: absolute;
  left: 4px;
  overflow: hidden;
  background-color: transparent;
  background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguMTY2NjcgMTQuODMzM0MxMS44NDg2IDE0LjgzMzMgMTQuODMzMyAxMS44NDg2IDE0LjgzMzMgOC4xNjY2N0MxNC44MzMzIDQuNDg0NzcgMTEuODQ4NiAxLjUgOC4xNjY2NyAxLjVDNC40ODQ3NyAxLjUgMS41IDQuNDg0NzcgMS41IDguMTY2NjdDMS41IDExLjg0ODYgNC40ODQ3NyAxNC44MzMzIDguMTY2NjcgMTQuODMzM1oiIHN0cm9rZT0iIzcyNzc3RCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTE2LjUgMTYuNUwxMi44NzUgMTIuODc1IiBzdHJva2U9IiM3Mjc3N0QiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=");
  border-radius: 0;
  margin: 0;
  height: 100%;
  bottom: 0;
  background-position: center;
  background-repeat: no-repeat;
}

/* ===============================
   BOUTONS & PANELS
   =============================== */
.dico-btn a,
span.dico-btn {
  padding: .8rem 1rem;
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-xs);
  color: #181818;
}
.button.secondary {
  background: var(--clr-btn-sec);
  color: var(--clr-label);
}
.button.secondary:hover,
.button.secondary:focus {
  background: var(--clr-label);
  color: #fff;
}
.form-panel {
  padding: 1rem;
  background: var(--clr-panel-bg);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-m);
  margin-top: 2rem;
}
.form-panel-multiple .multipleTemplateInstance {
  padding: 1rem;
  background: var(--clr-panel-bg) !important;
  border: 1px solid var(--clr-border) !important;
  border-radius: var(--radius-m);
  margin: 1rem 0;
}
.multipleTemplateAdder {
  color: #345478;
  border: 1px solid var(--clr-border);
  border-radius: 50px;
  padding: 1rem 1.5rem .9rem;
  font-size: 1rem;
  background: var(--clr-bg);
  cursor: pointer;
}
.multipleTemplateAdder a.oo-ui-buttonElement-button {
  border: none !important;
  background: var(--clr-bg) !important;
}

/* ===============================
   GRILLE & MÉDIAS
   =============================== */
.grid:after { content: ''; display: block; clear: both; }
.grid-sizer,
.grid-item { width: 33.333%; }
.grid-item { float: left; padding-left: .9375rem; padding-right: .9375rem; }
.grid-item.item-img img.illustration { display: block; width: 100%; }
.mainmedia { margin-bottom: 1.5rem; text-align: center; }
.mainmedia img { border-radius: var(--radius-s); }
.articlebox {
  width: 100%;
  padding: 1.5rem;
  border: 1px solid #ccc;
  border-radius: var(--radius-m);
  margin-bottom: 1.5rem;
}
.mediabox { margin: 0 0 1.5rem 0; width: 100%; }

/* ===============================
   CHAMPS & FORMULAIRES
   =============================== */
.pfTreeInput {
  background: var(--clr-bg);
  border: 1px solid #ccc;
  width: 100% !important;
  border-radius: var(--radius-s);
}
.margin-bottom-0 { margin-bottom: 0 !important; }
.group { margin-top: 1.5rem; }

.mw-special-FormEdit .dico-save-bar,
.action-formedit .dico-save-bar {
  position: fixed;
  bottom: 0;
  background: #345478;
  left: 0;
  z-index: 2;
  right: 0;
  padding: 1rem 0;
  box-shadow: 0 0 10px rgb(0 0 0 / 50%);
  margin:0;
}
.mw-special-FormEdit .dico-save-bar label,
.mw-special-FormEdit .dico-save-bar a,
.mw-special-FormEdit .dico-save-bar .fas,
.action-formedit .dico-save-bar label,
.action-formedit .dico-save-bar a,
.action-formedit .dico-save-bar .fas {
  color: #fff;
}
.mw-special-FormEdit .dico-save-bar #wpSummary,
.action-formedit .dico-save-bar #wpSummary {
  max-width: 300px;
  display: inline-block;
  border-radius: var(--radius-xs);
  margin: 0;
}
.mw-special-FormEdit .dico-save-bar #wpMinoredit,
.action-formedit .dico-save-bar #wpMinoredit { margin: 0; }

@media screen and (min-width: 768px) {
  #pfForm .dico-save-bar input#wpSummary { max-width: 250px !important; }
}

/* ===============================
   FORMULAIRES D'ÉDITION (ALIGNEMENT)
   =============================== */
.mw-special-FormEdit .container-fields-form,
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body,
.action-formedit .container-fields-form,
.action-formedit .container-fields-form .oo-ui-fieldLayout-body {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body,
.action-formedit .container-fields-form .oo-ui-fieldLayout-body {
  display: flex;
  align-items: center;
}
.mw-special-FormEdit .container-fields-form .minorform div,
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body span.oo-ui-fieldLayout-header,
.action-formedit .container-fields-form .minorform div,
.action-formedit .container-fields-form .oo-ui-fieldLayout-body span.oo-ui-fieldLayout-header {
  padding: 0 !important;
}
.action-formedit .container-fields-form .oo-ui-layout.oo-ui-labelElement.oo-ui-fieldLayout {
  margin: 0;
}
.mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body .oo-ui-fieldLayout-header,
.action-formedit .container-fields-form .oo-ui-fieldLayout-body .oo-ui-fieldLayout-header {
  margin-right: .5rem;
}
.mw-special-FormEdit .container-fields-form #wpMinoredit,
.action-formedit .container-fields-form #wpMinoredit {
  margin-right: 13px;
}
.mw-special-FormEdit ul,
.action-formedit ul { list-style: none; }
.mw-special-FormEdit ul li div.pf-checkbox-input-container,
.action-formedit ul li div.pf-checkbox-input-container {
  display: inline-block;
}

/* ===============================
   RESPONSIVITÉ
   =============================== */
@media screen and (max-width: 820px) {
  .mw-special-FormEdit .container-fields-form,
  .mw-special-FormEdit .container-fields-form .oo-ui-fieldLayout-body,
  .action-formedit .container-fields-form,
  .action-formedit .container-fields-form .oo-ui-fieldLayout-body {
    flex-direction: column;
    align-items: flex-end;
  }
  .mw-special-FormEdit .dico-save-bar #wpMinoredit + label,
  .action-formedit .dico-save-bar #wpMinoredit + label { width: auto; }
  .oo-ui-inputWidget-input { width: 300px !important; }
}

@media screen and (max-width: 768px) {
  .grid-item { width: 100%; }
  .dico-help-modal { display: none; }
  .mw-special-FormEdit .dico-save-bar #wpMinoredit + label,
  .action-formedit .dico-save-bar #wpMinoredit + label {
    width: calc(100% - 55px);
    text-align: left;
    margin-bottom: 10px;
  }
  #pt-notifications-alert .mw-echo-notifications-badge,
  #pt-notifications-notice .mw-echo-notifications-badge {
    background: 0;
    color: var(--clr-text) !important;
    width: auto;
    height: auto;
  }
  #top-bar-right #echo-notifications-alerts:hover #pt-notifications-alert .mw-echo-notifications-badge,
  #top-bar-right #echo-notifications-notice:hover #pt-notifications-notice .mw-echo-notifications-badge {
    background-image: none;
  }
  #echo-notifications-alerts { float: none !important; }
  #pt-notifications-alert .mw-echo-notifications-badge:after,
  #pt-notifications-notice .mw-echo-notifications-badge:after { display: none; }
  #pfForm { margin-bottom: 5rem; }
}

/* ===============================
   AUTRES
   =============================== */
.show-for-medium-up { font-family: var(--font-main); }
#catlinks { border-style: solid none none; }
#catlinks .label { background: var(--clr-label); }
.multipleTemplateList + p { text-align: center; }
.mw-special-FormEdit footer,
.action-formedit footer { visibility: hidden; }
.oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel,
.oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-title {
  display: inline-block;
  padding-left: 2.3rem;
}
@media (hover: none), (pointer: none), (pointer: coarse) {
  td.instanceAddAbove, td.instanceRemove { position: absolute; }
}