Files
roundcube-vblog/theme/_styles.less
T

76 lines
2.2 KiB
Plaintext

// Compléments CSS charte vBlog.io pour le skin Elastic (Roundcube)
// Emplacement : skins/elastic/styles/_styles.less
// --- Police Poppins auto-hébergée (pas d'appel à Google Fonts) ---
// Fichiers à copier dans skins/elastic/fonts/ (source : paquet npm @fontsource/poppins, licence OFL)
@font-face {
font-family: 'Poppins';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/poppins-latin-400-normal.woff2') format('woff2');
}
@font-face {
font-family: 'Poppins';
font-style: italic;
font-weight: 400;
font-display: swap;
src: url('../fonts/poppins-latin-400-italic.woff2') format('woff2');
}
@font-face {
font-family: 'Poppins';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/poppins-latin-700-normal.woff2') format('woff2');
}
@font-face {
font-family: 'Poppins';
font-style: italic;
font-weight: 700;
font-display: swap;
src: url('../fonts/poppins-latin-700-italic.woff2') format('woff2');
}
body, button, input, optgroup, select, textarea, .popover {
font-family: Poppins, Roboto, sans-serif;
}
// --- Bouton principal de la page de login en orange (CTA du blog) ---
#login-form .btn-primary {
background-color: @vblog-accent;
border-color: @vblog-accent;
&:hover, &:focus {
background-color: darken(@vblog-accent, 8%);
border-color: darken(@vblog-accent, 8%);
}
}
// --- Mode sombre : liens lisibles sur fond sombre, bouton "Écrire" en orange ---
// :where() ramène la spécificité à celle de la règle de base "a { color: @color-link }"
// de global.less : seuls les liens "nus" changent, pas les listes ni les boutons.
:where(html.dark-mode) a {
color: lighten(@vblog-primary, 40%);
&:hover {
color: lighten(@vblog-primary, 50%);
}
}
html.dark-mode {
#taskmenu .action-buttons a {
color: @vblog-accent;
}
// Elastic assombrit le logo en mode sombre (opacity .8) : on le laisse net
#logo {
opacity: 1;
}
}
// --- Logo du menu latéral : l'emblème est presque carré, on lui laisse de l'air ---
#layout-menu .popover-header img {
padding: .6rem;
}