Skip to main content
Topic: Default theme queries (Read 2464 times) previous topic - next topic
0 Members and 1 Guest are viewing this topic.

Default theme queries

Hello i have started to learn CSS and try editing the basic theme for my site. Can you help me in getting rid of the arrow which pops up when we hover over Home or Community button and change it to the way it looks in the attachment.

The drop down image is about the query and demo1 is the editing i have done to the default theme.

Re: Default theme queries

Reply #1

The arrow that appears on hover should be in the index.css file, search for the comment
Code: [Select]
Top level subsection indicators.

In the default it will look like:
Code: [Select]
.subsections:hover .linklevel1:after {
position: absolute;
right: .4em;
content: " \25bc";
you can remove that or simply make it content: ""

Be safe, Be kind, Happy Programing

Re: Default theme queries

Reply #2

Thanks Spuds for the help, it solved it :)

Re: Default theme queries

Reply #3


Anything can be improved, need some suggestions.

Re: Default theme queries

Reply #4

Elkarte team always recommend to use custom.css file to re-design a theme. My question is if i use it, how i can make the theme use the custom.css file instead of the original css file?

Re: Default theme queries

Reply #5

Actually, it's not entirely correct: we suggest to use custom.css (or custom_name-of-the-variant.css) when you want to tweak the theme (e.g. colors, small positioning, etc.) and you don't have to re-distribute the result (i.e. you just want to use it yourself).
Of course, if you want to completely redesign the theme, then starting from an empty canvas is probably easier (depending how you are proficient with CSS, I would never dare to start from zero xD).

The custom.css is used alongside the normal one.
Since CSS has priority rules, custom.css is loaded after the normal ones[1]and you can then change what you need without having to re-do everything.

That said, if there is a file named "custom.css" in the same directory of the index.css, ElkArte will automatically pick it and use is in addition to the index.css.
Same goes for the variants, so if in default/css/_besocial/ there is a file named custom_besocial.css, this one will be picked and used together with index_besocial.css.
Actually, in 1.1 the loading is a little tricky because of a... let's call it bad design, it was a mistake on my side when I changed it, but there is always the "!important" that can be added to override everything, so it's not entirely impossible to bend the system
Bugs creator.
Features destroyer.
Template killer.

Re: Default theme queries

Reply #6

@emanuele thank you so much for the explanation. Let me work with redesigning the existing theme rather than starting from zero. I am very bad in css.