This page is a very rough draft
About themes
- main theme "Clean"
- additional themes like "WebbPlatsen"
- located at
themes/*
- individual for each user
- restrict "edit own profile" to enforce a theme
How CSS is used in streber
- To see how much is done with CSS, you can switch the theme off. If you are using Firefox, go to "View > Page Style > No Style". As you can see, there is almost no formatting at all. With some knowledge of CSS you could completely rebuild the interface to a different look and layout. E.g. Navigation on the left side, instead on the top of the page.
- There are no <Table>s being used (except from lists)
- Most html-elements have a unique class-attribute to allow formatting
Creating a new theme
There a two ways of creating a new theme:
- Use the custom-theme and overwrite settings.
- Duplicate one of the existing themes and start adjusting the css code
Creating a custom theme
In
themes/custom/* you find the framework of a theme that completely includes the
Clean theme. This allows you to add any adjusting css-code after the
@import statements in the respective css-files.
Although this slightly increases the download size and sometimes requires to look inside the Clean theme for how things are done there, it gives you a fast and easy solution to quickly adjust things like colors, font families, background images, etc.
Creating a new theme from a copy
If you build your own theme from a copy of another theme, you need to be aware, that the html structure of streber changes over time. Since
develops with the clean theme, this one will always work. But it requires you — as the author of a theme — to check for changes between the different streber versions (e.g. the changes made to
clean/theme.css) and adjusting your theme respectively.
More on CSS
Web Developer tools for Firefox
This extension will tremedously speed up your styling. E.g. it allows you click on an element and lists where in which css-files and which lines this style is defined.
can't do anything without this tool.
Suggested reading
Please Edit Description instead of adding comments.