Where are the home page div styles for top navigation?

This forum is for all Flare issues related to styles, stylesheets and XML.
Post Reply
kellyh_hochanadel
Propeller Head
Posts: 30
Joined: Tue Jul 22, 2014 6:30 am
Location: Austin TX

Where are the home page div styles for top navigation?

Post by kellyh_hochanadel »

I'm trying to customize the <divs> that appear in the Home page template, but the only ones that are in the StylesForHomePage.css stylesheet are:
  • button-group
  • row
  • slidingshow
  • topichero
But the home page itself shows the following div styles:
  • title-text
  • small-12 small-centered columns centered-text
  • mc-blurb
  • row outer-row
  • left-section small-12 medium-7 columns
  • left-content
  • button-group center row
  • right-section small-12 medium-5 end columns
  • table-images center row
Does anyone know where these other div styles live so I can customize them?

LOVE the top nav design. Everyone is already flipping over it.
NorthEast
Master Propellus Maximus
Posts: 6372
Joined: Mon Mar 05, 2007 8:33 am

Re: Where are the home page div styles for top navigation?

Post by NorthEast »

To find out how the output is styled, try press F12 in your browser to show developer tools - there will be an 'inspect' option (varies between browsers) that you can use to select an element and inspect its HTML and CSS.

For those divs you've mentioned, I recognise some of the class names are used with foundation (a layout framework).
kellyh_hochanadel
Propeller Head
Posts: 30
Joined: Tue Jul 22, 2014 6:30 am
Location: Austin TX

Re: Where are the home page div styles for top navigation?

Post by kellyh_hochanadel »

I've been able to track these styles down by opening the StylesForHomePage stylesheet in the code editor - most of them are "sections" but if you know what you're doing it's not too difficult to tweak some of the simpler properties. Hope this helps someone else down the road!
ToddPh
Sr. Propeller Head
Posts: 140
Joined: Wed Jan 30, 2013 2:41 pm
Location: Kirkland, Washington

Re: Where are the home page div styles for top navigation?

Post by ToddPh »

I've read somewhere (apologies for my poor memory) that MadCap used Foundation to create the TopNav skin, and indeed, I've been busily hacking some Foundation functionality into my TopNav project. Dave is right as usual, many of those classes are being inherited from Foundation. If you want to override those default settings you will need to add them to your MainStyles.css. Hope this helps, or at least gives you another avenue to pursue.
Todd
Image
When puns are outlawed, only outlaws will have puns.
kellyh_hochanadel
Propeller Head
Posts: 30
Joined: Tue Jul 22, 2014 6:30 am
Location: Austin TX

Re: Where are the home page div styles for top navigation?

Post by kellyh_hochanadel »

We found that some of the div styles override the Foundation settings, and had better luck just using the Foundation settings and removing the other div classes. Got everything working like we wanted, though! It looks so sexy.
Post Reply