1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

rework library buttons

This commit is contained in:
Luke Pulverenti 2015-05-07 00:14:35 -04:00
parent 173773d5bc
commit eac4ec9324
6 changed files with 109 additions and 184 deletions

View file

@ -39,10 +39,8 @@
text-overflow: ellipsis;
}
.smallBackdropPosterItem .cardOverlayInner > div {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
.buttonCard:hover .cardBox {
opacity: .6;
}
.cardBox {
@ -233,10 +231,10 @@
height: 100%;
}
.cardImage canvas {
width: 100%;
height: 100%;
}
.cardImage canvas {
width: 100%;
height: 100%;
}
.coveredCardImage {
background-size: cover;

View file

@ -42,6 +42,12 @@
white-space: nowrap;
}
.smallBackdropPosterItem .cardOverlayInner > div {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.chapterPosterItem {
width: 240px!important;
cursor: pointer;

View file

@ -405,145 +405,4 @@
padding: 5px 4px 4px;
text-shadow: none;
font-weight: 400;
}
.posterItemImage {
background-size: contain;
background-repeat: no-repeat;
background-position: center bottom;
background-color: #000;
position: relative;
}
.myLibraryPosterItem {
width: 42%;
min-width: 50px;
}
.myLibraryPosterItem .posterItemImage {
height: 34px;
background-position: 9px center;
background-size: 14px 14px;
background-color: rgba(51, 136, 204, 0.7);
background-color: rgba(82, 181, 75, 0.7);
}
.myLibraryPosterItem .posterItemText {
top: 0;
left: 0;
line-height: 34px;
text-align: left;
padding: 0 0 0 12px;
position: absolute;
}
.myLibraryPosterItem i {
margin-right: 10px;
}
.moviesPosterItem .posterItemImage, .trailersPosterItem .posterItemImage {
background-color: rgba(176, 94, 81, 0.7);
}
.musicPosterItem .posterItemImage {
background-color: rgba(217, 145, 67, 0.7);
}
.tvshowsPosterItem .posterItemImage {
background-color: rgba(77, 88, 164, 0.7);
}
.gamesPosterItem .posterItemImage {
background-color: rgba(183, 202, 72, 0.7);
}
.channelsPosterItem .posterItemImage {
background-color: rgba(51, 136, 204, 0.7);
}
.livetvPosterItem .posterItemImage {
background-color: rgba(255, 233, 127, 0.7);
}
.homevideosPosterItem .posterItemImage {
background-color: rgba(110, 52, 32, 0.7);
}
.photosPosterItem .posterItemImage {
background-color: rgba(127, 0, 0, 0.7);
}
.musicvideosPosterItem .posterItemImage {
background-color: rgba(143, 54, 168, 0.7);
}
@media all and (min-width: 600px) {
.myLibraryPosterItem {
width: 31%;
/* Specify a min width just in case the container doesn't have a width */
min-width: 160px;
}
}
@media all and (min-width: 800px) {
.myLibraryPosterItem {
width: 32%;
/* Specify a min width just in case the container doesn't have a width */
min-width: 160px;
}
}
@media all and (min-width: 1000px) {
.myLibraryPosterItem {
width: 23.5%;
/* Specify a min width just in case the container doesn't have a width */
min-width: 220px;
}
}
@media all and (min-width: 1200px) {
.myLibraryPosterItem {
width: 24.0%;
}
}
@media all and (min-width: 1440px) {
.myLibraryPosterItem {
width: 19.0%;
/* Specify a min width just in case the container doesn't have a width */
min-width: 220px;
}
}
@media all and (min-width: 1600px) {
.myLibraryPosterItem {
width: 15.5%;
}
}
@media all and (min-width: 1700px) {
.myLibraryPosterItem {
width: 16%;
}
}
@media all and (min-width: 2000px) {
.myLibraryPosterItem {
width: 13.5%;
}
}
@media all and (min-width: 2300px) {
.myLibraryPosterItem {
width: 13.8%;
}
}
}