Merge pull request 'Ajout d'un tuto pour changer le thème de Gitea.' (#47) from miles-gitea into master

Reviewed-on: #47

docker-compose/gitea/Changer le Thème de Gitea.md

@@ -0,0 +1,77 @@
+Changer le thème de Gitea <!-- omit in toc -->
+============
+
+- [1. Trouver un thème sympa](#1-trouver-un-thème-sympa)
+- [2. Installer le thème](#2-installer-le-thème)
+- [3. Exemple avec le dernier lien du dépôt donnée précédemment](#3-exemple-avec-le-dernier-lien-du-dépôt-donnée-précédemment)
+  - [3.1. Changer le thème](#31-changer-le-thème)
+
+# 1. Trouver un thème sympa
+
+Ce dépôt contient quelques thèmes : https://gitea.com/gitea/awesome-gitea#themes
+
+Choisir le thème voulu.
+
+
+# 2. Installer le thème
+
+Il faut vérifier si la variable GITEA_CUSTOM a été paramétrée. En temps normal, ce n'est pas le cas.
+
+Si ce n'est pas le cas, on peut aller vérifier le chemin qui est paramétré pour le dossier dit CUSTOM de gitea. Pour celà, il faut aller ici : <br>
+`https://url-de-votre-gitea.tlds/admin/config`
+
+Puis chercher la ligne `GITEA_CUSTOM` où apparaîtra le chemin d'accès : `/data/gitea`.
+
+Dans le cas d'une installation Docker, ça donnerait ceci : `/docker/gitea/data/gitea`
+ <br>(voir le fichier **docker-compose.yml** pour le chemin d'accès avant le `/data/gitea`)
+
+Il faudra alors créer les dossiers suivants :
+
+- `public`
+- `templates`
+- `templates/custom`
+
+Puis il faudra suivre les instructions du thème choisi. Pour ceux qui n'auraient pas d'instructions, le fichier `styles.css` devra se trouver dans le dossier `public`.
+
+# 3. Exemple avec le dernier lien du dépôt donnée précédemment
+
+Je vais prendre le dernier lien donné dans le dépôt du [paragraphe #1](#1-trouver-un-thème-sympa) :
+
+> - [theme.park](https://github.com/gilbN/theme.park/wiki/Gitea) - A theme suite for Gitea.
+
+Sur ce nouveau dépôt ( https://github.com/gilbN/theme.park/wiki/Gitea ) vous trouverez plusieurs thèmes.
+
+Je trouve les thèmes plex, dark et space-gray relativement sympas.
+Des captures sont présentes plus bas dans la page : https://github.com/gilbN/theme.park/wiki/Gitea#screenshots
+
+Il faut créer deux fichiers :
+
+- `public/styles.css` qui contient (avec des commentaires perso) :
+```css
+/*  Source : https://github.com/gilbN/theme.park/wiki/Gitea
+    Possibilités :  https://gilbn.github.io/theme.park/CSS/themes/gitea/XXX.css
+                    aquamarine.css      <--- pas terrible
+                    hotline.css
+                    plex.css            <--- TOP
+                    dark.css            <--- TOP
+                    space-gray.css      <--- TOP
+                    organizr-dark.css
+*/
+@import url("https://gilbn.github.io/theme.park/CSS/themes/gitea/plex.css");
+```
+
+- `templates/custom/header.tmpl` qui contient :
+```html
+<link rel="stylesheet" href="{{AppSubUrl}}/styles.css">
+```
+Une fois les fichiers créés et placés dans ces dossiers (faire attention aux permissions), il suffit de redémarrer Gitea (ou le conteneur si installation en Docker).
+
+## 3.1. Changer le thème
+
+Pour changer le thème, il suffit de :
+
+- modifier le `public/styles.css` avec le nom du css désiré ;
+- redémarrer Gitea ;
+- ne pas oublier de vider le cache du navigateur... sinon le nouveau thème ne sera pas visible... (ça m'a pris 15 minutes d'essais et au bout de ce temps l'utilisation d'un autre navigateur pour le comprendre...).
+
+Voilà :)

docker-compose/gitea/data--gitea/public/styles.css

@@ -0,0 +1,10 @@
+/*  Source : https://github.com/gilbN/theme.park/wiki/Gitea
+    Possibilités :  https://gilbn.github.io/theme.park/CSS/themes/gitea/XXX.css
+                    aquamarine.css      <--- Pas mal celui là.
+                    hotline.css
+                    plex.css            <--- TOP
+                    dark.css            <--- TOP
+                    space-gray.css      <--- TOP, mon préféré !
+                    organizr-dark.css
+*/
+@import url("https://gilbn.github.io/theme.park/CSS/themes/gitea/plex.css");

docker-compose/gitea/data--gitea/templates/custom/header.tmpl

@@ -0,0 +1 @@
+<link rel="stylesheet" href="{{AppSubUrl}}/styles.css">