Apdate CSS
This commit is contained in:
270
edd.css
270
edd.css
@@ -2579,7 +2579,270 @@ html {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 💡 PERSONALIZARE NEXUS:
|
/* ========================================
|
||||||
|
* ✨ ÎMBUNĂTĂȚIRI INSPIRATE DIN DOCUMENTAȚIA JELLYFIN ✨
|
||||||
|
* ======================================== */
|
||||||
|
|
||||||
|
/* Played/Watched Indicators cu culori elegante */
|
||||||
|
.playedIndicator {
|
||||||
|
background: var(--elegant-success) !important;
|
||||||
|
border-radius: var(--elegant-radius-full) !important;
|
||||||
|
box-shadow: var(--elegant-glow-subtle) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator {
|
||||||
|
background: rgba(99, 102, 241, 0.8) !important;
|
||||||
|
color: var(--elegant-text-primary) !important;
|
||||||
|
border-radius: var(--elegant-radius-md) !important;
|
||||||
|
font-weight: 600 !important;
|
||||||
|
box-shadow: var(--elegant-shadow-sm) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.countIndicator {
|
||||||
|
background: rgba(139, 92, 246, 0.8) !important;
|
||||||
|
color: var(--elegant-text-primary) !important;
|
||||||
|
border-radius: var(--elegant-radius-full) !important;
|
||||||
|
font-weight: 600 !important;
|
||||||
|
box-shadow: var(--elegant-shadow-sm) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Imagini cu colțuri rotunjite elegante */
|
||||||
|
.cardContent-button,
|
||||||
|
.itemDetailImage {
|
||||||
|
border-radius: var(--elegant-radius-lg) !important;
|
||||||
|
transition: var(--elegant-transition-normal) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tab buttons mărite pentru accesibilitate mai bună */
|
||||||
|
.headerTabs.sectionTabs {
|
||||||
|
text-size-adjust: 110%;
|
||||||
|
font-size: 110%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.emby-tab-button {
|
||||||
|
padding: 1.2em 1.4em !important;
|
||||||
|
border-radius: var(--elegant-radius-md) !important;
|
||||||
|
transition: var(--elegant-transition-normal) !important;
|
||||||
|
font-weight: 500 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.emby-tab-button:hover {
|
||||||
|
background: rgba(99, 102, 241, 0.1) !important;
|
||||||
|
color: var(--elegant-primary) !important;
|
||||||
|
transform: translateY(-1px) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.emby-tab-button.emby-tab-button-active {
|
||||||
|
background: var(--elegant-primary) !important;
|
||||||
|
color: var(--elegant-text-primary) !important;
|
||||||
|
box-shadow: var(--elegant-glow-primary) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Episode previews mai compacte și elegante */
|
||||||
|
.listItemImage.listItemImage-large.itemAction.lazy {
|
||||||
|
height: 110px !important;
|
||||||
|
border-radius: var(--elegant-radius-md) !important;
|
||||||
|
transition: var(--elegant-transition-normal) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.listItem-content {
|
||||||
|
height: 115px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary.listItem-overview.listItemBodyText {
|
||||||
|
height: 61px !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
color: var(--elegant-text-muted) !important;
|
||||||
|
line-height: 1.4 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.listItemImage.listItemImage-large.itemAction.lazy:hover {
|
||||||
|
transform: scale(1.02) !important;
|
||||||
|
box-shadow: var(--elegant-shadow-lg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Cast & Crew stilizat și compact */
|
||||||
|
#castContent .card.overflowPortraitCard.personCard.card-hoverable.card-withuserdata,
|
||||||
|
#castContent .card.overflowPortraitCard.personCard.card-withuserdata {
|
||||||
|
width: 4.2cm !important;
|
||||||
|
font-size: 90% !important;
|
||||||
|
transition: var(--elegant-transition-normal) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#castContent .cardContent-button.cardImageContainer.coveredImage.cardContent.cardContent-shadow.itemAction.lazy,
|
||||||
|
#castContent .cardContent-button.cardImageContainer.coveredImage.defaultCardBackground.defaultCardBackground1.cardContent.cardContent-shadow.itemAction,
|
||||||
|
#castContent .cardContent-button.cardImageContainer.coveredImage.defaultCardBackground.defaultCardBackground2.cardContent.cardContent-shadow.itemAction,
|
||||||
|
#castContent .cardContent-button.cardImageContainer.coveredImage.defaultCardBackground.defaultCardBackground3.cardContent.cardContent-shadow.itemAction,
|
||||||
|
#castContent .cardContent-button.cardImageContainer.coveredImage.defaultCardBackground.defaultCardBackground4.cardContent.cardContent-shadow.itemAction,
|
||||||
|
#castContent .cardContent-button.cardImageContainer.coveredImage.defaultCardBackground.defaultCardBackground5.cardContent.cardContent-shadow.itemAction {
|
||||||
|
background-size: cover !important;
|
||||||
|
border-radius: var(--elegant-radius-lg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#castContent .cardScalable {
|
||||||
|
width: 3.8cm !important;
|
||||||
|
height: 3.8cm !important;
|
||||||
|
border-radius: var(--elegant-radius-lg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#castContent .cardOverlayContainer.itemAction {
|
||||||
|
border-radius: var(--elegant-radius-lg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#castContent .cardOverlayButton-br {
|
||||||
|
bottom: 4%;
|
||||||
|
right: 15%;
|
||||||
|
width: 70%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#castContent .cardOverlayButton.cardOverlayButton-hover.itemAction.paper-icon-button-light {
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Îmbunătățiri pentru accesibilitate și responsive design */
|
||||||
|
@media all and (min-width: 50em) {
|
||||||
|
.homePage .emby-scroller {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.homePage .emby-scrollbuttons {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.homePage .itemsContainer {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Butoane de scroll poziționare îmbunătățită */
|
||||||
|
.emby-scrollbuttons {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
padding: 0;
|
||||||
|
justify-content: space-between;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.emby-scrollbuttons-button {
|
||||||
|
pointer-events: initial;
|
||||||
|
background: rgba(99, 102, 241, 0.8) !important;
|
||||||
|
color: var(--elegant-text-primary) !important;
|
||||||
|
border-radius: var(--elegant-radius-full) !important;
|
||||||
|
transition: var(--elegant-transition-normal) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.emby-scrollbuttons-button:hover {
|
||||||
|
background: var(--elegant-primary) !important;
|
||||||
|
transform: scale(1.1) !important;
|
||||||
|
box-shadow: var(--elegant-glow-primary) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* External links vizibile pe mobile */
|
||||||
|
.layout-mobile .itemExternalLinks {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Link-uri externe stilizate elegant */
|
||||||
|
.itemExternalLinks a {
|
||||||
|
background: rgba(99, 102, 241, 0.1) !important;
|
||||||
|
color: var(--elegant-primary) !important;
|
||||||
|
border: 1px solid var(--elegant-border-accent) !important;
|
||||||
|
border-radius: var(--elegant-radius-md) !important;
|
||||||
|
padding: 8px 12px !important;
|
||||||
|
margin: 4px !important;
|
||||||
|
transition: var(--elegant-transition-normal) !important;
|
||||||
|
text-decoration: none !important;
|
||||||
|
font-weight: 500 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.itemExternalLinks a:hover {
|
||||||
|
background: var(--elegant-primary) !important;
|
||||||
|
color: var(--elegant-text-primary) !important;
|
||||||
|
transform: translateY(-1px) !important;
|
||||||
|
box-shadow: var(--elegant-shadow-md) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Îmbunătățiri pentru Star Ratings */
|
||||||
|
div.starRatingContainer {
|
||||||
|
margin: 8px 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.starRating {
|
||||||
|
color: var(--elegant-accent) !important;
|
||||||
|
filter: drop-shadow(0 0 4px rgba(6, 182, 212, 0.3)) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Îmbunătățiri pentru Progress Bars în liste */
|
||||||
|
.itemProgressBar {
|
||||||
|
background: rgba(15, 23, 42, 0.6) !important;
|
||||||
|
border-radius: var(--elegant-radius-full) !important;
|
||||||
|
overflow: hidden !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.itemProgressBarForeground {
|
||||||
|
background: linear-gradient(90deg, var(--elegant-primary), var(--elegant-secondary)) !important;
|
||||||
|
border-radius: var(--elegant-radius-full) !important;
|
||||||
|
box-shadow: 0 0 8px rgba(99, 102, 241, 0.4) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Îmbunătățiri pentru Media Info Badges */
|
||||||
|
.mediaInfoBadge {
|
||||||
|
background: rgba(99, 102, 241, 0.8) !important;
|
||||||
|
color: var(--elegant-text-primary) !important;
|
||||||
|
border: 1px solid var(--elegant-border-accent) !important;
|
||||||
|
border-radius: var(--elegant-radius-md) !important;
|
||||||
|
padding: 4px 8px !important;
|
||||||
|
font-size: 0.7rem !important;
|
||||||
|
font-weight: 600 !important;
|
||||||
|
text-transform: uppercase !important;
|
||||||
|
letter-spacing: 0.5px !important;
|
||||||
|
box-shadow: var(--elegant-shadow-sm) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive design pentru tablete */
|
||||||
|
@media (min-width: 768px) and (max-width: 1024px) {
|
||||||
|
.cardBox {
|
||||||
|
margin: 8px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.emby-tab-button {
|
||||||
|
padding: 1em 1.2em !important;
|
||||||
|
font-size: 0.9rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headerTabs.sectionTabs {
|
||||||
|
font-size: 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive design pentru mobile */
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
.cardBox {
|
||||||
|
margin: 4px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.emby-tab-button {
|
||||||
|
padding: 0.8em 1em !important;
|
||||||
|
font-size: 0.85rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headerTabs.sectionTabs {
|
||||||
|
font-size: 95% !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.listItemImage.listItemImage-large.itemAction.lazy {
|
||||||
|
height: 90px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.listItem-content {
|
||||||
|
height: 95px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 💡 PERSONALIZARE ELEGANT:
|
||||||
* Modifică variabilele --nexus-* din secțiunea :root
|
* Modifică variabilele --nexus-* din secțiunea :root
|
||||||
* pentru a adapta tema la preferințele tale cosmice.
|
* pentru a adapta tema la preferințele tale cosmice.
|
||||||
*
|
*
|
||||||
@@ -2587,9 +2850,10 @@ html {
|
|||||||
* @import url('https://git.eddmanoo.cloud/eddmanoo/jellyfincss/raw/branch/main/edd.css');
|
* @import url('https://git.eddmanoo.cloud/eddmanoo/jellyfincss/raw/branch/main/edd.css');
|
||||||
*
|
*
|
||||||
* 👨💻 Autor: EDD
|
* 👨💻 Autor: EDD
|
||||||
* 🚀 Versiune: 3.0 NEXUS PROFESSIONAL
|
* 🚀 Versiune: 5.0 ELEGANT REFINED + JELLYFIN DOCS
|
||||||
* 📅 Data: 2025
|
* 📅 Data: 2025
|
||||||
* 🌐 Repository: https://git.eddmanoo.cloud/eddmanoo/jellyfincss
|
* 🌐 Repository: https://git.eddmanoo.cloud/eddmanoo/jellyfincss
|
||||||
|
* 📚 Inspirat din: Documentația oficială Jellyfin CSS Customization
|
||||||
*
|
*
|
||||||
* 🎬 Bucură-te de experiența Jellyfin NEXUS de nivel cosmic! ✨🌌
|
* ✨ Bucură-te de experiența Jellyfin ELEGANT cu imagini clare și design rafinat! <20>💫
|
||||||
*/
|
*/
|
||||||
Reference in New Issue
Block a user