« Modèle:Documentation/styles.css » : différence entre les versions
De Nefald
Autres actions
mAucun résumé des modifications |
mAucun résumé des modifications |
||
| (6 versions intermédiaires par le même utilisateur non affichées) | |||
| Ligne 1 : | Ligne 1 : | ||
/* ====================== | |||
SYSTÈME DE DOCUMENTATION - MINIMALISTE | |||
Compatible Citizen light/dark | |||
====================== */ | |||
/* Conteneur principal */ | /* Conteneur principal */ | ||
.nef-doc-system { | .nef-doc-system { | ||
margin: 1.5em 0; | |||
} | |||
/* ====================== | |||
BARRE SIMPLE | |||
====================== */ | |||
.nef-doc-header { | |||
display: flex; | |||
align-items: center; | |||
justify-content: space-between; | |||
padding: 8px 12px; | |||
background-color: var(--color-surface-2); | |||
border: 1px solid var(--border-color-base); | |||
border-radius: 4px 4px 0 0; | |||
font-size: 13px; | |||
} | |||
.nef-doc-header-content { | |||
display: flex; | |||
align-items: center; | |||
gap: 8px; | |||
color: var(--color-base); | |||
font-weight: 500; | |||
} | |||
.nef-doc-header-icon { | |||
font-size: 16px; | |||
opacity: 0.7; | |||
} | |||
/* Boutons alignés à droite */ | |||
.nef-doc-header-actions { | |||
display: flex; | |||
gap: 8px; | |||
} | |||
.nef-doc-btn { | |||
display: inline-block; | |||
padding: 4px 8px; | |||
background: var(--color-surface-1); | |||
border: 1px solid var(--border-color-base); | |||
border-radius: 3px; | |||
font-size: 12px; | |||
transition: background-color 0.2s ease; | |||
} | |||
.nef-doc-btn a { | |||
color: var(--color-base) !important; | |||
text-decoration: none !important; | |||
} | |||
.nef-doc-btn:hover { | |||
background: var(--color-surface-3); | |||
} | |||
/* Bouton "Créer" avec accent vert discret */ | |||
.nef-doc-btn-create { | |||
border-color: var(--color-success); | |||
} | } | ||
.nef-doc-btn-create a { | |||
.nef-doc- | color: var(--color-success) !important; | ||
} | } | ||
/* ====================== | |||
BOÎTES DE DOCUMENTATION | |||
====================== */ | |||
.nef-doc-box { | |||
border: 1px solid var(--border-color-base); | |||
border-top: none; | |||
border-radius: 0 0 4px 4px; | |||
padding: 1.5em; | |||
background-color: var(--color-surface-1); | |||
} | } | ||
/* | /* Documentation existante */ | ||
.nef-doc-exists { | .nef-doc-exists { | ||
border-left: 1px solid var(--color-success); | |||
} | } | ||
/* | /* Documentation manquante */ | ||
.nef-doc-missing { | .nef-doc-missing { | ||
display: flex; | |||
align-items: flex-start; | |||
gap: 1em; | |||
background-color: var(--color-surface-2); | |||
border-left: 1px solid var(--color-destructive); | |||
} | } | ||
.nef-doc-icon { | .nef-doc-icon { | ||
font-size: 2em; | |||
opacity: 0.6; | |||
flex-shrink: 0; | |||
} | } | ||
.nef-doc-content { | .nef-doc-content { | ||
flex: 1; | |||
} | } | ||
/* Instructions */ | /* Instructions */ | ||
.nef-doc-instructions { | .nef-doc-instructions { | ||
background-color: var(--color-surface-3); | |||
padding: 1em; | |||
border-radius: 4px; | |||
margin-top: 1em; | |||
border-left: 1px solid var(--color-progressive); | |||
color: var(--color-base); | |||
} | } | ||
.nef-doc-instructions ul { | |||
margin: 0.5em 0 0 0; | |||
padding-left: 1.5em; | |||
} | } | ||
/* Liens | /* Liens */ | ||
.nef-doc-box a { | .nef-doc-box a { | ||
color: var(--color-progressive); | |||
} | } | ||
.nef-doc- | /* ====================== | ||
RESPONSIVE | |||
====================== */ | |||
@media (max-width: 640px) { | |||
.nef-doc-header { | |||
flex-direction: column; | |||
align-items: stretch; | |||
gap: 8px; | |||
} | } | ||
.nef-doc-header-content { | |||
justify-content: center; | |||
} | |||
.nef-doc-header-actions { | |||
justify-content: center; | |||
} | } | ||
.nef-doc-missing { | |||
flex-direction: column; | |||
text-align: center; | |||
} | |||
.nef-doc-icon { | |||
margin: 0 auto; | |||
} | |||
} | } | ||
Dernière version du 15 novembre 2025 à 10:56
/* ======================
SYSTÈME DE DOCUMENTATION - MINIMALISTE
Compatible Citizen light/dark
====================== */
/* Conteneur principal */
.nef-doc-system {
margin: 1.5em 0;
}
/* ======================
BARRE SIMPLE
====================== */
.nef-doc-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 12px;
background-color: var(--color-surface-2);
border: 1px solid var(--border-color-base);
border-radius: 4px 4px 0 0;
font-size: 13px;
}
.nef-doc-header-content {
display: flex;
align-items: center;
gap: 8px;
color: var(--color-base);
font-weight: 500;
}
.nef-doc-header-icon {
font-size: 16px;
opacity: 0.7;
}
/* Boutons alignés à droite */
.nef-doc-header-actions {
display: flex;
gap: 8px;
}
.nef-doc-btn {
display: inline-block;
padding: 4px 8px;
background: var(--color-surface-1);
border: 1px solid var(--border-color-base);
border-radius: 3px;
font-size: 12px;
transition: background-color 0.2s ease;
}
.nef-doc-btn a {
color: var(--color-base) !important;
text-decoration: none !important;
}
.nef-doc-btn:hover {
background: var(--color-surface-3);
}
/* Bouton "Créer" avec accent vert discret */
.nef-doc-btn-create {
border-color: var(--color-success);
}
.nef-doc-btn-create a {
color: var(--color-success) !important;
}
/* ======================
BOÎTES DE DOCUMENTATION
====================== */
.nef-doc-box {
border: 1px solid var(--border-color-base);
border-top: none;
border-radius: 0 0 4px 4px;
padding: 1.5em;
background-color: var(--color-surface-1);
}
/* Documentation existante */
.nef-doc-exists {
border-left: 1px solid var(--color-success);
}
/* Documentation manquante */
.nef-doc-missing {
display: flex;
align-items: flex-start;
gap: 1em;
background-color: var(--color-surface-2);
border-left: 1px solid var(--color-destructive);
}
.nef-doc-icon {
font-size: 2em;
opacity: 0.6;
flex-shrink: 0;
}
.nef-doc-content {
flex: 1;
}
/* Instructions */
.nef-doc-instructions {
background-color: var(--color-surface-3);
padding: 1em;
border-radius: 4px;
margin-top: 1em;
border-left: 1px solid var(--color-progressive);
color: var(--color-base);
}
.nef-doc-instructions ul {
margin: 0.5em 0 0 0;
padding-left: 1.5em;
}
/* Liens */
.nef-doc-box a {
color: var(--color-progressive);
}
/* ======================
RESPONSIVE
====================== */
@media (max-width: 640px) {
.nef-doc-header {
flex-direction: column;
align-items: stretch;
gap: 8px;
}
.nef-doc-header-content {
justify-content: center;
}
.nef-doc-header-actions {
justify-content: center;
}
.nef-doc-missing {
flex-direction: column;
text-align: center;
}
.nef-doc-icon {
margin: 0 auto;
}
}