☁️ Discourse Air Theme

[Titi]

Hello,

How can I change the size of the welcome message please ?

If find it we have just to modify the CSS with a suitable size:

.custom-search-banner-wrap h1 {
    font-size: 3em;
}

@yhmtsai

Hi, I use Air Theme with Topic List Thumbnails Theme Component - theme - Discourse Meta

Hello @jordan-vidrine
I use Air Theme with Topic List Thumbnails Theme Component - theme - Discourse Meta with the list mode & Air Theme. It works good but I’ve an issue I didn’t find how to resolve it.
I filled in the field desktop category page style to :
categories and recent topics

On the home page I have the categories ok but under the categories, the recent topics appear with a default template. And I would like to have the thumbnails with list mode instead.
How can I proceed please ?

For information the thumbnails with list mode works well inside the categories.

[jordan-vidrine]

I do not believe that component is compatible with the topic list generated on the categories with recent topics page. All of the “Categories with…” pages are their own special template that this component will not affect.

[KCAS]

Hello,

I have an issue with [Double boxes bug “Modern Category + Group Boxes” Subcategories]. Any ideas how to fix ? (Double boxes bug "Modern Category + Group Boxes" Subcategories)

Double boxes bug "Modern Category + Group Boxes" Subcategories

Hello, When using the “Modern Category + Group Boxes” component, in theme Air. By default it won’t show sub catergory boxes. There is a specific setting for this within the category > Settings > “Show subcategory list above topics in this category.”. However, when this is enabled it shows both the “Modern Category + Group Boxes” and the default ones, instead of just the modern ones. Top ones are modern. bottom are the original. [image]

[jordan-vidrine]

@KCAS

I have an issue with [Double boxes bug “Modern Category + Group Boxes” Subcategories]. Any ideas how to fix ? (Double boxes bug “Modern Category + Group Boxes” Subcategories)

This has been fixed

[dschwerin-teachforau (Danielle Schwerin)]

Can we edit the Category abbreviations in the boxes (as circled in this image)?

We’d really like to be able to update those abbreviations, as we have many categories with similar names (the names are iterations based on class/grade years), so they’re getting similar abbreviations. Also the abbreviations aren’t very meaningful for our community.

[tynaut (Ty Correll)]

@dschwerin-teachforau

We’d really like to be able to update those abbreviations, as we have many categories with similar names (the names are iterations based on class/grade years), so they’re getting similar abbreviations. Also the abbreviations aren’t very meaningful for our community.

You can replace the abbreviations with images:
Click the category → wrench icon → Images

And if you want to hide just abbreviations, you could create a component and apply something like the following css:

.custom-category-boxes:not(.above-discovery-categories-outlet) .category-box .category-box-inner {
    .category-logo.no-logo-present {
        display: none;
        
        & + .category-details {
            grid-column: 1/3;
            padding: 1em 1.5em;
            width: 100%;
        }
    }
}

Before:

After:

[digitaldominica]

Hi @jordan-vidrine How can I show subcategories in the modern category box? I selected boxes and sub categories but I don’t see it showing up? Was this option not added to the component?

[jordan-vidrine]

They are hidden by default, to show them, you will need to unhide them via custom CSS in a theme component.

[digitaldominica]

Thanks, I found that out after I forked the repo. My issue is resolved.

[Kevin7 (Kévin .)]

Hello @jordan-vidrine, first of all congratulations for your theme which is very nice to use, however I’m new to discourse and I don’t know it very well but I want to add css but I can’t find the button to add custom css? Should I add a plugin to do this because on the default theme I could do it directly in the theme? Thank you in advance

[jordan-vidrine]

You can find info on how to customize your Discourse here → Beginner's guide to using Discourse Themes

[ErlendMS (Erlend Markussen Saltnes)]

I’m one more person who likes the theme, and starts my question by saying “thanks” and “well done”!

My question is: Is there a way to set default dark mode colour pallet?

Here’s what it looks like (with some bad Norwegian translation, sorry) where I’ve set the default theme, which is a light mode:

I’ve made custom pallets for light and dark mode (which are enabled as user selectable, and that works), but I can’t deactivate Air-Light and Air-Dark. And when I go to the site in Incognito with dark mode enabled on the device, I get served Air-Dark.

---

Oh, and another question: Where is the Dark Light Scheme Toggle supposed to be?

Clicking the profile pic top right gives me this when I’m logged into a test user:

And this when logged in as admin:

Here’s a link to my site, which is very much not done, if it helps to take a look. Thanks!

[jordan-vidrine]

@ErlendMS

I’ve made custom pallets for light and dark mode (which are enabled as user selectable, and that works), but I can’t deactivate Air-Light and Air-Dark. And when I go to the site in Incognito with dark mode enabled on the device, I get served Air-Dark.

Did you follow these guidelines?

@jordan-vidrine

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.

@ErlendMS

Oh, and another question: Where is the Dark Light Scheme Toggle supposed to be?

This topic is for the dark light toggle component installed on the air theme. It should help you there. You can set it to be in the sidebar or the header.

Dark/Light Mode Toggle

Summary Dark/Light Mode Toggle adds a clickable toggle color scheme button in the hamburger menu. The toggle switches between a light or dark color scheme for one theme. Repository Link https://github.com/discourse/discourse-color-scheme-toggle New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component This component allows a dark/light mode toggle icon on your Discourse forum. It will also au…

[ErlendMS (Erlend Markussen Saltnes)]

Yes, the user can choose light and dark mode fine. What I’m working on is what a new user would see. The default before choosing.

If a new user comes to the site, and has light mode on the device, they get the pallet I’ve set in the screenshot. But if they have dark mode on the device, they get Air-Dark. That’s what I want to change.

---

Thanks for the link to the component! I didn’t realise it was a separate component.

[jordan-vidrine]

@ErlendMS

But if they have dark mode on the device, they get Air-Dark. That’s what I want to change

What do you want to show for users in dark mode?

[ErlendMS (Erlend Markussen Saltnes)]

Ok, so I have four pallets installed/activated:

• Mine-Light
• Mine-Dark
• Air-Light
• Air-Dark

(I’d like to be able deactivate the last two, but that’s a separate issue. They’re nice! But I’m making a forum for a football (soccer) team, and have made pallets that correspond to the kit colours. )

I have been able to set Mine-Light as the default pallet - so if a new user goes to the site with light mode on their device, they get served that.

But here’s the problem: If a new user goes to the site with dark mode on their device, they get served Air-Dark. And I want it to be Mine-Dark. (To get that now, they must manually select it in settings.)

[jordan-vidrine]

What scheme do you have set here? → admin/site_settings/category/all_results?filter=dark%20mode

[ErlendMS (Erlend Markussen Saltnes)]

Ooh, setting my preferred scheme there worked - thanks!

A bit weird that I could only set default dark mode there (Site settings ➔ Basics), though - and only set default light mode in the theme settings.

I’d consider adding a little note, preferably with a link, under where you set the light mode in your theme settings. Something like:

This sets the default light mode pallet for your theme. Click here to set default dark mode./Go to Site settings ➔ Basics, to set default dark mode.

---

BTW., I’ve been having some fun with some transparecy and blur and your theme. (It gave me some z-index troubles, though - probably due to my noobness, which I’m still working out kinks with.) I especially liked how it gave the background swoosh some more weight!

Take a look if you want! (Still early days, though - as I assume you can see.)

[Wayne_Hsu]

Hi there, this is Wayne Hsu from Niantic, Inc.
We are building our forum for 8thwall.com with Discourse Air Theme with custom color palette. And for some reason in the mobile view, the background of the main content container for the categories page (div id: main-outlet) is completely transparent and alpha is set to 0. I don’t see a way to update the color/alpha of the background.
I saw someone has a similar issue before
☁️ Discourse Air Theme - #187 by hequaye

And a suggestion was to change “desktop category page style” to something else in the settings (currently it’s set to Categories and Latest Topics), but I don’t see it’s helping as it’s setting for desktop view only.
Any thoughts on a solution on this?
Thanks!

[jordan-vidrine]

@ErlendMS

Take a look if you want! (Still early days, though - as I assume you can see.)

Looks pretty nice!