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

update list styles

This commit is contained in:
Luke Pulverenti 2016-08-05 15:34:10 -04:00
parent 5b72e1c91b
commit fad66be11a
23 changed files with 183 additions and 279 deletions

View file

@ -16,16 +16,18 @@ button.listItem {
display: block;
align-items: center;
text-align: left;
padding: .25em .25em .25em .25em !important;
line-height: 170%;
padding: .25em 1.15em;
line-height: 160%;
border-bottom: 1px solid #2a2a2a;
}
div.listItem {
cursor: pointer;
}
.listItem.largeImage {
.listItem-nosidepadding {
padding-left: 0;
padding-right: 0;
}
.listItem-largeImage {
padding: .5em !important;
}
@ -57,27 +59,16 @@ div.listItem {
min-height: 48px;
}
.listItemBody.two-line {
min-height: 72px;
padding-top: 0;
padding-bottom: 0;
}
.two-line {
min-height: 72px;
padding-top: 0;
padding-bottom: 0;
}
.listItemBody.three-line {
min-height: 88px;
padding-top: 0;
padding-bottom: 0;
}
.listItemBody h2, .listItemBody h3 {
margin: 0;
padding: 0;
overflow: hidden;
text-overflow: ellipsis;
}
.layout-tv .listItemBody h3 {
padding: 0;
.three-line {
min-height: 88px;
padding-top: 0;
padding-bottom: 0;
}
.listItemBody > div:not(.secondary) {
@ -85,10 +76,16 @@ div.listItem {
}
.listItemBodyText {
margin: 0;
padding: 0;
overflow: hidden;
text-overflow: ellipsis;
}
.listItemBodyText-nowrap {
white-space: nowrap;
}
.listItemImage {
width: 7.4vh;
height: 7.4vh;
@ -101,6 +98,14 @@ div.listItem {
position: relative;
}
.listItemImage-large {
width: 45vh;
height: 30vh;
background-position: center center;
margin-right: 2%;
margin-left: 1%;
}
.listItemIcon {
width: auto !important;
height: auto !important;
@ -112,14 +117,6 @@ div.listItem {
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
}
.listItem.largeImage .listItemImage {
width: 45vh;
height: 30vh;
background-position: center center;
margin-right: 2%;
margin-left: 1%;
}
.listItemImage .itemProgressBar {
position: absolute;
bottom: 0;
@ -128,7 +125,7 @@ div.listItem {
}
.listItem .secondary {
color: #737373;
color: #888;
}
.listItem:focus .secondary {
@ -143,14 +140,6 @@ div.listItem {
transform: scale(1.025, 1.025);
}
.listItem > .fab:first-child, .listItem > i:first-child {
margin-left: .3em;
}
.paperList .listItem > .fab:first-child, .paperList .listItem > i:first-child {
margin-left: .65em;
}
.paperList {
padding: .5em 0;
margin: 1em auto;
@ -166,25 +155,23 @@ div.listItem {
border-bottom: 0;
}
.listItemMediaInfo {
align-items: center;
}
.layout-tv .listItemMediaInfo {
margin: .5em 0;
}
.listItemMediaInfo > * {
display: inline-block;
.listItemMediaInfo {
/* Don't display if flex not supported */
display: none;
align-items: center;
}
.listGroupHeader {
margin: 2em 0 1em;
}
.listGroupHeader.first {
margin-top: 0;
}
.listGroupHeader-first {
margin-top: 0;
}
.listItem .indicators {
right: .5vh;
@ -196,10 +183,6 @@ div.listItem {
@supports (display: flex) {
.listItem > * {
display: flex;
}
.listItem, .listItemBody, .listItemMediaInfo {
display: flex;
}