Page 1 of 1
user.css - how to start? (especially for next theme)
Posted: Fri May 08, 2020 4:16 pm
by aisberg
When I started to use s9y I used the "2k11" theme because this was "suggested" by the installation and it looks like some default. And I found this "2k11 user.css generator"
http://yellowled.github.io/
The generator worked fine, I can set the required colors, OK.
But now I am suggested to use the newer "next" theme because the dropdown list on small displays works different from 2k11. When I use the user.css I created for "2k11" on "next" I get my colors on wrong places. So I can't us as generated for 2k11.
I can't find a documentation how to start in general when I want to create my user.css to get my required colors, what should be included, why it works different from 2k11. I can read
that it is possible to use, but not, how.
How can I know what can / should be used in user.css?
How to start?
Should I explore the code of the theme?
How other users create their user.css?
Re: user.css - how to start? (especially for next theme)
Posted: Sat May 09, 2020 3:05 pm
by aisberg
I found out that I need to explore the "style.css" file of the template and that I need to overwrite required elements with my settings in "user.css"
Some more comments in this "style.css" file would be very helpful to understand what entries are related to which elements! Especially for non-Web-Developers who are very seldom in contact with CSS.
So I have to use trial and error to understand which section could be related to which graphical element and then to comment in my user.css like this part:
Code: Select all
/* Das scheint der Text unter der Unterschrift sein */
#identity span {
color: #1e4586;
}
/* Überschriften in den Seiten-Plugins */
.widget h3 {
color: #1e4586;
font-weight: bolder;
}
Re: user.css - how to start? (especially for next theme)
Posted: Sat May 09, 2020 7:07 pm
by Be@t
aisberg wrote: ↑Sat May 09, 2020 3:05 pm
I found out that I need to explore the "style.css" file of the template and that I need to overwrite required elements with my settings in "user.css"
Correct!
aisberg wrote: ↑Sat May 09, 2020 3:05 pmSome more comments in this "style.css" file would be very helpful to understand what entries are related to which elements! Especially for non-Web-Developers who are very seldom in contact with CSS.
Sometimes we have to learn something new to understand the context
. Otherwise we have to take what's offered.
Do you know the "investigate" feature of your browser?
Visit your site, move your cursor to the place you would like to change, click right, choose "investigate"... study... find the related CSS-entry and add this class to your user.css with your desired values. Than test again... That's the way we "non-Web-Developers" learned to customize our themes.
welcome to the club.
Re: user.css - how to start? (especially for next theme)
Posted: Sun May 10, 2020 7:39 am
by aisberg
Be@t wrote: ↑Sat May 09, 2020 7:07 pm
Do you know the "investigate" feature of your browser?
No, I didn't know. What a great feature! Very helpful!!
Re: user.css - how to start? (especially for next theme)
Posted: Sun May 10, 2020 7:51 am
by aisberg
I think this hint is very important and could be included in the s9y documentation, for example here:
https://docs.s9y.org/docs/users/using/themes.html
And a little bit more ideas, what to do to change the theme.
Who manages the s9y documentation? Can users contribute?
Re: user.css - how to start? (especially for next theme)
Posted: Sun May 10, 2020 9:10 am
by thh
aisberg wrote: ↑Sun May 10, 2020 7:51 amWho manages the s9y documentation? Can users contribute?
Yes, of course! That would be wonderful - the documentation needs lot of love.
The whole website (including the documentation) is generated by Github pages and kept in a git repository at
https://github.com/s9y/s9y.github.io. The pages are just markdown files (Github flavored markdown, I think).
If you're familiar with git or Github you can just send a pull request; if not, we will work something out.