Archived

This topic is now archived and is closed to further replies.

  • 0

Main Nav styling


Question

Posted · Report post

Hi

 

I like to copy over styles from nav bar to nav classic. Looking at styles applied to nav bar and am confused.

 

http://50.22.97.155/~qa4good/

 

i have added this:

 

ul.main-nav {


    background-color: #5E8DC8;
    background-image: -moz-linear-gradient(center top , #6E9ED2, #4574B8);
    background-repeat: repeat-x;
    border-top: 1px solid #4574B8;

}

 

but this is the only style i could find.

 

Appreciate if you could send me the styles need to be applied to nav classic, to duplicate the same blue nav bar look.

 

thx

Share this post


Link to post
Share on other sites

6 answers to this question

Posted · Report post

Hi there, those indicate that the top item is an anchor for the dropdown, not a link. Unfortunately the navbar doesn't allow for top items to be dropdown anchors as well as links to other pages, this was how it was designed by the team at twitter bootstrap, I'd imagine due to the rise in touch screen devices. People on phones and tablets wouldn't be able to activate the dropdown without accidentally going to the link etc.

 

However, there are some premium navbars in the store which allow the top item to be a link and are styled better than the classic nav.

Share this post


Link to post
Share on other sites

Posted · Report post

Thank you, will contact the PRO guys.

 

Question:

My only problem with NAV bar is the  #m1. #m, etc links on top of sub-menu items. Is there a way to to replace them with links to pages and posts?

 

I did not understand what are they for anyways.

 

http://50.22.97.155/~qa4good/

Share this post


Link to post
Share on other sites

Posted · Report post

Where are the premium navbars in the store? i could not find them.

 

thx

Share this post


Link to post
Share on other sites

Posted · Report post

bought it. thx.

 

One more question:

How can i keep teh post thumbnails always to the left of the post? It jumps to teh top on mobile devices. I liek to see a smaller version o fteh thumbnail, or teh same size, always on teh left:

 

http://50.22.97.155/~qa4good/

 

Thank you

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

 

 

Unfortunately, we are unable to provide you the custom CSS needed to achieve your layout. However, all the styles can be found in:

 

wp-content/themes/pagelines/sections/navbar/style.less

 

Please bear in mind that all styling in this file is both CSS and LESS CSS.

 

The code you have provided above is only compatible with FF, you need to make sure you add gradient support for all others browsers. What you will need to do is convert the styling for the NavBar classes to the Nav Classics classes. It won't be an easy job but it should be possible. 

 

If you're having difficulty, you could contact one of our Pros, who will be more than happy to assist you - http://www.pagelines.com/pros/

Share this post


Link to post
Share on other sites