Beautified CSS in web dashboard
This commit is contained in:
parent
6bfd795635
commit
78eeb99284
82 changed files with 15711 additions and 82 deletions
|
@ -1 +1,321 @@
|
|||
.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}
|
||||
.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
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue