« MediaWiki:Common.css » : différence entre les versions

Version du 7 septembre 2025 à 16:00

 /* Le CSS placé ici sera appliqué à tous les habillages. */

.mw-widget-dateInputWidget-calendar {position: inherit!important;}

.selflink {color: #468847;}

.keyboard-key, .kbd {color:#0a7cc8; text-decoration: none;}

.coord {
    font-size: 12px;
    font-family: Consolas,"Liberation Mono",Courier,monospace;
    margin: 0 2px;
    padding: 3px 5px;
    white-space: nowrap;
    border: 1px solid #EAEAEA;
    background-color:#D7EFEE!important;
   color:#468781!important;
}


code .red {
    color: #c7254e!important;
    background-color: #f9f2f4!important;
}


.coord a {
    background-color:#D7EFEE!important;
   color:#468781!important;
}

/* Modèles
----------------------------------- */


#ouvrage {
width:70%;
font-style: italic;
margin: 0.25em 0;
padding: 0.25em 40px;
line-height: 1.45;
position: relative;
color: #31708F;
text-align:justify; 
text-justify: auto;
}

#ouvrage p {
font-size:1.1em;
}

#ouvrage h2 {
border-bottom: none!important;
color:#1B3E57;
margin-bottom:0.3em!important;
}

 #ouvrage cite {
color: #999999;
font-size: 14px;
display: block;
margin-top: 5px;
}
 
 #ouvrage cite:before {
content: "\2014 \2009";
}

#citation {
width:70%;
font-style: italic;
margin: 0.25em 0;
padding: 0.25em 40px;
line-height: 1.45;
position: relative;
color: #31708F;
text-align:justify; 
text-justify: auto;
}

#citation p {
font-size:1.1em;
}

#citation h2 {
border-bottom: none!important;
color:#1B3E57;
margin-bottom:0.3em!important;
}

 #citation cite {
color: #999999;
font-size: 14px;
display: block;
margin-top: 5px;
}
 
 #citation cite:before {
content: "\2014 \2009";
}


#purge {
float:right;
}

table.right {
float: right !important;
clear: right !important;
width: 300px !important;
}
 
/* Infobox
--------------------- */
 
.infobox {
background: #EEE; /* couleur correspondant aux titres / colonne de gauche, th */
color: #000;
float: right;
clear: right;
font-size: 95%;
border-collapse: collapse;
margin: 0 0 .5em 1em;
width: 250px;
}
 
/* monobookocentré debut*/
 
.infobox caption {
background: #C0C0C0;
border-left: 1px solid #AAA;
border-top: 1px solid #AAA;
border-right: 1px solid #AAA;
padding: .2em;
margin-left: .57em;
font-weight: bolder;
text-align: center;
color: #FFF;
font-size: 160%;
}
 
.infobox th,
.infobox td {
vertical-align: middle;
border: 1px solid #AAA;
padding: .2em .2em .2em .5em;
}
 
.infobox td {
text-align: center;
background: #F9F9F9;
}
 
.infobox th {
font-weight: normal;
text-align: left;
}
 
.infobox .infoboximage {
/* emplacement pour les photos et une description */
background: #FFF;
padding: 0;
margin-top: 0;
color: #000;
text-align: center;
}
 
.infobox .infoboxsoustitre {
/* sous-titre */
color: #000;
font-weight: bold;
font-size: 115%;
line-height: 2;
text-align: center;
}
 
.infobox dl {
clear: both
}
 
.infobox dt {
float: left;
clear: left;
width: 35%;
}
 
.infobox dd {
margin-left: 40%
}
 
/* Infobox v2
--------------------- */
 
.infobox_v2 {
/* monobookocentré debut */
background: #f9f9f9;
color: #000;
font-size: 90%;
line-height: 1.1em;
float: right!important;
clear: right!important;

/* haut droite bas gauche */
margin: 0 0 .5em 1em!important;
width: 300px!important;
 -webkit-border-radius: 0.3em;
-moz-border-radius: 0.3em;
border-radius: 0.3em;
border: 1px solid #CCC;
box-shadow: 0 0.3em 0.6em rgba(0, 0, 0, 0.1);
padding: 0.1em!important;
}
 
.infobox_v2 th {
vertical-align: super;
text-align: left;
}
 
.infobox_v2 .entete {
height: 45px;
vertical-align: middle;
text-align: center;
font-size: 150%;
font-weight: bolder;
line-height: 1.2em;
color: #000;
}
 
.infobox_v2 .media {
/* css V2 pour [[Modèle: Son]], etc. */;
height: 35px;
vertical-align: middle;
text-align: center;
font-weight: bolder;
color: #000;
}
 
 
/* ENTETES INFOBOXES
--------------------------------------------*/
 
.entete.construction {
background: #03576C url('//nefald.fr/wiki/images/e/ea/entete_construction.png') no-repeat top right;
width:100%;
height:60px;
}
 
 
.entete.plugin {
background: #FDB600 url('//nefald.fr/wiki/images/6/67/entete_plugin.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.joueur {
background: #0072B1 url('//nefald.fr/wiki/images/5/56/entete_joueur.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.personnage {
background: #0072B1 url('//nefald.fr/wiki/images/f/f4/entete_personnage.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.grade {
background: #FF3400 url('//nefald.fr/wiki/images/2/2b/entete_grade.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.guilde {
background: #FF2D07 url('//nefald.fr/wiki/images/2/2f/entete_guilde.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.ville {
background: #026B84 url('//nefald.fr/wiki/images/3/3e/entete_ville.png') no-repeat top right;
width:100%;
height:60px;
}
 
 
.entete.monde {
background:#82C300 url('//nefald.fr/wiki/images/7/71/entete_monde.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.logiciel {
background: #963DC7 url('//nefald.fr/wiki/images/e/e2/entete_logiciel.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.mod {
background: #FFD644 url('//nefald.fr/wiki/images/0/0d/entete_mod.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.territoire {
background: #578103 url('//nefald.fr/wiki/images/6/60/entete_territoire.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.application.mobile {
background: #A4C639 url('//nefald.fr/wiki/images/1/16/entete_application_mobile.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.schematic {
background: #596DDB url('//nefald.fr/wiki/images/f/f5/entete_schematic.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.roleplay {
background: #1E5C97 url('//nefald.fr/wiki/images/f/fe/entete_roleplay.png') no-repeat top right;
width:100%;
height:60px;
}
 
 
.entete.tutoriel {
background: #488BDD url('//nefald.fr/wiki/images/e/e5/entete_tutoriel.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.metier {
background: #7BAFFF url('//nefald.fr/wiki/images/e/e4/entete_metier.png') no-repeat top right;
width:100%;
height:60px;
}
 
.entete.divinite {
background: #012946 url('//nefald.fr/wiki/images/4/45/entete_divinite.png') no-repeat top right;
width:100%;
height:60px;
}

.entete.ordre {
background: #012946 url('//nefald.fr/wiki/images/f/f9/entete_ordre.png') no-repeat top right;
width:100%;
height:60px;
}

.entete.script {
background: #FFAC1A url('//nefald.fr/wiki/images/f/f0/entete_script.png') no-repeat top right;
width:100%;
height:60px;
}
 
h2 {
font-family: 'Helvetica', Arial, sans-serif;
font-size: 1.8em;
font-weight: bold;
margin: 1.6em 0 1em 0;
padding: 0 0 0.2em 0;
border-bottom: 1px solid #ccc;
color: #555;
}
h3 {
font-family: 'Helvetica', Arial, sans-serif;
font-size: 1.4em;
margin: 1.1em 0 0.4em 0;
}
 
 
/* * BOÎTES ET MESSAGES * */
 
div.boite-a-droite {
display: table;
clear: right;
float: right;
margin: 1em 0 1em 1em;
width: 20em;
position: relative;/* pour les images manuelles */
 
border-style: solid;
border-width: 1px;
padding: 4px;
text-align: left;
 -webkit-border-radius: 0.3em;
-moz-border-radius: 0.3em;
border-radius: 0.3em;
border: 1px solid #CCC;
box-shadow: 0 0.3em 0.3em rgba(0, 0, 0, 0.1);
padding: 0.1em;
}
.boite-sans-fond {
border-color: #aaa;/* comme boite-grise */
}
.boite-grise {
border-color: #aaa;
background-color: #F9F9F9;
}
 
.boite-jaune { 
border-color: #aaa;
background-color: #FFE998;
}
 
.boite-bleu {
border-color: #aaa;
background-color: #EFF6FA;
}
 
span.annexe {font-weight:bold;color:#0a7cc8;}
.annexe a,
.annexe a:active {color:#0a7cc8;}
.annexe a:hover { color:#CB4627!important;}
 
li.annexe {list-style:none;}
 
.titre-annexe {font-size:14px;font-weight:bold;font-style:italic;margin-left:10px;}

/* Container principal */
.wiki-accueil {
    background: transparent;
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Header style Star Citizen */
.wiki-header-patch {
    background: var(--color-surface-1);
    padding: 12px 20px;
    border-radius: 6px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    border: 1px solid var(--border-color-base);
}

.patch-info {
    color: var(--color-base--subtle);
    font-size: 0.875rem;
    font-weight: 500;
}

.version-info {
    color: var(--color-primary);
    font-weight: bold;
    font-size: 0.875rem;
}

.version-live {
    background: var(--color-primary);
    color: var(--color-primary--contrast);
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    margin-left: 8px;
}

/* Bannière principale */
.wiki-banner {
    position: relative;
    height: 120px;
    background: var(--color-surface-1);
    border-radius: 6px;
    margin-bottom: 20px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    border: 1px solid var(--border-color-base);
}

.banner-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0,0,0,0.85));
    color: #ffffff;
    padding: 16px 20px;
}

.banner-title {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 4px;
    color: #ffffff;
}

.banner-subtitle {
    font-size: 0.9rem;
    opacity: 0.9;
    color: #ffffff;
}

/* GRILLE DE NAVIGATION - CORRECTION IMPORTANTE */
.wiki-nav-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

/* Sur grands écrans, forcer 3 colonnes */
@media (min-width: 1024px) {
    .wiki-nav-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Sur tablettes, 2 colonnes */
@media (max-width: 1023px) and (min-width: 768px) {
    .wiki-nav-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Sur mobile, 1 colonne */
@media (max-width: 767px) {
    .wiki-nav-grid {
        grid-template-columns: 1fr;
    }
}

/* Cartes de navigation - STYLE COMPACT comme Star Citizen */
.wiki-nav-card {
    background: var(--color-surface-1);
    border: 1px solid var(--border-color-base);
    border-radius: 6px;
    overflow: hidden;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    height: 140px; /* Hauteur fixe plus petite */
    position: relative;
}

.wiki-nav-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px -8px rgba(0,0,0,0.3);
    border-color: var(--color-primary);
}

/* Lien qui couvre toute la carte */
.nav-card-link {
    display: block;
    height: 100%;
    text-decoration: none;
    color: inherit;
    position: relative;
}

.nav-card-link:hover {
    text-decoration: none;
    color: inherit;
}

/* Image de fond compacte */
.nav-card-image {
    height: 80px; /* Plus petit */
    background-size: cover;
    background-position: center;
    background-color: var(--color-surface-2);
    position: relative;
}

.nav-card-image::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0,0,0,0.1), rgba(0,0,0,0.4));
}

/* Contenu compact */
.nav-card-content {
    padding: 12px 16px;
    position: relative;
    height: 60px; /* Hauteur fixe */
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nav-card-title {
    font-size: 1rem; /* Plus petit */
    font-weight: 600;
    color: var(--color-base);
    margin-bottom: 4px;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-card-description {
    color: var(--color-base--subtle);
    font-size: 0.8rem; /* Plus petit */
    line-height: 1.3;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Section featured */
.wiki-featured {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
    margin-bottom: 30px;
}

@media (max-width: 768px) {
    .wiki-featured {
        grid-template-columns: 1fr;
    }
}

.featured-main {
    position: relative;
    height: 200px;
    background: var(--color-surface-1);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid var(--border-color-base);
}

.featured-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center;
}

.featured-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0,0,0,0.85));
    color: #ffffff;
    padding: 20px;
}

.featured-title {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: #ffffff;
}

.featured-description {
    font-size: 0.9rem;
    opacity: 0.9;
    line-height: 1.4;
    color: #ffffff;
}

/* Sidebar */
.wiki-sidebar {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sidebar-section {
    background: var(--color-surface-1);
    border: 1px solid var(--border-color-base);
    border-radius: 6px;
    padding: 16px;
}

.sidebar-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-base);
    margin-bottom: 12px;
    border-bottom: 1px solid var(--border-color-base);
    padding-bottom: 8px;
}

.sidebar-stats {
    color: var(--color-base--subtle);
    font-size: 0.875rem;
}

.sidebar-stats strong {
    color: var(--color-primary);
}

/* Liens dans la sidebar */
.sidebar-section a {
    display: block;
    color: var(--color-primary);
    text-decoration: none;
    padding: 6px 0;
    font-size: 0.875rem;
    transition: color 0.15s ease;
    line-height: 1.4;
    border-bottom: 1px solid var(--border-color-subtle);
}

.sidebar-section a:last-child {
    border-bottom: none;
}

.sidebar-section a:hover {
    color: var(--color-primary--hover);
    text-decoration: none;
}