Docs

[christiaanakkermans]

Hi,

I am trying the two things below, and looked already at the forum, but somehow I won’t succeed. Can you help me with what’s going wrong?

1) Remove the dotted underlining in het top-bar

2) Change the background color of the mobile version top-bar to #1F1D24

Thanks.

Chris

[christiaanakkermans]

This reply has been marked as private.

[Thai]

Hey Chris,

Please add the following CSS under Customizer > Custom > Global CSS:

.x-topbar .p-info a {
    border-bottom: none;
}
@media (max-width: 767px){
    .x-topbar .p-info {
        background-color: #1F1D24;
    }
}

Hope it helps 🙂

[christiaanakkermans]

The dotted underlining is away! Thnx!

The background is still blanc instead of #1F1D24

Any idea?

[Thai]

Hi Chris,

There is a missing closing bracket(}) in your custom CSS.

Please replace your current custom CSS with this:

.woocommerce p.stars span a {
	background-color: rgb(0,79,188);
}

.x-colophon {
	background-color: #F2F2F2 !important;
}

footer.x-colophon.top .textwidget {
	font-size: 12px;
}

.x-colophon .x-nav li a {
	font-size: 9px;
}

.x-navbar {
	background-color: rgba(31, 29, 36, 1) !important;
}

.x-navbar .sub-menu {
	background-color: rgba(31, 29, 36, 1);
}

.x-navbar {
	border-bottom: none;
	box-shadow: none;
}

.x-navbar .desktop .x-nav > li > a:hover, 
.x-navbar .desktop .x-nav > .x-active > a, 
.x-navbar .desktop .x-nav > .current-menu-item > a {
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.x-topbar {
	background-color: #1F1D24;
}

.x-topbar {
	border-bottom: none;
}

.x-topbar .x-social-global {
	display: none !important;
}

@media (min-width: 768px) {
	.x-topbar .p-info {
		overflow: hidden;
		float: none;
	}

	.x-topbar .p-info .left-content {
		float: left;
	}

	.x-topbar .p-info .right-content {
		float: right;
	}
}

@media (max-width: 767px) {
	.x-topbar .p-info {
    	background-color: #1F1D24;
	};
}

.x-topbar .p-info a {
	border-bottom: none;
}

Hope it helps 🙂

[Author]

Posts