MediaWiki:Common.css: Difference between revisions

mNo edit summary
updated boxes
Line 1: Line 1:
/* SiteWide css */
/* SiteWide css */
/*
  Hey ! My variables are from CODEX !
  Here is their docs : https://doc.wikimedia.org/codex/latest/
*/


/* ------------------ */
/* ------------------ */
Line 9: Line 14:
   padding: 0.75em 1em;
   padding: 0.75em 1em;
   margin: 1em 0;
   margin: 1em 0;
   border: 1px solid var(--border-color-base);
   border: 2px solid rgba(from var(--border-color-base) r g b / 0.5);
   border-left: 4px solid var(--border-color-base);
   border-radius: 2px;
   background-color: var(--background-color-neutral-subtle);
   background-color: var(--background-color-neutral-subtle);
   color: var(--color-base);
   color: var(--color-base);


   &.info {
   &.info {
     border-left-color: var(--color-progressive);
    background-color: var(--background-color-progressive-subtle);
     border-color: var(--color-progressive);
    color: var(--color-progressive);
   }
   }


   &.success {
   &.success {
     border-left-color: var(--color-success);
    background-color: var(--background-color-success-subtle);
     border-color: var(--color-success);
    color: var(--color-success);
   }
   }


    
    
   &.warning {
   &.warning {
     border-left-color: var(--color-warning);
    background-color: var(--background-color-warning-subtle);
     border-color: var(--color-warning);
    color: var(--color-warning);
   }
   }


   &.danger {
   &.danger {
     border-left-color: var(--color-destructive);
    background-color: var(--background-color-destructive-subtle);
     border-color: var(--color-destructive);
    color: var(--color-destructive);
   }
   }


   /* Status */
   /* Status */
   &.under-construction {
   &.under-construction {
     border-left-color: var(--color-warning);
    background-color: var(--background-color-warning-subtle);
     border-color: var(--color-warning);
    color: var(--color-warning);
   }
   }


   &.stub {
   &.stub {
     border-left-color: var(--color-progressive);
    background-color: var(--background-color-progressive-subtle);
     border-color: var(--color-progressive);
    color: var(--color-progressive);
   }
   }


   &.outdated {
   &.outdated {
     border-left-color: var(--color-warning);
    background-color: var(--background-color-warning-subtle);
     border-color: var(--color-warning);
    color: var(--color-warning);
   }
   }


   &.disputed {
   &.disputed {
     border-left-color: var(--color-destructive);
    background-color: var(--background-color-destructive-subtle);
     border-color: var(--color-destructive);
    color: var(--color-destructive);
   }
   }


   &.cleanup {
   &.cleanup {
     border-left-color: var(--color-warning);
    background-color: var(--background-color-warning-subtle);
     border-color: var(--color-warning);
    color: var(--color-warning);
   }
   }
}
}