Thème aérien

[Discourse]

	Summary	Air Theme is a clean & modern theme with a handful of theme components included to enhance your forum!
	Preview	Preview on Discourse Theme Creator
	Repository Link	https://github.com/discourse/discourse-air
	New to Discourse Themes?	Beginner’s guide to using Discourse Themes

Install this theme

As this is an official theme maintained by the Discourse team, support issues, bug reports, ux suggestions, and requests for dev advice can be made in the respective categories here on Meta, and tagged with the appropriate theme tag. Click on a link below to get one started.

 Support  Bug  UX  Dev

Features

Light Mode

Dark Mode

Categories Page

This theme includes a handful of components to enhance your forum as well.

• Dark Light Scheme Toggle
• Clickable Topics
• Discourse Search Banner
• Modern Category + Group Boxes

Please read through these tips upon installation, as there are a couple of settings that NEED TO BE ENABLED for this to theme to render properly.

---

Tips

Dark Light Scheme Toggle

For this to work properly, at least 2 color scheme choices need to be enabled in your https://discourse.jordanvidrine.com/admin/customize/colors area. At least two colors need to have color scheme can be selected by users enabled.

Once this is done, users should be able to choose between two color schemes as their light and dark preferences in their user preferences interface menu.

---

Discourse Search Banner

In the options for the discourse-search-banner theme component, the plugin-outlet options needs to be set to BELOW-SITE-HEADER for this theme to render properly.

---

Modern Category + Group Boxes

This theme component requires your categories to use the CATEGORY BOXES WITH SUBCATEGORIES setting in your /admin/site_settings/category/all_results?filter=categories area.

This theme component also allows the forum admin to organize their category page with header titles, and choose which categories appear under each header. To keep things simple, I have only allowed up to 5 headings to be used. If no categories + heading settings are chosen, all categories will render as they do above, this is the default rendering option.

Hosted by us? Themes are available to use on our Standard, Business, and Enterprise plans.

Last edited by @JammyDodger 2024-06-17T20:44:16Z

Check document

Perform check on document:

[Don]

That is just amazing Jordan! I love it!

[th21]

It will be helpful if the welcome message can be hide when left locale field empty

[oshyan (Oshyan Greene)]

Oh wow, this looks really nice! Thank you for the share.

[itsbhanusharma (Bhanu Sharma)]

This theme gives discourse the modern look it deserves. Very well done @jordan.vidrine

[Ahmed_Gagan]

Theme looks amazing. Awesome work

[thegurjyot (Gurjyot Singh)]

This theme looks so amazing. Hope we can get this category page design as a separate component as well. It is looking way better this way.

[frold]

Thanks it is nice…

First time I install a new theme. I really like this one!!

Studmed.dk

[Jeremie_Leroy]

Hi @jordan-vidrine regarding the # of views column, what kind of code shall i add in the component to override that column being hidden ?

[jordan.vidrine]

I believe this should work:

.full-width .contents .topic-list thead th.posts {
width: 10%;
}

.full-width .contents .topic-list thead th.activity {
width: 10%;
order: 4;
}

th.num.views {
width: 10%;
order: 3;
display: block;
}

.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.posts {
width: 10%;
order: 2;
}

.topic-list .views {
width: 10%;
order: 3;
}

.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.age {
width: 10%;
order: 4;
}

[ggurbet (Gökhan Gurbetoğlu)]

Refreshingly beautiful. Great work @jordan.vidrine!

[ShubhayanS (shubhayan saha)]

Est-il possible de modifier le texte de l’en-tête « Bienvenue sur le forum » ?

[jordan.vidrine]

Oui, cela peut être modifié dans le composant Discourse Search Banner

[Jerdeman (Jeroen)]

Il y a quelque temps, j’ai signalé un problème d’affichage des catégories en vue mobile (Air Theme - #172). J’ai échangé un peu avec @jordan.vidrine, mais nous n’avons pas réussi à trouver la cause du problème. J’espère que quelqu’un d’autre aura des idées.

Pour les détails
En utilisant une installation propre de Discourse 2.7.11 sur kubernetes avec l’aide d’un helm chart de Bitnami, et la dernière version du thème installée et configurée comme mentionné dans le premier post, nous ne voyons aucune catégorie en vue mobile et le style est incorrect sur la dernière page.

Ce que nous avons essayé
Outre l’utilisation d’une installation propre, nous avons également tenté d’utiliser d’anciennes versions du thème. Le problème est cependant resté, mais nous n’avons pas essayé toutes les versions de manière exhaustive.
Nous avons également comparé le HTML de notre instance avec celui de discourse.jordanvidrine.com , et avons remarqué qu’il est significativement différent.

Intuition
Comme nous ne pouvons pas utiliser une version ‘bêta’, mon intuition me dit qu’il s’agit d’un problème de compatibilité entre le thème ou l’un de ses plugins et Discourse 2.7. J’aimerais savoir si quelqu’un a ce thème qui fonctionne sur la version 2.7, et si oui, avec quelles versions du thème et des plugins pertinents.

Question
Quelqu’un a-t-il réussi à faire fonctionner ce thème avec la version 2.7 et/ou y a-t-il des indices sur ce que nous pourrions faire pour que cela fonctionne ?

[Hyeonji_Kim]

Salut. Tout d’abord, merci pour ce super thème

Je veux changer la police de caractères, comment puis-je le faire.

J’ai essayé ceci

• télécharger ce thème Google Fonts, et changer le paramètre de police dans PARAMÈTRES DU SITE –\u003e Ne fonctionne pas

• ajouter le code @import{lien vers la police web ~~~ } dans Desktop.css, mobile.css –\u003e Ne fonctionne pas

Quel fichier dois-je modifier pour changer la police ???

[jordan.vidrine]

Je pense que vous devriez pouvoir définir une police personnalisée sans composant ici : admin/site_settings/category/all_results?filter=font

Si vous souhaitez plus de personnalisation, je pense que le composant de thème Google Fonts que vous avez lié fonctionnerait. Cependant, le thème utilise des theme-settings et non un paramètre de site, je crois.

Avez-vous soulevé ce problème dans le sujet de ce composant de police ?

[hequaye (Henry Herbert)]

Bonjour à tous, quelqu’un peut-il m’aider à modifier la taille et la « nature fixe » de la couleur d’arrière-plan sur mobile ?

Le CSS pour mobile est transparent de mon côté. Et j’ai juste besoin d’un peu d’aide pour changer l’arrière-plan fixe pour les couleurs d’arrière-plan.

Si je ne me trompe pas, il y a un arrière-plan d’en-tête et un arrière-plan de page, n’est-ce pas ?

[jordan.vidrine]

Ceci est dû au fait que le thème et ses composants inclus sont assez exigeants quant à la manière dont le site est configuré.

Dans le message original, j’ai partagé que :

@jordan-vidrine

Catégories modernes + boîtes de groupe

Ce composant de thème nécessite que vos catégories utilisent le paramètre BOÎTES DE CATÉGORIE AVEC SOUS-CATÉGORIES dans votre zone /admin/site_settings/category/all_results?filter=categories.

Ce composant de thème permet également à l’administrateur du forum d’organiser sa page de catégories avec des titres d’en-tête et de choisir les catégories qui apparaissent sous chaque en-tête. Pour simplifier, je n’ai autorisé que jusqu’à 5 en-têtes. Si aucun paramètre de catégories + en-tête n’est choisi, toutes les catégories s’afficheront comme ci-dessus, c’est l’option d’affichage par défaut.

[Nerd_Alert]

Y a-t-il un moyen de faire de l’image l’arrière-plan ? Je préférerais une image aux couleurs. L’utilisation de

body {
    background-image: url("url de l'image ici");
    background-color: #cccccc;
}

fait de la partie supérieure de la couleur l’image, mais pas de la partie inférieure.

[jordan.vidrine]

Ce que vous avez fait est bien pour ajouter l’image, mais vous voudrez également supprimer le tracé de détourage qui est créé pour donner cet effet de superposition.

html .background-container {
clip-path: unset;
}