[CrikeyMateParticipant]

Hello!

Tried so much. Gave up. Writing to the experts now! 🙂

How do I change the said colors? The default white color is rather hard to see.

.slick-prev and .slick-next … Also; .x-icon-chevron-right and .x-icon-chevron-left

Is this even possible, or are these “buttons” hard-coded?

Either way, your help is appreciated!

[CrikeyMateParticipant]

This reply has been marked as private.

[FriechModerator]

Hi There,

Thanks for writing in! You can add this under Custom > CSS in the Customizer.

.flex-direction-nav a [class*="x-icon-"],
.slick-prev:before,
.slick-next:before {
	color: red !important;
}

Make sure you clear your browser’s cache and any caching plugin before previewing the site.

Hope it helps, Cheers!

[CrikeyMateParticipant]

Great! Thanks! They are still “too transparent” (until clicked). How do I change the “brightness” of the buttons? (to make clearly more visible).

Also, 3 other things;

#1 How do I remove the lines between the Menu items at the top? And also the Widgets at the bottom?

#2 Can I “randomize” the blog home-page? IE, have posts sorted randomly, and not by “last added” (like the Slider & Carousal).

#3 The “scroll top anchor” color. It’s not visible due to being black in color. How do I change the color?

Thanks again for the wonderful support!

[John EzraMember]

Hi there,

Thanks for writing in! You can add this under Custom > CSS in the Customizer or in your child theme’s style.css file.

For #1, use the following CSS:

.slick-prev:before, .slick-next:before {
    opacity:1;
}

.slick-prev:hover:before, .slick-next:hover:before {
    color:rgb(20,119,196)!important;
}

.flex-direction-nav a {
    opacity:1;
}

.flex-direction-nav a:hover [class*="x-icon-"] {
    color:rgb(20,119,196)!important;
}

For # 2:
This is not a default feature of X. Depending on what you want, it may fall beyond our scope of support. Which area of the home page are you talking about? Is it the masonry area, the carousel or the slider?

For # 3, use this CSS:

a.x-scroll-top.right.fade.in {
    color: #808080;
    border-color: #808080;
}

[CrikeyMateParticipant]

Wonderful on #1 and #3. Thanks so much.

As for #2. The Masonry blog. The slider and carousel are already “random”. 🙂

Oh, and the Lines around the Top Menu Items, and bottom Widgets. Borders? Can I please get the CSS to remove both.

Thanks so much.

[LelyModerator]

Hi There,

Please check this thread:https://community.theme.co/forums/topic/ethos-blog-index-page-order-of-posts/#post-301934

Please use this CSS:

.x-navbar .desktop .x-nav>li>a {
    border: none !important;
}
.widget:before {
    background-color: transparent;
}

Hope this helps.

[CrikeyMateParticipant]

Magic! Thanks again! 🙂

[ChristopherModerator]

You’re welcome.

[Author]

Posts