Alex_Tramp
(Alex Tramp)
October 25, 2020, 6:33pm
1
Hello, community!
I recently installed discourse and want to customize the appearance
But I do not know how to select groups of sections with indents from other sections, as well as how to make a list of subsections in one column.
I looked at the settings in the admin panel, but I didn’t find anything similar that could help me.
I will be glad of any help.
I recently started studying this platform.
Thank you!
Alex_Tramp
(Alex Tramp)
October 26, 2020, 7:07am
2
For example, to make a list of subsections into a single column, I need to change the values here (category-list.scss)
To these values
But how can I do this correctly through the admin panel without changing the files themselves on the server?
display: block;
align-items: baseline;
margin-right: 0;
1 Like
Alex_Tramp
(Alex Tramp)
October 26, 2020, 8:06am
3
I understood correctly - what should be done like this?
Is this the correct way to solve the problem?
riking
(Kane York)
October 26, 2020, 8:27am
4
That is the default CSS for subcategories. Simply assign a “Parent Category” in the category edit dialog, and set the subcategory and parent category to have the same color.
1 Like
Alex_Tramp
(Alex Tramp)
October 26, 2020, 8:37am
5
I don’t really understand what the color has to do with it.
By default, subcategories are displayed as follows: one after the other, horizontally
After applying the css that I specified above, the subsections line up in a vertical position as I wanted.
I just wanted to know-adding css in the form I indicated-through the admin panel-is this the right way?
And the second main question is how to make the sections themselves separated from each other by indents, as in the example of the screenshot from The Amazon forum?
1 Like
riking
(Kane York)
October 26, 2020, 9:55am
7
Ah, I see.
The correct thing to do is to place this CSS into a theme component, which is only slightly different from what you are doing!
If you edit the Light theme, the changes will not be visible on the Dark theme.
Create a single theme component for all your site local customizations!
This is a crash course in Discourse theme basics. The target audience is everyone who is not familiar with Discourse themes. If you’ve already used Discourse theme / theme components, this guide is probably not something you need to read.
What are themes and theme components?
A theme or theme component is a set of files packaged together designed to either modify Discourse visually or to add new features.
Let’s start with themes.
Themes
In general, themes are not supposed to be compatible …
4 Likes
Alex_Tramp
(Alex Tramp)
October 26, 2020, 2:19pm
8
Thank you for the advice, about what is better to allocate it as components
If we talk about a specific example Amazon Seller Forums - it’s not just about css, their markup also differs from the standard one (html)
How to quickly organize the same display?
Unfortunately, I have a superficial knowledge of layout, I am a backend developer, so layout is difficult.
Can I transfer this layout without changing the code of the source files themselves?
Alex_Tramp
(Alex Tramp)
October 27, 2020, 4:40pm
9
I looked through a lot of different ready-made themes
But most of them are similar to each other, and such a concise as Amazon-not found. Maybe we can do it together with the community? It looks more concise with indents between sections
Their markup is different partiall because they haven’t appeared to update their site in quite a while
Adding this CSS gets you most of the way there with the subcategory style…
.category-list .subcategories .subcategory {
display: flex;
}
If you want to make markup changes, you’ll have to start looking into how template overrides in Discourse work… that’s in the advanced section of Developer’s guide to Discourse Themes