Change the Font-transition (Color)

  • Hello!

    First of, the site provided is just a test install I’m playing around with – but it shows everything I’m interested in.

    I wanna change the text-transition. The theme has some kind of an h:over effect on it’s links, specifically on the navigation and the headings. When you move your mouse over it it changes to a blue. I like the effect but I wanna change it from blue to another color.
    With the Inspector I found these two snippets of CSS but I don’t know what to do in the custom CSS to change the color:

    .main-navigation a {
    color: #333;
    display: inline-block;
    font-size: 15px;
    padding: 10px 20px;
    position: relative;
    text-decoration: none;
    -webkit-transition: color 0.2s;
    -moz-transition: color 0.2s;
    transition: color 0.2s;
    }

    .entry-title a {
    color: #333;
    text-decoration: none;
    -webkit-transition: color 0.2s;
    -moz-transition: color 0.2s;
    transition: color 0.2s;
    }

    I have already changes the color of a – but that doesn’t seem to have an effect on the transition-effect I am not familiar with.

    Anyone have suggestions for me?

    Thanks!

    Ben

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)

  • Hi Ben –

    I’ll be glad to take a closer look at that. Do you want this change to be site-wide? Or is it just specific text that you’re looking to change the hover effect on?

    Thread Starter gragaer

    (@gragaer)

    Hello Liz,

    I’d like to change it site-wide on all the headings and the navigation.

    Thank you! ??

    Hi Ben,

    these should do the trick:

    /*Changes the color of links on hover*/
.main-navigation a:focus, .main-navigation a:hover {
    color: #red;
}

entry-title a:hover {
    color: #red;
}
    Thread Starter gragaer

    (@gragaer)

    Hello fresatomica,

    I don’t understand how this works, but it works perfectly!

    Thanks you so much! <3

    Yay! I’m happy to hear that ??

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Change the Font-transition (Color)’ is closed to new replies.