[RÉGLÉ] Protostar : compiler des fichiers LESS dans user.css

[Visiteur]

Salut

Actuellement pour le site de notre asso nous utilisons Helix3 comme template mais nous voudrions passer a Protostar (je vais faire des tests en local). J'ai créé le fichier user.css et comme avec Helix3 nous aimerions utiliser LESS. Dans Protostar j'ai vue le dossier protostar/less dans lequel j'ai créé plusieurs fichiers less histoire de retrouver les codes plus facilement :

- user-articles
- user-declaration
- user-protostar
- user-pages
- user-styles

Mais comment faire pour compiler les fichiers less dans le user.css ?

Joomla 3.9.2
Protostar 1.0

[Eddy.vh]

Bonjour.
Est-ce que scss peut convenir ? Dans ce cas, jeter un oeil sur le site de Lomart, il a un plugin compilateur tout simplement génial que j'utilise pour mes sites et même pour d'éventuels templates pour BreezingForms.

[lefabdu51]

salut,
as tu ouvert les fichiers dont tu parles?
je doutes un peu...
Pour te répondre
tu importes tes fichiers dans le fichier template.less avec le code ci dessous:

@import "../../../media/jui/less/mixins.less";

ce code est issu du fichier template.less et permet d'importer le fichier /media/jui/mixins.less.

et ensuite tu cliques sur le bouton disponible dans le gestionnaire des fichiers de protostar et la tes fichiers seront compilées dans le fichier template.css.

Le fichier user.css est à réserver pour les classes et id que tu ajoutes sans passer par less. Donc il est inutile de l'utiliser dans ton cas.

[Visiteur]

Bonjour.
Est-ce que scss peut convenir ? Dans ce cas, jeter un oeil sur le site de Lomart, il a un plugin compilateur tout simplement génial que j'utilise pour mes sites et même pour d'éventuels templates pour BreezingForms.

Entre temps je me suis un peu plus renseigner concernant SCSS et je vais y passer. Et donc utiliser le plugin de Lomart. Merci.

salut,
as tu ouvert les fichiers dont tu parles?
je doutes un peu...
Pour te répondre
tu importes tes fichiers dans le fichier template.less avec le code ci dessous:

@import "../../../media/jui/less/mixins.less";

ce code est issu du fichier template.less et permet d'importer le fichier /media/jui/mixins.less.

et ensuite tu cliques sur le bouton disponible dans le gestionnaire des fichiers de protostar et la tes fichiers seront compilées dans le fichier template.css.

Le fichier user.css est à réserver pour les classes et id que tu ajoutes sans passer par less. Donc il est inutile de l'utiliser dans ton cas.

Merci quant meme pour ton aide

[lefabdu51]

Ecoutes, ce que je peut te dire c est que tu ne vois pas une étape de base, c est la compilation du code. Pour avoir un fichier user.css, il te faut un fichier user.less avec les import que tu veux dans le dossier less de protostar.
une fois ce fichier crée, tu selectionnes le fichier user.less et tu clique sur le bouton compiler less en haut seconde ligne des icones de menu. Rien de bien compliqué. ...
....
et si tu ne t est pas trompé quelquepart, tu obtiens le resultat ci dessous


et un fichier user.css dans le dossier css. Ce qui est ce que tu veux non?

[Eddy.vh]

Lefabdu51.

Tu as raison, il est parfaitement possible de faire comme ça ! Il suffit même de créer le fichier user.less et compiler pour qu'il crée automatiquement le user.css…

Cependant et personnellement, je préfère de loin travailler mes styles sur mon PC à l'aide de BBedit (Mac OS) ou Notepad++ (Windows) agrémenté de leur option FTP.
On travaille le fichier on l'enregistre, il se met à jour en ligne automatiquement, on recharge la page en front et les fichiers modifiés se compilent.

Je gagne le temps d'enregistrement depuis le backoffice et le rechargement de cette page…

Mais chacun est libre de faire ce qui lui est préférable !

Par la même occasion, pour utiliser du scss au lieu du less, il sera peut-être intéressant de passer à Helix Ultimate (qui utilise le scss) plutôt qu'Helix 3…

[lefabdu51]

scss a beaucoup de points commun avec less.. Ce sont deux languages qui obeissent aux meme principes.
Les regles d'import des fichiers sont identiques aux regles d import CSS brut.
Ce qui rend less et scss plus simple à comprendre.
Dans un autre message je parles de l'influence des dev sur joomla.
Je te signale juste que scss sortiras sous Joomla 4.

Donc css est en train aussi d'évoluer.
tiens lis ceci...
https://developer.mozilla.org/en-US/...tom_properties

Less et scss ne sont utile que pour te simplifier la vie et les taches de reproduction....
Pour un projet unique, c est franchement superflu.
Autant travailler directement en css....
tu sait l avantage de firefox par rapport aux autres.
C est l'editeur de style intégré.

https://developer.mozilla.org/fr/docs/Outils/%C3%89diteur_de_style

Lire le paragraphe sur le source map.....
Et tu comprendras l'interet d'utiliser less.
Tu peux editer les fichiers directement sans sortir du navigateur..
Tu vois le reel gain de temps ?
Tu peut éditer les fichiers less depuis firefox, sans aucun besoin d'extensions tierces.

firefox a été le premier navigateur à integrer ce principe d'edition en ligne des fichiers css...
Ca remontes à un moment.
C est ce qui me la s toujours fait préferer.

[Visiteur]

Ecoutes, ce que je peut te dire c est que tu ne vois pas une étape de base, c est la compilation du code. Pour avoir un fichier user.css, il te faut un fichier user.less avec les import que tu veux dans le dossier less de protostar.
une fois ce fichier crée, tu selectionnes le fichier user.less et tu clique sur le bouton compiler less en haut seconde ligne des icones de menu. Rien de bien compliqué. ...

et un fichier user.css dans le dossier css. Ce qui est ce que tu veux non?

Heuuuu j'ai jamais dit que c'etait compliqué . Mais ayant decidé que j'allais utiliser le plugin de Lomart pas besoin de le faire moi meme.

Lefabdu51.

Tu as raison, il est parfaitement possible de faire comme ça ! Il suffit même de créer le fichier user.less et compiler pour qu'il crée automatiquement le user.css…

Cependant et personnellement, je préfère de loin travailler mes styles sur mon PC à l'aide de BBedit (Mac OS) ou Notepad++ (Windows) agrémenté de leur option FTP.
On travaille le fichier on l'enregistre, il se met à jour en ligne automatiquement, on recharge la page en front et les fichiers modifiés se compilent.

Je gagne le temps d'enregistrement depuis le backoffice et le rechargement de cette page…

Mais chacun est libre de faire ce qui lui est préférable !

Par la même occasion, pour utiliser du scss au lieu du less, il sera peut-être intéressant de passer à Helix Ultimate (qui utilise le scss) plutôt qu'Helix 3…

Je travaille aussi en local avec Notepad++ et en actualisant la page. Je laisse tomber Helix pour Protostar.

scss a beaucoup de points commun avec less.. Ce sont deux languages qui obeissent aux meme principes.
Les regles d'import des fichiers sont identiques aux regles d import CSS brut.
Ce qui rend less et scss plus simple à comprendre.
Dans un autre message je parles de l'influence des dev sur joomla.
Je te signale juste que scss sortiras sous Joomla 4.

Donc css est en train aussi d'évoluer.
tiens lis ceci...
https://developer.mozilla.org/en-US/...tom_properties

Merci pour le lien, je vais le lire.