UX prettified in the menu again

This commit is contained in:
l4kr 2023-09-06 15:52:40 +02:00
parent cc02e201f6
commit 2bd563466b
8 changed files with 49 additions and 19 deletions

View File

@ -101,7 +101,7 @@
} }
.itemName-primary { .itemName-primary {
margin: 0; margin: 0;
overflow: hidden; overflow: initial;
font-size: 2.5em; font-size: 2.5em;
} }
.itemName-secondary { .itemName-secondary {
@ -265,8 +265,8 @@
text-overflow: ellipsis; text-overflow: ellipsis;
display: -webkit-box; display: -webkit-box;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-line-clamp: 3; -webkit-line-clamp: 8;
font-weight: 400; font-weight: 520;
} }
.btnOverviewText.emby-button-focusscale:focus { .btnOverviewText.emby-button-focusscale:focus {
-webkit-transform: scale(1.04); -webkit-transform: scale(1.04);
@ -414,7 +414,6 @@
.detailTextContainer { .detailTextContainer {
margin: 0 0; margin: 0 0;
padding: 5em 1em; padding: 5em 1em;
padding-bottom: 20em;
} }
.detailTextContainer-extrapadding { .detailTextContainer-extrapadding {
padding: 0 1.6em; padding: 0 1.6em;

View File

@ -25,6 +25,10 @@
webkit-transform: scale(1.03); webkit-transform: scale(1.03);
text-shadow: 2px 2px 5px black; text-shadow: 2px 2px 5px black;
} }
.card:active {
transform: scale(1);
text-shadow 0 0 0;
}
.card.itemAction { .card.itemAction {
cursor: pointer; cursor: pointer;
} }

View File

@ -207,6 +207,13 @@
z-index: 1; z-index: 1;
vertical-align: middle; vertical-align: middle;
} }
.paper-icon-button-light:hover {
background: hsla(
var(--theme-text-color-hue),
var(--theme-text-color-saturation),
var(--theme-text-color-lightness),
0.2);
}
.paper-icon-button-light.md-icon { .paper-icon-button-light.md-icon {
font-size: 1.66956521739130434em; font-size: 1.66956521739130434em;
margin: 0 0.17em; margin: 0 0.17em;

View File

@ -1139,8 +1139,11 @@ html {
} }
} }
.scrollbuttoncontainer { .scrollbuttoncontainer {
color: #fff; color: white;
background: rgba(20, 20, 20, 0.5); background: hsla(var(--theme-text-color-hue),
var(--theme-text-color-saturation),
var(--theme-text-color-lightness),0.35);
border-radius: 0.7em;
} }
.recordingIcon-active { .recordingIcon-active {
color: #c33 !important; color: #c33 !important;
@ -1387,7 +1390,8 @@ html {
); );
} }
.detailMainContainer-withbackdrop { .detailMainContainer-withbackdrop {
text-shadow: 0.14em 0.14em 0.28em rgba(0, 0, 0, 0.45); text-shadow: 0.18em 0.18em 0.28em rgba(0, 0, 0, 0.45);
padding-bottom: 11em;
} }
.details-additionalContent-withbackdrop { .details-additionalContent-withbackdrop {
--theme-text-color-alpha: 0.85; --theme-text-color-alpha: 0.85;

View File

@ -1135,8 +1135,11 @@ html,
} }
} }
.scrollbuttoncontainer { .scrollbuttoncontainer {
color: #fff; color: white;
background: rgba(20, 20, 20, 0.5); background: hsla(var(--theme-text-color-hue),
var(--theme-text-color-saturation),
var(--theme-text-color-lightness),0.35);
border-radius: 0.7em;
} }
.recordingIcon-active { .recordingIcon-active {
color: #c33 !important; color: #c33 !important;
@ -1389,7 +1392,8 @@ html,
); );
} }
.detailMainContainer-withbackdrop { .detailMainContainer-withbackdrop {
text-shadow: 0.14em 0.14em 0.28em rgba(0, 0, 0, 0.45); text-shadow: 0.18em 0.18em 0.28em rgba(0, 0, 0, 0.45);
padding-bottom: 11em;
} }
.details-additionalContent-withbackdrop { .details-additionalContent-withbackdrop {
--theme-text-color-alpha: 0.85; --theme-text-color-alpha: 0.85;

View File

@ -1167,8 +1167,11 @@ html,
} }
} }
.scrollbuttoncontainer { .scrollbuttoncontainer {
color: #fff; color: white;
background: rgba(20, 20, 20, 0.5); background: hsla(var(--theme-text-color-hue),
var(--theme-text-color-saturation),
var(--theme-text-color-lightness),0.35);
border-radius: 0.7em;
} }
.recordingIcon-active { .recordingIcon-active {
color: #c33 !important; color: #c33 !important;
@ -1421,7 +1424,8 @@ html,
); );
} }
.detailMainContainer-withbackdrop { .detailMainContainer-withbackdrop {
text-shadow: 0.14em 0.14em 0.28em rgba(0, 0, 0, 0.45); text-shadow: 0.18em 0.18em 0.28em rgba(0, 0, 0, 0.45);
padding-bottom: 11em;
} }
.details-additionalContent-withbackdrop { .details-additionalContent-withbackdrop {
--theme-text-color-alpha: 0.85; --theme-text-color-alpha: 0.85;

View File

@ -1260,8 +1260,11 @@ html {
} }
} }
.scrollbuttoncontainer { .scrollbuttoncontainer {
color: #fff; color: white;
background: rgba(20, 20, 20, 0.5); background: hsla(var(--theme-text-color-hue),
var(--theme-text-color-saturation),
var(--theme-text-color-lightness),0.35);
border-radius: 0.7em;
} }
.recordingIcon-active { .recordingIcon-active {
color: #c33 !important; color: #c33 !important;
@ -1506,7 +1509,8 @@ html {
); );
} }
.detailMainContainer-withbackdrop { .detailMainContainer-withbackdrop {
text-shadow: 0.14em 0.14em 0.28em rgba(0, 0, 0, 0.45); text-shadow: 0.18em 0.18em 0.28em rgba(0, 0, 0, 0.45);
padding-bottom: 11em;
} }
.details-additionalContent-withbackdrop { .details-additionalContent-withbackdrop {
--theme-text-color-alpha: 0.85; --theme-text-color-alpha: 0.85;

View File

@ -1099,8 +1099,11 @@ html,
} }
} }
.scrollbuttoncontainer { .scrollbuttoncontainer {
color: #fff; color: white;
background: rgba(20, 20, 20, 0.5); background: hsla(var(--theme-text-color-hue),
var(--theme-text-color-saturation),
var(--theme-text-color-lightness),0.35);
border-radius: 0.7em;
} }
.recordingIcon-active { .recordingIcon-active {
color: #c33 !important; color: #c33 !important;
@ -1355,7 +1358,8 @@ html,
); );
} }
.detailMainContainer-withbackdrop { .detailMainContainer-withbackdrop {
text-shadow: 0.14em 0.14em 0.28em rgba(0, 0, 0, 0.45); text-shadow: 0.18em 0.18em 0.28em rgba(0, 0, 0, 0.45);
padding-bottom: 11em;
} }
.details-additionalContent-withbackdrop { .details-additionalContent-withbackdrop {
--theme-text-color-alpha: 0.85; --theme-text-color-alpha: 0.85;