MediaWiki:Common.scss

$color-black: #000000;

$color-documentation: #ecfcf4; $color-separator: #a2a9b1; $color-border-grey: #aaaaaa;

$colors-information-box: (

   light-yellow: #ffeda6,
   light-blue: #9fd6f2,
   light-green: #ddffdd,

); $colors-ajah-background: (

   blue: #0e427c,
   red: #6b0632,
   white: #c1c6c0,
   green: #62704f,
   brown: #322014,
   yellow: #916621,
   grey: #4d4d43,

); $colors-ajah-foreground: (

   blue: inherit,
   red: inherit,
   white: inherit,
   green: #ffffff,
   brown: #ffffff,
   yellow: inherit,
   grey: #ffffff,

);

/* == Outils == */ .clearfix {

 clear: both;

}

/* == Citations == */ .mw-body-content blockquote {

 margin-left: 0;
 margin-right: 0;
 padding: 8px 16px;

}

/* == Documentation de modèle == */ .mw-documentation {

 padding: 1em 1em 0.8em;
 background: $color-documentation;
 border: 1px solid $color-border-grey;

}

.mw-documentation p:first-child {

 margin-top: 0;

}

.mw-documentation-footer {

 margin-top: 1.5em;
 padding-top: 0.5em;
 border-top: 1px solid $color-separator;

}

/* == Navigation == */ .mw-navigation {

 clear: both;
 width: 100%;
 margin-top: 1em;
 background: #fdfdfd;
 border: 1px solid $color-border-grey;
 font-size: 0.75rem;

}

.mw-navigation .mw-title {

 padding-left: 1em;
 padding-right: 1em;
 background: #a7d7f9;
 font-size: 0.85rem;

}

.mw-navigation tr th:not(.mw-title) {

 width: 150px;
 padding-left: 1em;
 padding-right: 1em;
 background: #eaf3ff;
 vertical-align: middle;

}

.mw-navigation tr:nth-child(2n) td {

 background: #f6f6f6;

}

.mw-navigation tr:nth-child(2n + 1) td {

 background: #eaecf0;

}

.mw-navigation .mw-navigation {

 width: calc(100% + 6px);
 margin: -3px;
 background: transparent;
 border: none;

}

.mw-navigation .mw-navigation tr:nth-child(2n + 1) td {

 background: none;

}

.mw-navigation + .mw-navigation {

 margin-top: 0.5em;

}

/* == Boîtes d'informations == */ .mw-information-box {

 float: right;
 box-sizing: border-box;
 clear: right;
 min-width: 200px;
 max-width: 300px;
 margin: 0 0 0.5em 1em;
 padding: 5px;
 background: #f9f9f9;
 border: 1px solid #aaaaaa;
 color: #000000;
 font-size: 0.9em;

}

.mw-information-box .mw-title {

 box-sizing: border-box;
 margin: 0;
 padding: 0.25em 1em;
 background: #cccccc;
 font-size: 1.25em;
 font-weight: bold;
 line-height: 1.5em;
 text-align: center;

}

.mw-information-box .mw-sub-title {

 text-align: center;

}

.mw-information-box .image img {

 max-width: 100%;
 height: auto;

}

.mw-information-box .mw-caption {

 font-size: 80%;
 text-align: center;

}

.mw-information-box table {

 width: 100%;

}

.mw-information-box th:not(.mw-section-title), .mw-information-box td {

 vertical-align: top;

}

.mw-information-box th:not(.mw-section-title) {

 text-align: left;

}

.mw-information-box .mw-section-title {

 padding: 0.25em 1em;
 font-weight: bold;
 text-align: center; 
 background: #cccccc;

}

/* Déclinaisons de couleur */ @each $name, $color in $colors-information-box {

 .mw-information-box.#{$name} .mw-title,
 .mw-information-box.#{$name} .mw-section-title {
   background: $color;
 }

}

/* Déclinaisons d'ajah */ @each $name, $color in $colors-ajah-background {

 .mw-information-box.#{$name}-ajah .mw-title,
 .mw-information-box.#{$name}-ajah .mw-section-title {
   background: $color;
   color: map-get($colors-ajah-foreground, $name);
 }

 .mw-information-box.#{$name}-black-ajah .mw-title,
 .mw-information-box.#{$name}-black-ajah .mw-section-title {
   background: linear-gradient(to right, $color 0%, $color 75%, $color-black 90%);
   color: map-get($colors-ajah-foreground, $name);
   text-shadow: -1px -1px 0 $color, 1px -1px 0 $color, -1px 1px 0 $color, 1px 1px 0 $color;
 }

}

/* == Arbres généalogiques == */ .family-tree {

 max-height: 400px;
 overflow-y: auto;

}