Remove Lines & Grey Background - X/ Integrity

[Gobaga]

Hi,

I’m having trouble removing the horizontal grey line at the top of my website, and the grey band at the bottom. I would also like to change the color of the menu bar when an item is clicked. A ‘clicked’ page shows a grey bar with a House icon, then the page name. I would like to change the color of that bar.

The website address is https://www.tracyparkdraws.com

Thanks!

[Alaa]

Hi @Gobaga

You can add this CSS code to (X > Theme Options > CSS):

/*remove the grey band at the bottom*/
#x-root {
    height: 100vh;
}

/*remove the grey line at the top*/
.x-logobar {
    border: none;
}

/*change the breadcumb color*/
.x-breadcrumb-wrap {
    background-color: rgba(255, 0, 0, 1);
} 

As you can see the code is commented so you know what each line of the code does, I also recommend checking these tutorials to learn more about CSS customization:

Thanks.

[Gobaga]

Thank you for the quick reply.

To change the font color in the breadcrumb, would that be…

/change the breadcumb font color/
.x-breadcrumb-font {
font-color: rgba(255, 255, 255, 1);
}

??

[Gobaga]

And, I now have a grey line at the bottom of the House logo, in the breadcrumbs (?). How can I change that to a different color or remove entirely?

[nabeel]

Hi again,

Please add the following code for your breadcrumbs:

.masthead .x-breadcrumbs a {
    color: #fff;
    text-decoration: none;
}

Hope this helps!

[Gobaga]

Thank you.

I still have the grey background on sub pages, such as https://www.tracyparkdraws.com/momblob/ (scroll down to see grey). What CSS should I enter to get rid of that?

[nabeel]

Hi again,

It looks like the demo background image, please go to X > Theme Options > Layout and Design then set a random background image and then unset it to remove the demo background image.

Hope this helps!

[Gobaga]

I tried your suggestion – insert a random background image, then remove it. The background changes to the random image, then when random image is removed, it changes back to grey. What should I try next?

[Prasant]

Hello @Gobaga,

Thanks for updating the thread.

You can try adding following CSS under X > Theme Options > CSS:

body {
    background-image: none !important;
}

Thanks.

[Gobaga]

That worked. Thank you, Prasant!

[nico]

Hi @Gobaga,

Happy to hear that.

Feel free to ask us again.

Thanks.