Premium Theme Support › DesignOrbital › Arcane

Navigation questions

  • Author
    Posts
  • #156554

    innerbayprep
    Member

    Hello!

    Thanks for providing lots of help!
    I found one question with my navigation menu: The font of the navigation does not change based on the font I choose in the theme settings. It actually happens on both header & footer area

    1. How do I change the navigation’s letter font to Futura PT (which is the font I choose in the theme setting)?
    2. How do I change the color of the letters?
    3. How do I change the size of the letters?
    4. How to remove the grey line above and below the navigation, and the “|” in between?
    5. Can I change the background color of the navigation bar? right now it is transparent, I just want it to be solid white. Thank you!!

    The blog I need help with is innerbayprep.com.

    #156592

    designorbital
    Theme Author

    Hi,
    Please try the following css snippets.

    1. Futura PT Font

    
.sf-menu a {
    font-family: "futura-pt-1","futura-pt-2","Open Sans",sans-serif;
}

    2, 3. Color & Size

    
.sf-menu a,
.sf-menu a:visited {
    color: #3166ec;
    font-size: 14px;
}

    4. Gray Line

    
.main-navigation {
    border-top: none;
    border-bottom: none;
}

    4. Pipe Separator “|”

    
.sf-menu > li:before {
    display: none;
}

    5. Navigation Bar Color

    Navigation Bar i.e. Menu background color is already white. Please explain further if i am missing something.

    Thanks

    #156595

    innerbayprep
    Member

    Thank you a lot! It all worked out!
    regarding the navigation bar white color question.
    What I meant was that when I scroll down, the sticky menu on the top currently has a transparent white color. I would love to make it a solid color, potentially not white, but I will change the color code later. Could you please help with the sticky menu background color?
    Thank you!

    #156652

    designorbital
    Theme Author

    Hi,
    Please adjust the following css snippet to meet your need.

    
@media (min-width: 768px) {
    .main-navigation.stuck {
        background-color: #fff;
        border-bottom: 1px solid #eee;
        opacity: 0.9;
    }
}

    Thanks

    #156664

    innerbayprep
    Member

    thank you!

  • Author
    Posts

The topic ‘Navigation questions’ is closed to new replies.