Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
67 changes: 36 additions & 31 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,64 +1,69 @@
<!-- Describe this theme/component in one or two sentences -->

A clean & modern theme with a handful of theme-components included to enhance your forum!

<!-- Add screenshots (if applicable) -->
A clean & modern theme with a couple of theme components included to enhance your forum!

**Light Mode**

![image](https://user-images.githubusercontent.com/5862206/214545439-85410d82-9565-4e00-8b23-b2d69a0ee1eb.png)
![light mode](screenshots/light.webp)

**Dark Mode**

![image](https://user-images.githubusercontent.com/5862206/214545506-f44d6165-4f79-416e-a89c-548482d04cea.png)
![dark mode](screenshots/dark.webp)

**Categories Page**

![image](https://user-images.githubusercontent.com/5862206/214545568-76d38925-55a6-4359-b1c6-bf1010706132.png)

This theme includes a handful of components to enhance your forum as well.
![categories page](images/categories-page.webp)

- Dark Light Scheme Toggle
- Clickable Topics
- Discourse Loading Slider
- Discourse Search Banner
- Modern Category + Group Boxes
This theme includes a couple of theme components to enhance your forum, as well:

> :exclamation: 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.
- [Clickable Topics](https://meta.discourse.org/t/clickable-topic/183339)
- [Modern Category + Group Boxes](https://github.com/discourse/discourse-minimal-category-boxes)

---

# Tips
## Theme configuration

### Dark Light Scheme Toggle
> :exclamation: Please follow theme configuration tips upon installation, as there are a couple of settings that **NEED TO BE ENABLED** for this to theme to render properly.

![image](https://user-images.githubusercontent.com/5862206/214545622-af847fa5-b4ae-4308-9fe2-ddd66eb62cc8.png)
### Dark Light Mode 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.
![toggle dark light mode](images/toggle-dark-light-mode.webp)

![image](https://user-images.githubusercontent.com/5862206/214545647-e0544474-b6bf-4b9c-8c64-6a8bfa6ba83a.png)
The mode toggle (image above) will be shown at the bottom of sidebar, once at least 2 color palette choices are enabled on the **Color palettes** admin page (`/admin/config/colors`). At least two colors need to have `Color palette 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.
![color palettes](images/color-palettes.webp)

![image](https://user-images.githubusercontent.com/5862206/214545707-170a6b88-8ccd-4d31-af59-f0834a4fad3c.png)
Once this is done, users should be able to choose between two color palettes as their `light` and `dark` preferences in their user preferences interface page (`/my/preferences/interface`):

---
![user interface preferences](images/user-interface-preferences.webp)

## Discourse Search Banner
### Edit Theme

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.
Go to **Admin > Themes & components** (`/admin/config/customize/themes`) page to edit Air theme.

![image](https://user-images.githubusercontent.com/5862206/214545774-ed8f1322-9a95-4958-bba0-adf7ff6dea3f.png)
- in **Dark color palette** dropdown select `air-dark`

---
![theme dark color palette](/images/theme-dark-color-palette.webp)

## Welcome Banner

Go to **Admin > Welcome banner** (`/admin/config/welcome-banner`) page.

- in **Enabled on themes...** dropdown select `Air Theme`

![welcome banner themes](images/welcome-banner-enable.webp)

- in **Location** dropdown select `Below site header`

![welcome banner location setting](images/welcome-banner-location-setting.webp)

## 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.
Go to **Admin > Interface & layout** (`/admin/config/interface`) page.

- in **Desktop category page style** dropdown select `Boxes with Subcategories`

![image](https://user-images.githubusercontent.com/5862206/214545903-c4bd61b9-1893-48e0-84e7-502efc26c46d.png)
![desktop category page style](images/desktop-category-page-style.webp)

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

---

Expand Down
8 changes: 4 additions & 4 deletions about.json
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
{
"name": "Air Theme",
"authors": "Discourse",
"about_url": "https://meta.discourse.org/t/discourse-air-theme/197703",
"license_url": "https://github.com/discourse/discourse-air/blob/main/LICENSE",
"components": [
"https://github.com/jordanvidrine/discourse-category-group-boxes.git",
"https://github.com/discourse/discourse-clickable-topic.git",
"https://github.com/discourse/discourse-search-banner.git"
"https://github.com/discourse/discourse-minimal-category-boxes.git",
"https://github.com/discourse/discourse-clickable-topic.git"
],
"modifiers": {
"serialize_topic_excerpts": true
Expand Down Expand Up @@ -39,5 +39,5 @@
"hover": "535353"
}
},
"screenshots": ["screenshots/light.png", "screenshots/dark.png"]
"screenshots": ["screenshots/light.webp", "screenshots/dark.webp"]
}
Binary file added images/categories-page.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/color-palettes.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/desktop-category-page-style.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/theme-dark-color-palette.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/toggle-dark-light-mode.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/user-interface-preferences.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/welcome-banner-enable.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/welcome-banner-location-setting.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion locales/en.yml
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
en:
theme_metadata:
description: "A clean and modern theme for Discourse"
description: "A clean and modern theme for Discourse."
Binary file removed screenshots/dark.png
Binary file not shown.
Binary file added screenshots/dark.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed screenshots/light.png
Binary file not shown.
Binary file added screenshots/light.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.