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

Version actuelle datée du 15 février 2024 à 01:48

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

/* Couleurs de base */
:root {
    --couleur-fond-principal: #fdf6e3; /* Crème léger pour le fond principal */
    --couleur-texte-principal: #073642; /* Bleu foncé/gris pour le texte principal */
    --couleur-lien: #b58900; /* Or pour les liens */
    --couleur-lien-hover: #cb4b16; /* Orange pour les liens au survol */
    --couleur-header: #002b36; /* Bleu très foncé pour les en-têtes */
    --couleur-bouton: #586e75; /* Gris bleu pour les boutons */
    --couleur-bouton-hover: #657b83; /* Gris bleu clair pour les boutons au survol */
}

/* Appliquer les couleurs de base */
body {
    background-color: var(--couleur-fond-principal);
    color: var(--couleur-texte-principal);
}

a {
    color: var(--couleur-lien);
}

a:hover, a:focus {
    color: var(--couleur-lien-hover);
}

/* En-têtes (h1, h2, h3, h4, h5, h6) */
h1, h2, h3, h4, h5, h6 {
    color: var(--couleur-header);
}

/* Boutons */
button, .button, input[type="submit"], input[type="button"] {
    background-color: var(--couleur-bouton);
    color: white;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    border-radius: 5px;
    transition: background-color 0.3s ease;
}

button:hover, .button:hover, input[type="submit"]:hover, input[type="button"]:hover {
    background-color: var(--couleur-bouton-hover);
}

/* Typographie */
body {
    font-family: 'Georgia', serif;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Times New Roman', serif;
}

/* Personnalisation des blocs de citation */
blockquote {
    border-left: 4px solid var(--couleur-lien);
    background-color: #eee8d5; /* Crème plus clair pour le fond */
    padding: 10px 20px;
    margin: 20px;
}

/* Personnalisation des cadres et tableaux */
table, th, td {
    border: 1px solid var(--couleur-header);
}

th, td {
    padding: 8px 12px;
}

table {
    border-collapse: collapse;
    width: 100%;
}

th {
    background-color: var(--couleur-header);
    color: white;
}

tr:nth-child(even) {
    background-color: #eee8d5;
}

/* Autres éléments d'interface */
.mw-headline {
    border-bottom: 2px solid var(--couleur-header);
    padding-bottom: 5px;
}

/* Adaptations pour les appareils mobiles */
@media screen and (max-width: 768px) {
    body {
        padding: 5px;
    }

    h1 {
        font-size: 24px;
    }
}