How do I hide ethos carousel only on front page on mobile?

[Peter_Fae]

Two things please. I’m getting clear on the design of my mobile presentation of an ethos-themed site.

One - I would like to hide the carousel on the iPhone size level, yet only the frontpage, yet keep it on the other pages.

What is the code for this?

Two -

If I chose to hide the post carousel on ALL pages on iPhone size mobile but show on other sizes (iPad, laptop, desktop), what would that code be as well? I would like to experiment.

Thank You.

[christian]

Hey @Peter_Fae,

1. Mobile display in X starts from 480px and below.

The home page has a class of home and the carousel, a class of x-post-carousel. Combining all of that, the code would be.

@media (max-width: 480px) {
	.home .x-post-carousel {
		display: none;
	}
}

2. To hide on all pages, just remove .home from the code.

Please note that this is getting into custom development which is outside the scope of our support service. In case you have problems with the code or need further enhancement, you will need to show that to a third party developer to continue the development.

Thank you for understanding.