Features
A modern theme with a hint of mint.
Homepage (categories)
Latest
Topic
Advanced Search
This theme includes following components:
Tips
Discourse Settings
Following setting changes are required for this theme to render properly:
top menu
needs to be set to category, latest, new, unread, top
desktop category page style
needs to be set to Boxes with Subcategories
Discourse Search Banner
In the options for the discourse-search-banner
theme component, following changes are required for this theme to render properly:
show-on
options needs to be set to homepage
plugin-outlet
options needs to be set to above-main-container
background image
can be set as per your requirement
Discourse Showcased Categories
In the options for the Showcased Categories
theme component, following changes are required for this theme to render properly:
select the feed one category
and feed two category
as per your requirement
fill in the feed one title
and feed two title
as per your requirement
recommended value for max list length
is 3
.
Let me know how this theme can be further improved. Enjoy!
Hosted by us? Themes are available to use on our Standard, Business, and Enterprise plans.
Last edited by @JammyDodger 2024-06-17T20:58:09Z
Check document Perform check on document:
63 Likes
IAmGav
(Gavin Perch)
September 7, 2021, 12:30pm
2
really nice theme
I might even test it out with royal blue (my favourite colour) on my test site.
Thank you
5 Likes
P2W
(Mike Riddick)
September 10, 2021, 4:27pm
3
@meghna churning out the amazing themes. Looks great. I will deploy and play.
5 Likes
Beautiful theme! Thank you for creating this
I was wondering if it was a way for me to remove the square and circle in the background? Appreciate anything that can point me in the right direction
2 Likes
tjot
(Tomasz)
September 14, 2021, 11:14am
5
remove
#main-outlet:after {
content: "";
display: block;
position: fixed;
z-index: -1;
width: 500px;
height: 500px;
border-radius: 2000px;
background: $color-blue;
right: 1px;
top: -57px;
}
#main-outlet:before {
content: "";
display: block;
position: fixed;
z-index: -1;
width: 300px;
height: 300px;
border-radius: 30px;
background: -webkit-linear-gradient(146deg, rgba(74,247,255,.08) 55%, rgba(143,236,202,.52) 100%);
// background: linear-gradient(146deg, rgba(74,247,255,.08) 55%, rgba(143,236,202,.52) 100%);
background: linear-gradient(4deg, rgba(143,236,202,.29) 55%, rgba(74, 247, 255, 0.08) 100%);
left: 70px;
top: 350px;
transform: rotate(74deg);
transform-origin: 0 100%;
}
from desktop.scss
and you should be good to go
6 Likes
Thank you so much Tomasz, appreciate it
2 Likes
This theme is awesome. Thank you for making this! I’m new to the Discourse scene. I know how to upload this theme, but I’m not sure how to change certain things. What I want to change are the colors of the blocks in the back (the circle and square). Additionally, I would like to change the background color. Do I download the theme file and edit it there, then create my own theme? Or is there an easier way?
2 Likes
meghna
(Meghna Jalan)
October 18, 2021, 9:27am
8
Thanks!
Yes. To change the colors you need to fork the theme and update the color code as per your requirement. Here’s how you can do it:
In variables.scss
change the color code as per your liking:
$color-blue: #e5f8ff;
$color-square-gradient: linear-gradient(4deg, rgba(143,236,202,.29) 55%, rgba(74, 247, 255, 0.08) 100%);
$color-square-webkit-gradient: -webkit-linear-gradient(4deg, rgba(143,236,202,.29) 55%, rgba(74, 247, 255, 0.08) 100%);
To change the background color update the secondary
color in about.json
(note that this will also change text color of some buttons):
"secondary": "F6FBFC"
I love this theme - it fits our project’s branding perfectly! However, if I turn on dark mode, the theme is messed up. Is this to be expected? Is there a way to prevent users from turning on dark mode?
1 Like
It would also be great to be able to edit the CSS from the front-end, like with the default themes.
CvX
(Jarek Radosz)
December 4, 2021, 12:54pm
12
There are two small issues with the composer. The gear button has an always-on background, and the first button’s on-hover shape doesn’t match the curvature of the frame:
1 Like
meghna
(Meghna Jalan)
December 6, 2021, 11:31am
14
Fixed both the issues via:
committed 11:29AM - 06 Dec 21 UTC
2 Likes
Pika
(Patrick)
December 7, 2021, 8:02am
15
I really like your theme and installed it.
My search banner background is not with rounded corners and full width.
How can I change this to your layout ?
meghna
(Meghna Jalan)
December 7, 2021, 3:27pm
16
There might be a possibility that another theme or component is interfering with the mint theme styling. Can you try disabling other themes/components that you may have installed?
Pika
(Patrick)
December 7, 2021, 3:32pm
17
it’s a clean install with inactieve Default theme and only these componets:
discourse-search-banner
Showcased Categories
meghna
(Meghna Jalan)
December 7, 2021, 4:27pm
18
That is odd. Can you PM me the URL of your Discourse instance and I can have a look?
1 Like
meghna
(Meghna Jalan)
December 9, 2021, 5:01pm
19
3 Likes
Hi, I played with dark mode on device with nice Mint theme. I made some changes to support dark mode. Just for tests.
discourse-mint.zip (5.1 KB) It may contain mistakes of course For this reason I won’t create a PR from github .
I made some modifications for blocks of code, gitlab-style formatting, wide page etc… Mobile device did not test.
1 Like
meghna
(Meghna Jalan)
December 17, 2021, 3:28pm
21
Thank you for the efforts here Ivan! I reviewed your work and there are some custom changes that does not need to be in the core. I’ll look into the dark mode specific changes and will make them in core after some more testing.
1 Like
You are welcome, Meghna! I think, it would enough to apply revert
value to some elements with white.
1 Like