Modifier le logo de l'établissement
Vous pouvez faire apparaitre en bas de page le logo de votre établissement.
Pour cela, placez votre logo dans le dossier `pod/main/static/custom/img`, et indiquez son chemin dans le fichier settings_local.py
:
'LOGO_ETB': 'custom/img/logo_mon_etab.svg', |
Si vous avez un logo d'établissement coloré :
Nous vous invitons à prévoir également une 2e version "mode sombre" de votre logo, qui sera suffisamment contrastée sur fonds foncés. Placez le fichier dans le même dossier que le premier, puis dans votre fichier CSS personnalisé indiquez ceci :
[data-theme="dark"] .pod-footer-logo { background-image: url('/static/custom/img/logo_mon_etab_blanc.svg') !important }
Si votre logo d'établissement est monochrome,
Vous pouvez n'utiliser qu'un fichier, et en inverser les couleurs dans votre CSS personnalisé ainsi :
data-theme="dark"] .pod-footer-logo { filter: invert(100); }
Changer les couleurs principales
Pour personnaliser le look de votre serveur Pod, vous pouvez ajouter votre propre feuille de style, en indiquant ceci dans le fichier settings_local.py
:
|
Placez alors un fichier `theme-mon_etab.css` dans le dossier `pod/main/static/custom/`
Dans ce dernier, vous pouvez modifier les couleurs de Pod. Voici quelques exemples :
/*** Esup Pod custom CSS ***/ :root { /* exemple vert univ-lille.fr 2022 */ --pod-primary: #1F8389; --pod-primary-lighten: #08b0a0; --pod-primary-darken: #18575D; /* Mode sombre */ --pod-primary-dark: #1F8389; --pod-primary-lighten-dark: #18575D; --pod-primary-darken-dark: #08b0a0; }
/*** Esup Pod custom CSS ***/ :root { /* exemple rose "pod v2" */ --pod-primary: #ae2573; --pod-primary-lighten: #d782b3; --pod-primary-darken: #93326a; /* Mode sombre */ --pod-primary-dark: #ae2573; --pod-primary-lighten-dark: #db258e; --pod-primary-darken-dark: #93326a; }
/*** Esup Pod custom CSS ***/ :root { /* exemple violet "BS 5" */ --pod-primary: #7952b3; --pod-primary-lighten: #ad76ff; --pod-primary-darken: #6528e0; /* Mode sombre */ --pod-primary-dark: #7952b3; --pod-primary-lighten-dark: #ad76ff; --pod-primary-darken-dark: #6528e0; }
/*** Esup Pod custom CSS ***/ :root { /* exemple bleu "default" */ --pod-primary: #0052cc; --pod-primary-lighten: #0065ff; --pod-primary-darken: #0048b4; /* Mode sombre */ --pod-primary-dark: #0052cc; --pod-primary-lighten-dark: #0065ff; --pod-primary-darken-dark: #0048b4; }
Voir cette page de configuration pour plus d'infos.