CSS Cascade in SD 3.5 - Post ID 287609

User 1738266 Photo


Registered User
52 posts

I am migrating from hand coded Foundation-based, non-responsive, sites to Foundation 3.6 responsive sites. I am currently using the Zurb stack, Panini, SASS. Now I evaluating SD 3.5 and it looks promising. I have viewed and downloaded Help Article 1505 on nested menus and am trying to style it to my design.

My problem is with styling all the text in the menu. I changed the background in nav-region and it applied to all of its content. Changing the text color has no effect.

The generated CSS contains
.container.nav-region {
background-color: #5e004c;
color: #faf0e6;
}

Shouldn't the color cascade? Or is this a result of using Foundation classes? With Foundation these overrides can be accompished in the settings.css.

An alternative would be to define a generic text class that could be applied to any element.

Any ideas?
User 187934 Photo


Senior Advisor
20,271 posts

Hi Thomas,
Did you check font styling for the li or a elements?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 1738266 Photo


Registered User
52 posts

Thanks Eric,

I understand about styling the individual elements. I was hoping to be able to include hand-coded CSS like I can include hand-coded HTML. This would greatly facilitate migrating elaborate components already in use.

Does SD 3.5 use the Zurb default setings.scss file?
User 187934 Photo


Senior Advisor
20,271 posts

You can override any styling by adding a custom style sheet link to the head of your page under Page Management and adding the css page to your resources.
Sd Foundation will use built in classes if you assign them.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 1738266 Photo


Registered User
52 posts

Thanks.

I hadn't looked at page set up, yet. My main concern has been migrating components. It appears I can use my Foundation generated css and use SD for page layout and content update. Thats where the day-to-day work is done once the site resources are set up, anyway.

I'll look at migration from that angle.
User 122279 Photo


Senior Advisor
14,646 posts
Online Now

SD uses ready compiled css, not any preprocesser like SASS or LESS.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 1738266 Photo


Registered User
52 posts

Thanks Eric and Inger.

Once I figured out where all the project resources are stored it was a simple matter to copy my existing CSS and HTML snippet and set up a one block page instantiating my sticky responsive menu. Worked like a charm and took only about 10 minutes.

One suggestion: Sometime document where everything is stored. It would be nice if it were possible to setup a resources directory under a dedicated project folder rather than in the installation directory. A C: drive can rapidly get messy to manage and backup.
User 122279 Photo


Senior Advisor
14,646 posts
Online Now

You can store your files anywhere you want. I don't even remember where the default storing location is, maybe in a folder in 'My documents' called My Website, not sure. I keep my sites/files on an external drive, or even in a cloud, it depends a bit. The best thing is definitely to keep them out of the C drive.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com



Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.