Wikipetcia
atjwiki
https://atj.wikipedia.org/wiki/Otitikowin
MediaWiki 1.47.0-wmf.24
first-letter
Tipatcimoctakewin
Kotakahi
Ke ici aimihitonaniwok
Ka notcitatc
Ke ici aimihitonaniwok notcita iriniw
Wikipetcia
Ke ici aimihitonaniwok Wikipetcia
Natisinahikaniwoc
Ke ici aimihitonaniwok natisinihikaniwoc
MediaWiki
Ke ici aimihitonaniwok MediaWiki
Tipapitcikesinihikan
Ke ici arimotcikatek tipapitcikesinihikan
Witcihikoiin
Ke ici aimihitonaniwok witcihewinik
Tipanictawin
Ke ici aimihitonaniwok tipanictawin
TimedText
TimedText talk
Aitapihikewin
Aitapihikan ke ici aimihitonaniwok
Event
Event talk
MediaWiki:Common.css
8
523
17033
16802
2026-10-15T11:57:08Z
Maintenance script
2348
Use thumb.wikimedia.org for thumbnails ([[phab:T427465]], Operator: Ladsgroup)
17033
css
text/css
/* ==========================================================================
STRUCTURE DE LA PAGE D'ACCUEIL - WIKIPETCIA ATIKAMEKW
Ce fichier gère l'apparence visuelle du portail principal (Otitikowin).
========================================================================== */
/**
* 1. BANDEAU D'EN-TÊTE (#ACCUEIL-BANDEAU)
* Bloc de bienvenue avec dégradé et icône en filigrane.
*/
#ACCUEIL-BANDEAU {
position: relative;
z-index: 0;
background: linear-gradient(to bottom, #ffffff 0%, #e8f2f8 100%);
border: 1px solid #a8d7fc;
border-radius: 4px;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
color: #002b45;
overflow: hidden;
margin-bottom: 0.75rem;
box-sizing: border-box;
/* Espacements fluides (Standard + Moderne pour éviter les erreurs d'analyse) */
padding: 1.25rem 1.5rem;
padding: clamp(1rem, 2.5vw, 1.5rem) clamp(1rem, 4vw, 2rem);
padding-right: 3rem;
padding-right: clamp(1.1rem, 10vw, 5rem);
}
/* Icône décorative (Medicine Wheel) placée à droite */
#ACCUEIL-BANDEAU::before {
content: "";
position: absolute;
top: 50%;
right: 12px;
transform: translateY(-50%);
/* Taille de l'image (Standard + Moderne) */
width: 150px;
height: 150px;
width: clamp(90px, 14vw, 220px);
aspect-ratio: 1 / 1;
background-image: url("https://thumb.wikimedia.org/wikipedia/commons/thumb/2/2f/Medicine_Wheel.png/960px-Medicine_Wheel.png");
background-repeat: no-repeat;
background-position: center;
background-size: contain;
opacity: 0.14;
pointer-events: none; /* L'image ne bloque pas les clics sur les liens */
z-index: 0;
}
/* S'assure que le texte du bandeau reste cliquable et visible au-dessus de l'icône */
#ACCUEIL-BANDEAU > * {
position: relative;
z-index: 1;
}
/**
* 2. SYSTÈME DE GRILLE (LAYOUT)
* Organisation des contenus en colonnes flexibles.
*/
/* Conteneur parent */
.ACCUEIL-CONTENEUR {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 0;
box-sizing: border-box;
}
/* Colonne principale (60% de largeur sur PC) */
.ACCUEIL-COLONNE.GAUCHE {
flex: 1 1 60%;
min-width: 300px;
margin-right: 0.5em;
}
/* Colonne latérale (35% de largeur sur PC) */
.ACCUEIL-COLONNE.DROITE {
flex: 1 1 35%;
min-width: 250px;
font-size: 90%;
}
/**
* 3. COMPOSANTS (BOÎTES ET CARTES)
* Blocs visuels pour segmenter les informations.
*/
/* Boîte blanche avec ombre portée */
.BOITE-OMBRE {
border: 1px solid #cccccc;
padding: 1.2em;
margin-bottom: 0.8em;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
border-radius: 4px;
background-color: #ffffff;
box-sizing: border-box;
}
/* Variante avec fond gris clair */
.grise {
background-color: #f9f9f9;
}
/* Boîte avec bordure bleue à gauche pour l'accentuation */
.boite-secondaire-accueil {
border: 1px solid #cccccc;
border-left: 5px solid #d0e7f5;
background-color: #f9f9f9;
padding: 1em;
margin-bottom: 1em;
}
/**
* 4. TYPOGRAPHIE ET LISTES
* Mise en forme du texte à l'intérieur des boîtes.
*/
/* Listes de navigation épurées (sans puces) */
.liste-accueil {
list-style: none;
margin: 0;
padding: 0;
}
.liste-accueil li {
padding: 0.2em 0;
border-bottom: 1px solid #eeeeee;
}
.liste-accueil li:last-child {
border-bottom: none;
}
/**
* 5. ADAPTATION MOBILE (RESPONSIVE)
* Ajustements pour smartphones et tablettes (< 767px).
*/
@media screen and (max-width: 767px) {
/* On empile les colonnes verticalement */
.ACCUEIL-COLONNE.GAUCHE,
.ACCUEIL-COLONNE.DROITE {
flex: 1 1 100%;
margin-right: 0;
}
/* On simplifie l'aspect des boîtes pour gagner de la place */
.BOITE-OMBRE {
border: none;
background-color: transparent;
padding: 0.5em 0;
margin-bottom: 1.5em;
box-shadow: none;
}
/* Ajustement du bandeau sur mobile */
#ACCUEIL-BANDEAU {
padding-right: 1rem;
padding-right: clamp(0.6rem, 16vw, 1.1rem);
}
#ACCUEIL-BANDEAU::before {
width: 80px;
height: 80px;
width: clamp(64px, 20vw, 110px);
opacity: 0.10;
right: 8px;
}
}
/**
* 6. NETTOYAGE FINAL
*/
/* Masquer les catégories uniquement sur la page Otitikowin */
.page-Otitikowin .catlinks {
display: none;
}
/**
* 7. IMAGES ET MÉDIAS
* Gestion de l'affichage des illustrations pour qu'elles respectent le design.
*/
/* Force les images à ne jamais dépasser la largeur de leur conteneur (essentiel pour le mobile) */
.BOITE-OMBRE img,
.boite-secondaire-accueil img {
max-width: 100%;
height: auto;
border-radius: 2px; /* Un léger arrondi pour adoucir l'image */
}
/* Style pour les images centrées avec légende */
.image-accueil-cadre {
text-align: center;
margin: 1em 0;
padding: 0.5em;
background-color: #fcfcfc;
border: 1px solid #eeeeee;
}
/**
* 8. MISE EN FORME DES LIENS (INTERVÉRIFICATIONS)
* Pour que les liens vers les autres projets ou langues soient clairs.
*/
/* Liens vers les autres projets (Wikisource, Wiktionnaire, etc.) */
.projet-lien {
display: flex;
align-items: center;
padding: 8px;
margin-bottom: 5px;
background: #ffffff;
border: 1px solid #e8f2f8;
border-radius: 4px;
transition: background 0.3s;
}
.projet-lien:hover {
background: #e8f2f8;
text-decoration: none;
}
/* Style pour l'icône du projet à l'intérieur du lien */
.projet-lien img {
margin-right: 10px;
}
/**
* 12. LISTES DE NAVIGATION (ADAPTÉES AU WIKITEXTE)
* Permet d'utiliser les puces standard "*" tout en ayant le design moderne.
*/
.liste-accueil ul {
list-style: none; /* Enlève la puce ronde par défaut */
margin: 0;
padding: 0;
}
.liste-accueil li {
padding: 0.4em 0;
border-bottom: 1px solid #eeeeee;
line-height: 1.4;
}
.liste-accueil li:last-child {
border-bottom: none;
}
dobwzyl3wcqe3vb3e3ll9dpglhiyjh3