Air Theme

[Steve_Emerson]

Yeah just the mobile docs, so not too much of an issue. Would be nice if it was fixed eventually though.

Thanks for digging into this

[simon]

@Steve_Emerson

Would be nice if it was fixed eventually though.

The problem seems to be here:

discourse/discourse-air/blob/main/mobile/mobile.scss#L14

I thought it might be possible to fix the issue by just adding some CSS to a theme component, but it’s turning out to be a tricky problem because the main docs page doesn’t add a CSS class to the body tag. That means that it’s not enough to just use this. It fixes the issue on individual docs topics, but not on the docs topic list:

html body.archetype-docs-topic #main-outlet {
  border-radius: 0px !important;
  width: calc(100% - 3em) !important;
  background-color: var(--secondary) !important;
  margin-bottom: 0px !important;
}

I suspect the fix will require small changes be made to both the docs plugin and the air theme. I’ll follow up on this with the team. It should get fixed fairly soon.

[Steve_Emerson]

Appreciate you looking into this, thank you

[simon]

@jordan-vidrine

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

Just adding a note here that the Loading Slider and Dark Light Scheme Toggle have been removed from the theme component:

discourse/discourse-air/blob/main/about.json#L5-L9

I’ve removed the reference to the Loading Slider from the OP. Should the Dark Light Scheme toggle be removed as well, or is there a similar component that works with the sidebar that should get added?

[jordan-vidrine]

I believe this component works with the sidebar now. There is a setting to set it to be either in the header, or in the sidebar.

[erikds (Erik)]

Hi folks, great theme. I have a minor nit with the border radius on the .nav-pils:not(.user-nav)>li>a selector, causing an inconsistent pointy border on the active tab:

setting the bottom border radii to 0 fixes this. would you be open to a PR, or am I missing something?

Edit: since it was only a few lines I went ahead and made a PR here.

[erikds (Erik)]

Sorry, one more nit - wondering if this is a similar issue using the events plugin:

[cmahns (Colin Mahns)]

Looks like there’s a slight CSS hangnail when opening up the Threads pane in Chat when using it in full screen. Right hand side by the X button for threads:

[jenmck (jen)]

@imgh05t

Thanks, that worked! But what about displaying sub-categories? This code isn’t working for some reason

.category-boxes .subcategories {
    display: flex !important;
    flex-flow: wrap;
}

Wondering if anyone might have a solution for this, to show the subcategories in the category box?

[Heliosurge (Dan DeMontmorency)]

Hi @jordan-vidrine modern category boxes said update was available. Now displays blank page after update.

Tests Passed

Fixed after upgrading Docker & Discourse. Though update was not showing required.

[wizible]

I would like to remove the gradient from the background discourse-search-banner so that it is only one color.
I have already read the article Beginner's guide to using Discourse Themes.
However, I am missing the Edit HTML/CSS button. I get the message “If you want to edit this theme, you must submit a change on its repository”.

How can I make CSS/HTML changes to the Air theme + components?

Thanks

[jordan-vidrine]

This post describes how you would add/edit your own CSS to affect the theme.

Discourse Air Theme

Installing your own theme-component and attaching it to the theme should work. You will want to add this line into the css of the theme component. .custom-category-boxes .description { display: none; } To install a custom theme component you will go to /admin/customize/themes click Install then click Create New. From there you will be taken to the new component’s page, where you will select which theme you want it to be included on. You can then click Edit CSS + Html and add the code I s…

[wizible]

First of all I wish you a happy birthday.
Secondly, I would like to thank you for your answer.

I have looked at it again. But as I said before. I don’t have a button “Edit HTML/CSS” in the Air Theme. In the default theme I have the button.

[jordan-vidrine]

@wizible

First of all I wish you a happy birthday.
Secondly, I would like to thank you for your answer.

You’re very welcome!

You first need to create your own theme component from the theme component menu. Then you need to enable that theme component on the air theme.

From there, the css/html changes you make in your new theme component will apply to the air theme.

[wizible]

Aaah ok. Now I understand. So like WordPress, it’s a child theme, right?

I have to keep all the original components too, right?

[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.