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/bower_components/emby-webcomponents/listview/listview.css

321 lines
5.9 KiB
CSS
Raw Normal View History

2018-10-23 01:13:23 +03:00
.listItem-withContentWrapper,
.listItemBody {
-webkit-box-orient: vertical;
-webkit-box-direction: normal
}
.listItemBody,
.listItemBodyText {
overflow: hidden;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.listItem {
background: 0 0;
border: 0;
outline: 0 !important;
color: inherit;
vertical-align: middle;
font-family: inherit;
font-size: inherit;
margin: 0;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
text-align: left;
padding: .25em .25em .25em .5em;
cursor: pointer;
overflow: hidden
}
.listItem-withContentWrapper {
-webkit-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-webkit-align-items: flex-start;
align-items: flex-start
}
.listItem[data-action=none] {
cursor: default
}
.listItem-content {
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
width: 100%
}
.listItemBody,
.listItemButton,
.listItemIcon,
.listItemImage {
display: inline-block;
vertical-align: middle
}
.listItem-button {
width: 100%
}
.listItem-indexnumberleft {
margin-right: 1em
}
.listItem-border {
border-bottom-width: .1em;
border-bottom-style: solid
}
.listItemAside,
.listItemIcon,
.listItemImage {
-webkit-flex-shrink: 0;
flex-shrink: 0
}
.listItemButton {
margin: 0;
-webkit-flex-shrink: 0;
flex-shrink: 0;
contain: layout style
}
.listItemImage,
.listItemImageButton {
display: -webkit-box;
display: -webkit-flex
}
.listViewDragHandle {
margin-left: -.25em !important;
touch-action: none
}
.listItemBody {
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
flex-grow: 1;
padding: .85em .75em;
-webkit-flex-direction: column;
flex-direction: column;
vertical-align: middle;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center
}
.layout-tv .listItemBody {
padding: .35em .75em
}
.listItemBody-noleftpadding {
padding-left: 0 !important
}
.listItemBodyText {
margin: 0;
padding: .1em 0
}
.listItemBodyText-nowrap {
white-space: nowrap
}
.listItemImage {
width: 4em;
height: 4em;
min-width: 2.78em;
min-height: 2.78em;
background-repeat: no-repeat;
-webkit-background-size: contain;
background-size: contain;
-webkit-flex-shrink: 0;
flex-shrink: 0;
background-position: center center;
position: relative;
display: flex
}
.listItemImage-large {
width: 19.5vw;
height: 13vw;
background-position: center center;
margin-right: .75em
}
.listItemImageButton {
-webkit-align-self: center;
align-self: center;
justify-self: center;
margin: auto;
color: rgba(255, 255, 255, .6);
font-size: 1.6em;
background: 0 0;
-webkit-transition: -webkit-transform .2s ease-out;
-o-transition: transform .2s ease-out;
transition: transform .2s ease-out;
display: flex
}
.listItemImageButton:hover {
-webkit-transform: scale(1.2, 1.2);
transform: scale(1.2, 1.2)
}
.listItemImageButton-icon {
background: rgba(0, 0, 0, .4);
border: .08em solid currentColor;
-webkit-border-radius: 100em;
border-radius: 100em;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
padding: .21em
}
@media all and (max-width:64em) {
.listItemImage-large {
width: 33.75vw;
height: 22.5vw;
margin-right: 0 !important
}
.listItemImageButton {
font-size: 1.02em !important
}
.listItemBody {
padding-left: .75em
}
}
@media all and (max-width:50em) {
.listItemBody {
padding-right: .5em
}
}
.listItemImage-large-tv {
width: 30vw !important;
height: 20vw !important
}
.listItemIcon {
width: 1em !important;
height: 1em !important;
font-size: 143%;
padding: 0 .25em 0 0
}
.listItemIcon:not(.listItemIcon-transparent) {
background-color: #52B54B;
color: #fff;
padding: .5em;
-webkit-border-radius: 100em;
border-radius: 100em;
margin: 0 .2em 0 .4em
}
.listItemProgressBar {
position: absolute;
bottom: 0;
left: 0;
right: 0
}
.listItem:focus {
-webkit-border-radius: .2em;
border-radius: .2em
}
.listItem:focus .secondary {
color: inherit !important
}
.listItem-focusscale {
-webkit-transition: -webkit-transform .2s ease-out;
-o-transition: transform .2s ease-out;
transition: transform .2s ease-out
}
.listItem-focusscale:focus {
-webkit-transform: scale(1.025, 1.025);
transform: scale(1.025, 1.025)
}
.paperList {
margin: .5em auto
}
.paperList-clear {
background-color: transparent !important
}
.listItemMediaInfo {
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
margin-right: 1em
}
.listGroupHeader-first {
margin-top: 0
}
.listItemIndicators {
right: .324em;
top: .324em;
position: absolute;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center
}
.listItem,
.listItemBody,
.listItemMediaInfo {
display: -webkit-box;
display: -webkit-flex;
display: flex;
contain: layout style
}
.listItem-bottomoverview {
font-size: 88%;
margin-bottom: 1em;
margin-top: .2em
}
@media all and (max-width:50em) {
.listItem .criticRating,
.listItem .endsAt,
.listItem-overview {
display: none !important
}
}
@media all and (min-width:50em) {
.listItem-bottomoverview {
display: none !important
}
}
.listItemCheckboxContainer {
width: auto !important
}