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

192 lines
3.1 KiB
CSS
Raw Normal View History

2013-04-25 19:28:01 -04:00
.posterItem {
margin: 3px;
text-shadow: none;
font-weight: normal!important;
display: inline-block;
font-size: 14px;
position: relative;
color: #fff;
text-decoration: none;
text-align: left;
overflow: hidden;
}
.posterItem:hover {
-moz-box-shadow: 0 0 20px 3px #2572EB;
-webkit-box-shadow: 0 0 20px 3px #2572EB;
box-shadow: 0 0 20px 3px #2572EB;
}
.posterItemImage {
2013-04-25 20:52:55 -04:00
background-size: 100% auto;
2013-04-25 19:28:01 -04:00
background-repeat: no-repeat;
background-position: center bottom;
}
.defaultPosterItemImage {
background-color: #999;
}
.posterItemText {
text-overflow: ellipsis;
overflow: hidden;
text-wrap: none;
white-space: nowrap;
padding: 4px 5px 4px;
background: #181818;
text-shadow: none;
}
2013-04-25 20:52:55 -04:00
.posterItemTextCentered {
text-align: center;
}
.posterItemText + .posterItemText {
padding-top: 2px;
}
.posterItemDefaultText {
position: absolute;
top: 30%;
left: 0;
right: 0;
text-align: center;
}
2013-04-25 19:28:01 -04:00
.squarePosterItem {
2013-04-25 20:52:55 -04:00
width: 160px;
2013-04-25 19:28:01 -04:00
}
.squarePosterItem .posterItemImage {
2013-04-25 20:52:55 -04:00
height: 160px;
2013-04-25 19:28:01 -04:00
}
.backdropPosterItem {
width: 160px;
}
.backdropPosterItem .posterItemImage {
height: 90px;
}
2013-04-25 20:52:55 -04:00
.portraitPosterItem {
width: 100px;
}
.portraitPosterItem .posterItemImage {
height: 150px;
}
2013-04-25 21:52:29 -04:00
@media all and (min-width: 650px) {
2013-04-25 20:52:55 -04:00
.backdropPosterItem {
width: 192px;
}
.backdropPosterItem .posterItemImage {
height: 108px;
}
2013-04-25 21:52:29 -04:00
}
@media all and (min-width: 750px) {
2013-04-25 20:52:55 -04:00
.squarePosterItem {
width: 160px;
}
.squarePosterItem .posterItemImage {
height: 160px;
}
.portraitPosterItem {
width: 110px;
}
.portraitPosterItem .posterItemImage {
height: 165px;
}
}
@media all and (min-width: 1200px) {
.backdropPosterItem {
width: 272px;
}
.backdropPosterItem .posterItemImage {
height: 153px;
}
.squarePosterItem {
width: 160px;
}
.squarePosterItem .posterItemImage {
height: 160px;
}
.portraitPosterItem {
2013-04-25 21:17:22 -04:00
width: 108px;
2013-04-25 20:52:55 -04:00
}
.portraitPosterItem .posterItemImage {
2013-04-25 21:17:22 -04:00
height: 162px;
2013-04-25 20:52:55 -04:00
}
.posterItem {
font-size: 15px;
}
}
@media all and (min-width: 1440px) {
.squarePosterItem {
width: 170px;
}
.squarePosterItem .posterItemImage {
height: 170px;
}
.portraitPosterItem {
2013-04-25 21:17:22 -04:00
width: 120px;
2013-04-25 20:52:55 -04:00
}
.portraitPosterItem .posterItemImage {
2013-04-25 21:17:22 -04:00
height: 180px;
2013-04-25 20:52:55 -04:00
}
}
@media all and (min-width: 1920px) {
.backdropPosterItem {
2013-04-25 21:52:29 -04:00
width: 320px;
2013-04-25 20:52:55 -04:00
}
.backdropPosterItem .posterItemImage {
2013-04-25 21:52:29 -04:00
height: 180px;
2013-04-25 20:52:55 -04:00
}
.squarePosterItem {
width: 185px;
}
.squarePosterItem .posterItemImage {
height: 185px;
}
.portraitPosterItem {
2013-04-25 21:17:22 -04:00
width: 136px;
2013-04-25 20:52:55 -04:00
}
.portraitPosterItem .posterItemImage {
2013-04-25 21:17:22 -04:00
height: 204px;
2013-04-25 20:52:55 -04:00
}
.posterItem {
font-size: 16px;
}
}