« MediaWiki:Common.css » : différence entre les versions
Apparence
Aucun résumé des modifications |
Aucun résumé des modifications |
||
| (31 versions intermédiaires par 2 utilisateurs non affichées) | |||
| Ligne 1 : | Ligne 1 : | ||
/* Le CSS placé ici sera appliqué à tous les habillages. */ | /* Le CSS placé ici sera appliqué à tous les habillages. */ | ||
/* --- Design du Bandeau d'Attribution Moderne --- */ | |||
.cadre-attribution { | |||
display: flex; | |||
align-items: center; | |||
margin: 1.5em 0; | |||
padding: 12px 16px; | |||
border-radius: 8px; | |||
/* Utilisation des variables système pour l'adaptation auto */ | |||
background-color: var(--background-color-interactive-subtle, #f8f9fa); | |||
color: var(--color-base, #202122); | |||
border: 1px solid var(--border-color-subtle, #a2a9b1); | |||
/* Une petite ombre subtile pour le relief */ | |||
box-shadow: 0 2px 5px rgba(0,0,0,0.05); | |||
/* La barre d'accentuation sur le côté */ | |||
border-left: 6px solid #f6c342; | |||
} | |||
.cadre-attribution-icone { | |||
font-size: 1.8em; | |||
margin-right: 15px; | |||
/* Empêche l'icône de rétrécir si le texte est long */ | |||
flex-shrink: 0; | |||
} | |||
.cadre-attribution-contenu { | |||
flex-grow: 1; | |||
font-size: 0.95em; | |||
line-height: 1.5; | |||
} | |||
/* On s'assure que les liens restent contrastés */ | |||
.cadre-attribution-contenu a { | |||
color: var(--color-primary, #3366cc); | |||
font-weight: bold; | |||
} | |||
/* Style pour le boîtier de documentation */ | /* Style pour le boîtier de documentation */ | ||
@font-face { | |||
font-family: 'EB Garamond'; | |||
src: url('/images/fonts/EBGaramond-Regular.otf') format('opentype'); | |||
font-weight: 400; | |||
} | |||
@font-face { | |||
font-family: 'EB Garamond'; | |||
src: url('/images/fonts/EBGaramond-Bold.otf') format('opentype'); | |||
font-weight: 700; | |||
} | |||
.template-documentation { | .template-documentation { | ||
background-color: #f8f9fa; | background-color: #f8f9fa; | ||
| Ligne 7 : | Ligne 59 : | ||
margin-top: 1em; | margin-top: 1em; | ||
clear: both; | clear: both; | ||
border-left: 5px solid #3366cc; | border-left: 5px solid #3366cc; | ||
} | } | ||
| Ligne 18 : | Ligne 70 : | ||
} | } | ||
.bandeau-ebauche { | .bandeau-ebauche { | ||
margin: 10px 0; | margin: 10px 0; | ||
| Ligne 40 : | Ligne 91 : | ||
} | } | ||
.userbox { | .userbox { | ||
border: 1px solid #AAAAAA; | border: 1px solid #AAAAAA; | ||
margin: 4px; | margin: 4px; | ||
float: left; | float: left; | ||
width: | width: 238px; | ||
height: | height: 45px; | ||
background: #FFFFFF; | background: #FFFFFF; | ||
display: | display: table !important; | ||
border-collapse: collapse; | |||
font-family: sans-serif; | |||
font-family: | |||
} | } | ||
.userbox-id { | .userbox-id { | ||
display: table-cell !important; | |||
width: 45px; | |||
height: | height: 45px; | ||
background: #CCCCCC; | |||
align | text-align: center; | ||
vertical-align: middle; | |||
font-size: | font-size: 20px; | ||
} | } | ||
.userbox-info { | .userbox-info { | ||
display: table-cell !important; | |||
padding: 0 8px; | |||
font-size: 0.85em; | |||
line-height: 1.2em; | |||
vertical-align: middle; | |||
text-align: left; | |||
} | |||
body .userbox-info { | |||
display: table-cell; | |||
vertical-align: middle; | |||
padding: 0 10px; | padding: 0 10px; | ||
font-size: 0. | font-size: 0.85em; | ||
line-height: 1. | line-height: 1.2; | ||
text-align: left; | |||
font-family: inherit; | font-family: inherit; | ||
} | } | ||
body .userbox-info p { | |||
margin: 0; | |||
padding: 0; | |||
line-height: 1.2; | |||
display: inline; | |||
} | |||
.userbox-info p { | .userbox-info p { | ||
margin: 0 !important; | margin: 0 !important; | ||
padding: 0 !important; | padding: 0 !important; | ||
display: inline; | display: inline !important; | ||
} | } | ||
.userbox-column { | .userbox-column { | ||
float: right; | float: right; | ||
clear: right; | clear: right; | ||
width: 250px; | width: 250px; | ||
margin-left: 1em; | margin-left: 1em; | ||
margin-bottom: 1em; | margin-bottom: 1em; | ||
| Ligne 94 : | Ligne 154 : | ||
} | } | ||
.userbox-column .userbox { | .userbox-column .userbox { | ||
float: none; | float: none; | ||
display: flex; | display: flex; | ||
margin-bottom: 5px; | margin-bottom: 5px; | ||
} | |||
.userbox-info, .userbox-id { | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
} | |||
.userbox-info { | |||
display: block; | |||
line-height: 45px; | |||
text-align: left; | |||
vertical-align: middle; | |||
} | |||
.userbox-info p, .userbox-info span { | |||
margin: 0; | |||
padding: 0; | |||
display: inline; | |||
} | |||
.mw-logo { | |||
height: 50px !important; | |||
position: relative !important; | |||
overflow: visible !important; | |||
} | |||
.mw-logo-icon { | |||
position: absolute !important; | |||
width: 65px !important; | |||
height: 65px !important; | |||
top: -5px !important; | |||
left: 0 !important; | |||
} | |||
.mw-logo-wordmark { | |||
font-family: 'EB Garamond', serif !important; | |||
font-size: 1.4em !important; | |||
font-weight: 400 !important; | |||
color: var(--color-base) !important; | |||
white-space: nowrap !important; | |||
margin-left: 70px !important; | |||
margin-top: 15px !important; | |||
line-height: normal !important; | |||
display: block !important; | |||
} | } | ||
Dernière version du 30 avril 2026 à 17:06
/* Le CSS placé ici sera appliqué à tous les habillages. */
/* --- Design du Bandeau d'Attribution Moderne --- */
.cadre-attribution {
display: flex;
align-items: center;
margin: 1.5em 0;
padding: 12px 16px;
border-radius: 8px;
/* Utilisation des variables système pour l'adaptation auto */
background-color: var(--background-color-interactive-subtle, #f8f9fa);
color: var(--color-base, #202122);
border: 1px solid var(--border-color-subtle, #a2a9b1);
/* Une petite ombre subtile pour le relief */
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
/* La barre d'accentuation sur le côté */
border-left: 6px solid #f6c342;
}
.cadre-attribution-icone {
font-size: 1.8em;
margin-right: 15px;
/* Empêche l'icône de rétrécir si le texte est long */
flex-shrink: 0;
}
.cadre-attribution-contenu {
flex-grow: 1;
font-size: 0.95em;
line-height: 1.5;
}
/* On s'assure que les liens restent contrastés */
.cadre-attribution-contenu a {
color: var(--color-primary, #3366cc);
font-weight: bold;
}
/* Style pour le boîtier de documentation */
@font-face {
font-family: 'EB Garamond';
src: url('/images/fonts/EBGaramond-Regular.otf') format('opentype');
font-weight: 400;
}
@font-face {
font-family: 'EB Garamond';
src: url('/images/fonts/EBGaramond-Bold.otf') format('opentype');
font-weight: 700;
}
.template-documentation {
background-color: #f8f9fa;
border: 1px solid #a2a9b1;
padding: 1em;
margin-top: 1em;
clear: both;
border-left: 5px solid #3366cc;
}
.template-documentation-header {
font-weight: bold;
margin-bottom: 0.5em;
font-size: 1.1em;
display: flex;
justify-content: space-between;
}
.bandeau-ebauche {
margin: 10px 0;
padding: 10px 15px;
background-color: var(--background-color-neutral-subtle);
border: 1px solid var(--border-color-base);
border-left: 10px solid #3366cc;
display: flex;
align-items: center;
border-radius: 4px;
}
.bandeau-ebauche-icone {
font-size: 24px;
margin-right: 15px;
}
.bandeau-ebauche-texte {
font-size: 0.9em;
line-height: 1;
font-family: inherit;
color: var(--color-base);
}
.userbox {
border: 1px solid #AAAAAA;
margin: 4px;
float: left;
width: 238px;
height: 45px;
background: #FFFFFF;
display: table !important;
border-collapse: collapse;
font-family: sans-serif;
}
.userbox-id {
display: table-cell !important;
width: 45px;
height: 45px;
background: #CCCCCC;
text-align: center;
vertical-align: middle;
font-size: 20px;
}
.userbox-info {
display: table-cell !important;
padding: 0 8px;
font-size: 0.85em;
line-height: 1.2em;
vertical-align: middle;
text-align: left;
}
body .userbox-info {
display: table-cell;
vertical-align: middle;
padding: 0 10px;
font-size: 0.85em;
line-height: 1.2;
text-align: left;
font-family: inherit;
}
body .userbox-info p {
margin: 0;
padding: 0;
line-height: 1.2;
display: inline;
}
.userbox-info p {
margin: 0 !important;
padding: 0 !important;
display: inline !important;
}
.userbox-column {
float: right;
clear: right;
width: 250px;
margin-left: 1em;
margin-bottom: 1em;
background: transparent;
}
.userbox-column .userbox {
float: none;
display: flex;
margin-bottom: 5px;
}
.userbox-info, .userbox-id {
display: flex;
align-items: center;
justify-content: center;
}
.userbox-info {
display: block;
line-height: 45px;
text-align: left;
vertical-align: middle;
}
.userbox-info p, .userbox-info span {
margin: 0;
padding: 0;
display: inline;
}
.mw-logo {
height: 50px !important;
position: relative !important;
overflow: visible !important;
}
.mw-logo-icon {
position: absolute !important;
width: 65px !important;
height: 65px !important;
top: -5px !important;
left: 0 !important;
}
.mw-logo-wordmark {
font-family: 'EB Garamond', serif !important;
font-size: 1.4em !important;
font-weight: 400 !important;
color: var(--color-base) !important;
white-space: nowrap !important;
margin-left: 70px !important;
margin-top: 15px !important;
line-height: normal !important;
display: block !important;
}