How are stylesheets set up in default theme?

A forum for Bolt related questions / issues

How are stylesheets set up in default theme?

Postby Stark Raving » Sun Jan 26, 2014 8:00 am

I have been trying to change the background and color of the menu in a copy of the default theme. The css file "foundation.min" is like one impossibly long, and unreadable sentence. This is so hard to edit! Although the "foundation.css" has the normal indentations for easy reading, it is not declared in the header? Duh? What am I missing?

I can't imagine why there has to be 3 css files I need to edit (the third being app.css). Can someone explain the whys and hows of the stylesheets' setup? I'm sure there's a good reason why.

Thanks.
"After I'm dead I would rather have people ask why I have no monument than why I have one." ~ Cato the Elder

"In heaven all the interesting people are missing." ~ Friedrich Nietzsche
User avatar
Stark Raving
Silver Sponsor
 
Posts: 115
Joined: Tue Dec 11, 2007 9:24 pm
Location: Vancouver

Re: How are stylesheets set up in default theme?

Postby ningus » Sun Jan 26, 2014 10:59 am

My understanding is, that bolt's base-2013 theme is based on the Foundation front-end framework, both foundation.css files are part of that framework, containing some reset styles, styles for print and screen sizes (i.e. mobile devices). You ususally don’t need to edit these files. The only file you should edit is in fact app.css.
Last edited by ningus on Mon Jan 27, 2014 9:21 pm, edited 1 time in total.
ningus
 
Posts: 33
Joined: Fri Jun 21, 2013 4:05 pm
Location: Europe

Re: How are stylesheets set up in default theme?

Postby Stark Raving » Sun Jan 26, 2014 7:52 pm

Yes, I got that "app.css" is called last in the head, but looking at the others allows me to see what/how the stuff is styled. For the menu, in "sub_menu.twig", there are assigned classes like "dropdown", and "index"(?). The index class doesn't appear in the css files, but I assume it means the home page. And there are styles for the "active" link that are not obvious in "sub_menu.twig"; hence digging in the foundation files. If I don't know the class names, I won't know how to change things in "app.css" as that doesn't have all the styles listed.

For example, in "app.css" there is an override for the menu background colour. But when I changed those, the colour did not change the whole "row" where the menu resides. Yes, it probably was defined in "top-bar", but I couldn't be sure. So, I checked in "foundation.min.css" (Mistake! Use "foundation.css") to find if in fact the colour was defined in "top-bar" or somewhere else. I suppose I could just add backgound-color: #; and see what happens, and in this case it would work. But can you see why one would need to go to "foundation.css" when the class isn't listed in "app.css" ?

Am I making sense or no?

Thanks for clarifying, Ningus. It really helps.
"After I'm dead I would rather have people ask why I have no monument than why I have one." ~ Cato the Elder

"In heaven all the interesting people are missing." ~ Friedrich Nietzsche
User avatar
Stark Raving
Silver Sponsor
 
Posts: 115
Joined: Tue Dec 11, 2007 9:24 pm
Location: Vancouver

Re: How are stylesheets set up in default theme?

Postby ningus » Mon Jan 27, 2014 9:08 am

Ok, you are definitely making sense. It is now in your example, that you want to alter a style that is defined in the framework styles (foundation.css). Problem is, you should not edit foundation.css. Solution: copy all relevant styles (i.e. menu styles) from foundation.css to app.css and edit them there and make them overwrite foundation styles. I think this is usual practice when you have to deal with framework files. Advantage is, that it remains possible to upgrade the framework by just replacing the foundation files without your own styles getting in the way.
ningus
 
Posts: 33
Joined: Fri Jun 21, 2013 4:05 pm
Location: Europe

Re: How are stylesheets set up in default theme?

Postby Stark Raving » Mon Jan 27, 2014 7:14 pm

Makes complete sense. That's what I've started doing.

Cheers
"After I'm dead I would rather have people ask why I have no monument than why I have one." ~ Cato the Elder

"In heaven all the interesting people are missing." ~ Friedrich Nietzsche
User avatar
Stark Raving
Silver Sponsor
 
Posts: 115
Joined: Tue Dec 11, 2007 9:24 pm
Location: Vancouver


Return to Bolt Discussion

Who is online

Users browsing this forum: No registered users and 3 guests

cron