Add new CSS modules: Genre Thumbnails, Upcoming Calendar, Home Screen Section Grids

This commit is contained in:
HighImKevin
2026-01-28 17:02:41 -05:00
parent a040981765
commit 4c0cf1464f
5 changed files with 72 additions and 0 deletions
+15
View File
@@ -75,6 +75,21 @@
name: 'Animated Overlay',
url: 'https://cdn.jsdelivr.net/gh/LitCastVlog/Flow@main/CSS/ScyFlow-AnimatedOverlay.css',
enabled: false
},
{
name: 'Wrap Items In Home Sections',
url: `${getKefinTweaksRoot()}skins/optional/global/wrapHomeScrollerItems.css`,
enabled: false
},
{
name: 'Genre Thumbnails',
url: `${getKefinTweaksRoot()}skins/optional/global/genreThumbnails.css`,
enabled: false
},
{
name: 'Upcoming Calendar View',
url: `${getKefinTweaksRoot()}skins/optional/global/upcomingCalendar.css`,
enabled: false
}
],
+6
View File
@@ -1,3 +1,9 @@
#indexPage, #moviesPage, #tvRecommendedPage, #musicRecommendedPage {
overflow-y: visible !important;
}
@media (min-aspect-ratio: 1.98 / 1) {
.detailPageContent .detailPagePrimaryContent {
padding-left: 0 !important;
}
}
+27
View File
@@ -0,0 +1,27 @@
.card[data-type="Genre"] a.cardImageContainer::after {
content: attr(aria-label);
font-size: 3rem;
}
.card[data-type="Genre"] {
--genre-color: hsl(210 20% 25%);
}
.card[data-type="Genre"]:nth-child(10n + 1) { --genre-color: hsl(0 55% 35%); } /* red */
.card[data-type="Genre"]:nth-child(10n + 2) { --genre-color: hsl(36 60% 35%); } /* orange */
.card[data-type="Genre"]:nth-child(10n + 3) { --genre-color: hsl(72 55% 35%); } /* yellow-green */
.card[data-type="Genre"]:nth-child(10n + 4) { --genre-color: hsl(108 50% 35%); } /* green */
.card[data-type="Genre"]:nth-child(10n + 5) { --genre-color: hsl(144 45% 35%); } /* teal */
.card[data-type="Genre"]:nth-child(10n + 6) { --genre-color: hsl(180 50% 35%); } /* cyan */
.card[data-type="Genre"]:nth-child(10n + 7) { --genre-color: hsl(216 55% 35%); } /* blue */
.card[data-type="Genre"]:nth-child(10n + 8) { --genre-color: hsl(252 50% 38%); } /* indigo */
.card[data-type="Genre"]:nth-child(10n + 9) { --genre-color: hsl(288 55% 38%); } /* purple */
.card[data-type="Genre"]:nth-child(10n + 10){ --genre-color: hsl(324 55% 38%); } /* magenta */
.card[data-type="Genre"] a.cardImageContainer {
background: var(--genre-color) !important;
}
.homeSectionsContainer .card[data-type="Genre"] .cardText {
visibility: hidden;
}
@@ -0,0 +1,13 @@
div#upcomingItems {
display: grid;
grid-template-columns: repeat(7, 14.285%);
}
div#upcomingItems .itemsContainer {
display: flex;
flex-direction: column;
}
div#upcomingItems .itemsContainer .card {
width: 100%;
}
@@ -0,0 +1,11 @@
@media all and (min-width: 50em) {
.homePage .emby-scroller {
margin-right: 0;
}
.homePage .emby-scrollbuttons {
display: none;
}
.homePage .itemsContainer {
flex-wrap: wrap;
}
}