Composant de spinner de chargement personnalisé

While working on the Grogu theme I implemented a custom loading icon for that theme and thought it would be cool to have a standalone component to customize the loading spinner icon.

This component allows staff to customize the default spinning icon. There are three customization options available via theme settings:

  • icon name
  • icon size
  • icon color

The component only accepts FontAwesome icon name and I recommend picking one of these icons to get awesome spinning effect.

Enjoy, and do let me know how to further improve this component. :slight_smile:

25 « J'aime »

Hello just installed this! An improvement that you could make is to add another colour for dark theme as the colour you choose for light such as #000000 will not be seen on a dark theme.

6 « J'aime »

That’s exactly why the color is customizable via theme setting custom icon color.

4 « J'aime »

No what I mean is that is that the icon colour should invert depending on whether you are on a light or dark theme automatically.

My light theme background is #F0F0F0 and my dark theme background is #000000

Therefore it is difficult to find a colour that contrasts well. I want it to be a white icon on dark theme and a black one on light theme.
Thanks :wink:

4 « J'aime »

For automatic icon colour switching based on theme colours – do not specify any value in custom icon color theme setting.

I have now made this default behaviour via:

12 « J'aime »

Brilliant! Thank you @meghna :heart_eyes:

9 « J'aime »

I love this theme-component, and it works great on the home page. However, in some areas of my discourse instance, it shows the default loading spinner. For example, whenever I’m in the admin panel or user settings. @meghna Any way this can be fixed?

1 « J'aime »

Veuillez mettre à jour, cela ne fonctionne plus avec 3.2.0.beta2-dev.

Cela génère une erreur dans la console Chrome @meghna

Je teste cela en utilisant Ubuntu avec le dernier navigateur Chrome, et je reçois l’erreur suivante sur mon site de développement local :

component-templates.js:54 [discourse/theme-10/discourse/templates/components/conditional-loading-spinner] conditional-loading-spinner a été créé avec gjs et son modèle ne peut pas être remplacé. Ignorer le remplacement.

Sur mon site de production, également testé avec le dernier navigateur Chrome sur Ubuntu, je n’ai pas d’erreurs, mais je ne vois pas non plus de spinner de chargement.

Je pense que des changements ont été apportés à la manière dont les modèles sont remplacés dans les thèmes depuis la sortie de ce composant de thème : (not recommended) Overriding Discourse templates from a Theme or Plugin. Je pense que la façon dont Discourse implémente le spinner de chargement a également changé depuis.

3 « J'aime »

@meghna est-ce que cela sera corrigé ou c’est cassé maintenant ? :thinking:

1 « J'aime »

Patientez un peu. L’équipe était à sa réunion annuelle et pourrait avoir d’autres priorités en reprenant le travail cette semaine.

2 « J'aime »

La correction nécessite quelques modifications dans le noyau. Nous y travaillons et nous la corrigerons bientôt.

3 « J'aime »

Merci pour le travail acharné :smiley: :heart:

Ce composant de thème est mis à jour pour fonctionner sur la dernière version de Discourse (avec l’aimable autorisation de @cvx).

4 « J'aime »

Ça ne fonctionne toujours pas pour moi. :confused:

Edit ; Ça fonctionne maintenant après la mise à jour de Discourse aujourd’hui.

Je me demande si je peux utiliser une icône svg à la place de FontAwesome. Merci dans tous les cas.

Ne fonctionne plus avec la dernière version. 3.2.0.beta4-dev

(24532653e6)

Cela me semble bien avec la dernière version :thinking:

Oui, ça fonctionne dans certains endroits, mais pas dans les articles, quand vous cliquez sur un autre article pour le voir. ça ne fonctionne plus.

2 « J'aime »