Forums » Theme: Spasalon » home page pink banner

  • Resolved Destiny Challenge

    (@destiny-challenge)


    I would like pink banner to be black (on home page only)the code below is what I have in customize-general settings-custom css
    .slidesDescription { background-color: #000000; }

    Also inside pink banner: I want the description text size larger (on all pages)

    Also inside pink banner: I would like the call us sign background white with call us text and the tel number as same font

    How do I keep these changes even after I purchase the theme?

    Thank You

Viewing 15 replies - 1 through 15 (of 17 total)
  • Yusuf

    (@yusufwebriti)

    Hi,

    Do follow this steps.
    1. For Black Banner Background use this css.

    .home .slidesDescription {
        background: #000000 !important;
    }

    2. Make Description Text size larger. You can enter font size according to you.

    .pink-container p {
        font-size: 13px;
    }

    3. Download and Replace this image in your images folder. http://share.pho.to/ABAyZ

    Enter this css in your Custom CSS Field.

    Thanks

    Thread Starter Destiny Challenge

    (@destiny-challenge)

    Hello
    I have added both css & have cleared cache. Banner is still pink on the home page and description font inside the banner is still tiny. Any ideas?

    Yusuf

    (@yusufwebriti)

    Hi,

    Kindly share your site url. So i can better assist you.

    Thanks

    Thread Starter Destiny Challenge

    (@destiny-challenge)

    colorgallerybydesign.com

    Yusuf

    (@yusufwebriti)

    Hi,
    Kindly use this css code.

    1. For Black Banner Background use this css.

    .home .topbar-detail {
        background: #000000 !important;
    }

    2. Make Description Text size larger. You can enter font size according to you.

    .topbar-detail p.description {
    	font-size: 15px;
    	color: #fff !important;
    }

    Thanks

    Thread Starter Destiny Challenge

    (@destiny-challenge)

    Thank you Yusuf for the banner help. How do I vertical center the description within the topbar?

    The new -call us image- is now in the image folder but on the site the little sign is still not white. It inherits a lighter color shade of the banner color. I would like it to stay white please.

    Thank You again for the help

    Yusuf

    (@yusufwebriti)

    Hi,

    Do the following steps.
    1. For vertical center the description. Enter this css in your Custom CSS Field.

    .topbar-detail .col-md-6 {
        padding: 28px 0;
    }

    2. Download and Replace this image in your images folder by the name addr-bg.png
    http://share.pho.to/ABJfx

    Let me know it worked?

    Thanks

    Thread Starter Destiny Challenge

    (@destiny-challenge)

    Thank you Yusuf! A last thing for the little sign image. How can I make the same font size and the same font color for -call us & tel no.-on the little sign? I really appreciate the help from the support team…really very excellent theme support.

    Yusuf

    (@yusufwebriti)

    Hi,

    For same font size and the same font color for -call us & tel no. Use this css code. Then enter in your custom css field.

    .addr-detail address {
        font-size: 18px !important;
        color: #9c253e !important;
    }

    Let me know it worked?
    Thanks

    Thread Starter Destiny Challenge

    (@destiny-challenge)

    Thank You Yusuf the size is now perfect. I made a mistake…What css should I use to change call us & tel no. to #00000. Can I just modify the css given in previous post?

    Yusuf

    (@yusufwebriti)

    Hi,

    You want to change color of call us & tel no text. Do remove previous post css.
    Remove This

    .addr-detail address {
        font-size: 18px !important;
        color: #9c253e !important;
    }

    Replace with

    .addr-detail address, .addr-detail address > strong {
        font-size: 18px !important;
        color: #000000 !important;
    }

    Let me know it worked?
    Thanks

    Thread Starter Destiny Challenge

    (@destiny-challenge)

    Result: ‘Call Us’ went back to smaller size & original pink color. Nothing changed to color black.

    I tried the code below- Result: ‘Call Us’ retains the larger size, and changes to black color but the Tel No. does not change to black color.

    .addr-detail address {
    font-size: 18px !important;
    color: #000000 !important;
    }

    Can we try something else? Thank You

    Yusuf

    (@yusufwebriti)

    Hi,

    As far as I can see the output on your site. Call Now & Tel Number text showing with the same font size. Please take a look here. Click Here
    Could you please elaborate possibly with screenshots?

    Thanks

    Thread Starter Destiny Challenge

    (@destiny-challenge)

    Yes I would like Call Now & Tel Number to be Same Color Black (or I choose)

    Output now is from css I tried see previous.

    See also previous post for (result #1) was from the code you said to replace with. It was not correct so I tried something else (which I show above) Result is what you see now.

    Yes I would like Call Now & Tel Number to be Same Color Black (or I choose)

    Yusuf

    (@yusufwebriti)

    Hi,
    Kindly use this css code and remove css before you used. That will work. Let me know

    .addr-detail address, .addr-detail strong {
        font-size: 18px !important;
        color: #151515 !important;
    }

    Thanks

Viewing 15 replies - 1 through 15 (of 17 total)
  • The topic ‘home page pink banner’ is closed to new replies.