[Support request] Change Background Circle Agency Primary Menu Contact Link

Home Forums Support [Support request] Change Background Circle Agency Primary Menu Contact Link

Home Forums Support Change Background Circle Agency Primary Menu Contact Link

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #2218121
    Christy

    In the agency theme, on the primary menu, the contact link has a background color and it has a greenish background. I can’t figure out how to change that background color. Can you help me do that? It’s the paid version.

    #2218293
    David
    Staff
    Customer Support

    Hi there,

    in Customizer > Colors in the Global Colors, you will see several prenamed colors.
    That button uses

    --base-3 for the text color
    --accent-2 for the background color

    If you change those colors the navigation button will update.

    If you want to delve deeper then you will need to edit the CSS that is in Customizer > Additional CSS. It looks like this:

    /* navigation contact button */
    .main-navigation:not(.slideout-navigation) .main-nav li.nav-button a {
        color: var(--base-3);
        background-color: var(--accent-2);
        line-height: 44px;
        /* button height */
        padding: 0px 22px;
        /* space inside button */
        margin-top: 4px;
        /* adjust to horizontally align with other menu items */
        border-radius: 40px;
        margin-left: 22px;
        /* space to the left of button */
        transition: all 0.4s ease 0s;
    }
    
    .main-navigation:not(.slideout-navigation) .main-nav li.nav-button a:hover {
        background-color: var(--accent-2);
        transition: all 0.4s ease 0s;
        color: var(--base-3);
    }

    There are two CSS rules one for the static and one for the hover states.
    The colors are defined using the CSS variables you found in the Global Colors eg.

    color: var(--base-3);
    background-color: var(--accent-2);
    #2219029
    Christy

    Thanks, there doesn’t seem to be an accent 2 for this theme, but I was able to edit the additional CSS. Thank you for the help. Have a nice weekend!

    #2219367
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.