[Resolved] how change button color in Ethos template

Home Forums Support [Resolved] how change button color in Ethos template

Home Forums Support how change button color in Ethos template

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1536966
    Sima

    I am using Ethos template and I am not able to change the color of the following buttons:
    Practice Area
    Font color for “Read more”
    the border color for phone number

    Please help. thanks

    #1536976
    Elvin
    Staff
    Customer Support

    Hi,

    Can you link us to the page in question? If possible, can you provide screenshots of specific buttons you’re pertaining to as well?

    You can provide the details on the Private Information text field. Thank you. ๐Ÿ™‚

    A wise man once said:
    "Have you cleared your cache?"

    #1537040
    Sima

    I sent the requested information.

    #1537201
    David
    Staff
    Customer Support

    Hi there,

    1. Buttons on the static page are styled in the Block editor i made a quick video to show how:

    2. Is this the Read More button on the Blog page ? If so that is defined in Customizer > Colors > Buttons

    3. The navigation phone button uses this CSS – go to Customizer > Additional CSS and look for:

    .main-navigation:not(.slideout-navigation) .main-nav li.nav-button a {
        border: 2px solid rgba(255,170,0,1.0);
        color: #ffffff;
        line-height: 38px;
        padding: 0px 16px;
        margin-top: 6px;
        margin-left: 24px;
        -webkit-transition: all 500ms ease-in-out;
        transition: all 400ms ease-in-out;
    }

    You need to change the rgba(255,170,0,1.0); value – you can replace it with another RGBA or Hex color

    #1538259
    Sima

    David, thank you very much for your help. It worked. except for the yellow color underline “Recent Posts” on the Blog page. Could you please let me know how to change the color for the underline?

    thank you again.

    #1538560
    David
    Staff
    Customer Support

    In the Additional CSS edit bottom-border in this block of code:

    .sidebar .widget-title, .footer-widgets .widget-title {
        border-bottom: 1px solid #ffaa00;
        line-height: 1.6em;
        display: inline-block;
    }
    #1539234
    Sima

    David, thank you very much. it worked. ๐Ÿ™‚

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