Ombi/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.html

<div class="small-middle-container">
	<div class="section">
		@defer (on viewport; prefetch on idle) {
		<h2 id="genreHeading" data-toggle="collapse" href="#genreCollapse" role="button">{{ 'Discovery.Genres' | translate }}</h2>
		<genre-button-select class="collapse show" id="genreCollapse"></genre-button-select>
		}
		@placeholder {
			<p-skeleton width="100%" height="2rem"></p-skeleton>
		}
	</div>
	<div class="section">
		<h2>{{ 'Discovery.RecentlyRequestedTab' | translate }}</h2>
		<div>
			<ombi-recently-list [id]="'recentlyRequested'"></ombi-recently-list>
		</div>
	</div>


	<div class="section" [hidden]="!showSeasonal">
		<h2>{{ 'Discovery.SeasonalTab' | translate }}</h2>
		<div>
			<carousel-list
				[id]="'seasonal'"
				[isAdmin]="isAdmin"
				[discoverType]="DiscoverType.Seasonal"
				(movieCount)="setSeasonalMovieCount($event)"
			></carousel-list>
		</div>
	</div>

	<div class="section">
		<h2>{{ 'Discovery.PopularTab' | translate }}</h2>
		<div>
			<carousel-list [id]="'popular'" [isAdmin]="isAdmin" [discoverType]="DiscoverType.Popular"></carousel-list>
		</div>
	</div>

	<div class="section">
		<h2>{{ 'Discovery.TrendingTab' | translate }}</h2>
		<div>
			<carousel-list [id]="'trending'" [isAdmin]="isAdmin" [discoverType]="DiscoverType.Trending"></carousel-list>
		</div>
	</div>

	<div class="section">
		<h2>{{ 'Discovery.UpcomingTab' | translate }}</h2>
		<div>
			<carousel-list [id]="'upcoming'" [isAdmin]="isAdmin" [discoverType]="DiscoverType.Upcoming"></carousel-list>
		</div>
	</div>
</div>