Actuellement le CSS est immaintenable. Y'a des fichiers partout, on ne sait pas trop qu'est-ce qui contient quoi, et surtout on a un fichier responsive.css qui rend l'ajout de règles supplémentaires un enfer.
L'idée est de passer sur LessCSS (ou une solution plus KISS, à voir), permettant d'utiliser une syntaxe imbriquée. Par exemple
La gestion des thèmes reste inchangée grâce à l'utilisation de fichiers themes.css contenant des variables CSS3.
D'un point de vue technique, je suis parti dans un premier temps sur LessCSS car c'est un outil que je connais (dans le sens, je sais qu'il existe). Si un autre outil propose les mêmes fonctionnalités et s'avère être plus pratique à utiliser, autant passer dessus.
La création d'un makefile qui build le CSS est selon moi nécessaire, afin que l'on automatise la création du CSS final que ce soit pour les besoins du développement ou coté CD.
Actuellement le CSS est immaintenable. Y'a des fichiers partout, on ne sait pas trop qu'est-ce qui contient quoi, et surtout on a un fichier `responsive.css` qui rend l'ajout de règles supplémentaires un enfer.
L'idée est de passer sur LessCSS (ou une solution plus KISS, à voir), permettant d'utiliser une syntaxe imbriquée. Par exemple
```
.component {
width: 300px;
@media (min-width: 1280px) {
width: 800px;
}
.subcomponent > input {
color: var(--background);
}
}
```
La gestion des thèmes reste inchangée grâce à l'utilisation de fichiers `themes.css` contenant des variables CSS3.
D'un point de vue technique, je suis parti dans un premier temps sur [LessCSS](https://github.com/lesscpy/lesscpy) car c'est un outil que je connais (dans le sens, je sais qu'il existe). Si un autre outil propose les mêmes fonctionnalités et s'avère être plus pratique à utiliser, autant passer dessus.
La création d'un makefile qui build le CSS est selon moi nécessaire, afin que l'on automatise la création du CSS final que ce soit pour les besoins du développement ou coté CD.
Note que je trouve la séparation en fichiers pas si mal, comparée à la v4.3 c'est un délice par exemple. Je propose de rester à peu près sur la même répartition des règles, si ça te paraît pas absurde.
La version Python du compilateur : https://github.com/lesscpy/lesscpy
Note que je trouve la séparation en fichiers *pas si mal*, comparée à la v4.3 c'est un délice par exemple. Je propose de rester à peu près sur la même répartition des règles, si ça te paraît pas absurde.
Alright du coup j'ai soumis tout ça en PR et ça été fusionné presque immédiatement. Il suffit de pull la source sans maintenir un dépôt à part. Ça devrait débloquer le travail ici !
Alright du coup j'ai soumis tout ça en PR et ça été [fusionné presque immédiatement](https://github.com/lesscpy/lesscpy/pull/117). Il suffit de pull la source sans maintenir un dépôt à part. Ça devrait débloquer le travail ici !
Pour la compilation du CSS, je suis parti sur un fonctionnement manuel. Le but est de ne pas pénaliser les contrubuteurs qui n'ont pas envie d'installer Less sur leur machine.
Le makefile ajouté permet de faciliter la gestion de cette compilation :
make css compile les fichiers Less qui ont été modifiés
make run compile le CSS puis lance flask run
Les fichiers appelés par le HTML sont toujours dans app/static/css. Il faut penser à les ajouter au commit si on touche aux sources Less :
Faire ses modifs
Compiler
Ajouter au commit les fichiers Less et les CSS produits
Pour la compilation du CSS, je suis parti sur un fonctionnement manuel. Le but est de ne pas pénaliser les contrubuteurs qui n'ont pas envie d'installer Less sur leur machine.
Le makefile ajouté permet de faciliter la gestion de cette compilation :
- `make css` compile les fichiers Less qui ont été modifiés
- `make run` compile le CSS puis lance `flask run`
Les fichiers appelés par le HTML sont toujours dans `app/static/css`. Il faut penser à les ajouter au commit si on touche aux sources Less :
1. Faire ses modifs
2. Compiler
3. Ajouter au commit les fichiers Less et les CSS produits
[PR fusionnée](https://gitea.planet-casio.com/devs/PCv5/pulls/102), [doc ajoutée](https://gitea.planet-casio.com/devs/PCv5/wiki/19-CSS-et-th%C3%A8mes-additionnels), je ferme ce ticket
Actuellement le CSS est immaintenable. Y'a des fichiers partout, on ne sait pas trop qu'est-ce qui contient quoi, et surtout on a un fichier
responsive.css
qui rend l'ajout de règles supplémentaires un enfer.L'idée est de passer sur LessCSS (ou une solution plus KISS, à voir), permettant d'utiliser une syntaxe imbriquée. Par exemple
La gestion des thèmes reste inchangée grâce à l'utilisation de fichiers
themes.css
contenant des variables CSS3.D'un point de vue technique, je suis parti dans un premier temps sur LessCSS car c'est un outil que je connais (dans le sens, je sais qu'il existe). Si un autre outil propose les mêmes fonctionnalités et s'avère être plus pratique à utiliser, autant passer dessus.
La création d'un makefile qui build le CSS est selon moi nécessaire, afin que l'on automatise la création du CSS final que ce soit pour les besoins du développement ou coté CD.
La version Python du compilateur : https://github.com/lesscpy/lesscpy
Note que je trouve la séparation en fichiers pas si mal, comparée à la v4.3 c'est un délice par exemple. Je propose de rester à peu près sur la même répartition des règles, si ça te paraît pas absurde.
Je vais faire une passe sur lesscpy pour voir si je peux ajouter le support des variables CSS4.
Ma foi, à part une subtilité dans le lexer il n'y avait pas de problème particulier. (?)
Alright du coup j'ai soumis tout ça en PR et ça été fusionné presque immédiatement. Il suffit de pull la source sans maintenir un dépôt à part. Ça devrait débloquer le travail ici !
Pour la compilation du CSS, je suis parti sur un fonctionnement manuel. Le but est de ne pas pénaliser les contrubuteurs qui n'ont pas envie d'installer Less sur leur machine.
Le makefile ajouté permet de faciliter la gestion de cette compilation :
make css
compile les fichiers Less qui ont été modifiésmake run
compile le CSS puis lanceflask run
Les fichiers appelés par le HTML sont toujours dans
app/static/css
. Il faut penser à les ajouter au commit si on touche aux sources Less :PR fusionnée, doc ajoutée, je ferme ce ticket