Is it better to create your CSS as a theme and add it in that way or is it better to add it to a folder and include it in your template?

Is it possible to have css files other than layout, typography and form?

Can you make your own file name, eg. reset.css, and change the init function in page.php to include it, eg. Requirements::themedCSS("reset");?

So far, this last isn't working for me.

Hi there,

If you include Requirements::themedCSS('myawesomestylesheet'); on the init() method (or any other method, actually - as long as it goes on a controller class) then it should work fine.

Then, it will include myawesomestylesheet.css under the current theme.

Make sure you also include parent::init() in the init() methods you create as well.

Cheers,
Sean

Is it better to create your CSS as a theme...

All CSS should be in its own theme. So themes/ mytheme / css / MyCSSFile.css. By default we have layout, typography, form CSS files but there is no restriction on how many you can use!

For example I have a 'standard' library that I use with basic functions (eg reset.css, debug.css, print.css...) in a lib folder inside the css folder. Then at the top of layout.css I have

@import 'lib/reset.css';

Handy way of doing it if you don't want to use Requirements::themedCSS()

Why do all themes require that set of CSS files? It feels like it is arbitrarily forcing a specific style structure (and one that adds some mess when putting together the content). Furthermore, since it requires multiple stylesheets, each one forces an additional http call and further complicates things if we are creating different stylesheets for different media (screen, print, mobile, for instance).

well the reason we use 2 main stylesheets (layout and typography) is so we can use certain styles inside the CMS. Quite often its nice for people to have the same styling on the front end and the backend. Things like headings, paragraphs, links. Now you could put it all in 1 stylesheet and include that in the cms (but then you run the risk of messing up other styles and also its usually a 1000 line file and if you only need heading styles then its a waste) or you could not include typography in the frontend, only the backend and layout only in the front end. Then copy the styles for headings / paragraphs etc from layout to typography (could work but then you do have the overhead of ensuring 2 files are updated and in sync).

Or option number 3 is to trash typography and just use browser defaults for the text area in the backend.

Its totally up to you how many or how little files you use. Our default setup of layout.css / form.css / typography.css is just a recommendation. If you like it, use it. Don't like it then its perfectly easy to change by editing mysite / Page.php -> init()

Why do all themes require that set of CSS files?

They don't. You can set a different fileset in page.php, eg.
class Page_Controller extends ContentController {
function init() {
parent::init();
Requirements::themedCSS("screenStyle", "screen");
Requirements::themedCSS("printStyle", "print");
Requirements::themedCSS("handheldStyle", "handheld");
}
}

Also, as willr has said elsewhere, you can use @import directives to include other CSS files, from other CSS files.

Hope that helps.

Ohh, so layout.css and typography.css are also governing the CMS, I thought only the files in /cms/css were. I'm seeing that now that I'm looking closer at the html source for the backend.
That helps a lot, thanks!

Ohh, so layout.css and typography.css are also governing the CMS

Only typography.css should be. if Layout is included in the cms it might cause some crazy things.