mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
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,155 @@
|
|||
.mdl-switch{position:relative;z-index:1;vertical-align:middle;display:-webkit-inline-box;display:-webkit-inline-flex;display:inline-flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;margin:0;padding:0;overflow:visible;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-webkit-flex-direction:row-reverse;flex-direction:row-reverse;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end}.toggleContainer{margin-bottom:1.8em}.mdl-switch__input{width:0;height:0;margin:0;padding:0;opacity:0;-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:none}.mdl-switch__trackContainer{position:relative;width:2.9em}.mdl-switch__track{background:rgba(0,0,0,.2);height:1em;-webkit-border-radius:1em;border-radius:1em;cursor:pointer}.mdl-switch__input:checked+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__track{background:rgba(82,181,75,.5)}.mdl-switch__input[disabled]+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__track{background:rgba(0,0,0,.12);cursor:auto}.mdl-switch__thumb{background:#999;position:absolute;left:0;top:-.25em;height:1.44em;width:1.44em;-webkit-border-radius:50%;border-radius:50%;cursor:pointer;-webkit-box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);-webkit-transition-duration:.28s;-o-transition-duration:.28s;transition-duration:.28s;-webkit-transition-timing-function:cubic-bezier(.4,0,.2,1);-o-transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(.4,0,.2,1);-webkit-transition-property:left;-o-transition-property:left;transition-property:left;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center}.mdl-switch__input:checked+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__thumb{background:#52b54b;left:1.466em;-webkit-box-shadow:0 3px .28em 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px .56em 0 rgba(0,0,0,.12);box-shadow:0 3px .28em 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px .56em 0 rgba(0,0,0,.12)}.mdl-switch__input[disabled]+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__thumb{background:#bdbdbd;cursor:auto}.mdl-switch__focus-helper{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;width:.6em;height:.6em;-webkit-border-radius:50%;border-radius:50%;background-color:transparent}.mdl-switch__input:focus+.mdl-switch__label+.mdl-switch__trackContainer .mdl-switch__focus-helper{-webkit-box-shadow:0 0 0 1.39em rgba(0,0,0,.05);box-shadow:0 0 0 1.39em rgba(0,0,0,.05)}.mdl-switch__input:checked:focus+.mdl-switch__label+.mdl-switch__trackContainer .mdl-switch__focus-helper{-webkit-box-shadow:0 0 0 1.39em rgba(82,181,75,.26);box-shadow:0 0 0 1.39em rgba(82,181,75,.26);background-color:rgba(82,181,75,.26)}.mdl-switch__label{cursor:pointer;margin:0 0 0 .7em;display:-webkit-inline-box;display:-webkit-inline-flex;display:inline-flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.mdl-switch__input[disabled] .mdl-switch__label{color:#bdbdbd;cursor:auto}
|
||||
.mdl-switch {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
vertical-align: middle;
|
||||
display: -webkit-inline-box;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: visible;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: reverse;
|
||||
-webkit-flex-direction: row-reverse;
|
||||
flex-direction: row-reverse;
|
||||
-webkit-box-pack: end;
|
||||
-webkit-justify-content: flex-end;
|
||||
justify-content: flex-end
|
||||
}
|
||||
|
||||
.toggleContainer {
|
||||
margin-bottom: 1.8em
|
||||
}
|
||||
|
||||
.mdl-switch__input {
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
opacity: 0;
|
||||
-ms-appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
border: none
|
||||
}
|
||||
|
||||
.mdl-switch__trackContainer {
|
||||
position: relative;
|
||||
width: 2.9em
|
||||
}
|
||||
|
||||
.mdl-switch__track {
|
||||
background: rgba(0, 0, 0, .2);
|
||||
height: 1em;
|
||||
-webkit-border-radius: 1em;
|
||||
border-radius: 1em;
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.mdl-switch__input:checked+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__track {
|
||||
background: rgba(82, 181, 75, .5)
|
||||
}
|
||||
|
||||
.mdl-switch__input[disabled]+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__track {
|
||||
background: rgba(0, 0, 0, .12);
|
||||
cursor: auto
|
||||
}
|
||||
|
||||
.mdl-switch__thumb {
|
||||
background: #999;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: -.25em;
|
||||
height: 1.44em;
|
||||
width: 1.44em;
|
||||
-webkit-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
-webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
|
||||
-webkit-transition-duration: .28s;
|
||||
-o-transition-duration: .28s;
|
||||
transition-duration: .28s;
|
||||
-webkit-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
|
||||
-o-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
|
||||
transition-timing-function: cubic-bezier(.4, 0, .2, 1);
|
||||
-webkit-transition-property: left;
|
||||
-o-transition-property: left;
|
||||
transition-property: left;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
.mdl-switch__input:checked+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__thumb {
|
||||
background: #52b54b;
|
||||
left: 1.466em;
|
||||
-webkit-box-shadow: 0 3px .28em 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px .56em 0 rgba(0, 0, 0, .12);
|
||||
box-shadow: 0 3px .28em 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px .56em 0 rgba(0, 0, 0, .12)
|
||||
}
|
||||
|
||||
.mdl-switch__input[disabled]+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__thumb {
|
||||
background: #bdbdbd;
|
||||
cursor: auto
|
||||
}
|
||||
|
||||
.mdl-switch__focus-helper {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
display: inline-block;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
width: .6em;
|
||||
height: .6em;
|
||||
-webkit-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
.mdl-switch__input:focus+.mdl-switch__label+.mdl-switch__trackContainer .mdl-switch__focus-helper {
|
||||
-webkit-box-shadow: 0 0 0 1.39em rgba(0, 0, 0, .05);
|
||||
box-shadow: 0 0 0 1.39em rgba(0, 0, 0, .05)
|
||||
}
|
||||
|
||||
.mdl-switch__input:checked:focus+.mdl-switch__label+.mdl-switch__trackContainer .mdl-switch__focus-helper {
|
||||
-webkit-box-shadow: 0 0 0 1.39em rgba(82, 181, 75, .26);
|
||||
box-shadow: 0 0 0 1.39em rgba(82, 181, 75, .26);
|
||||
background-color: rgba(82, 181, 75, .26)
|
||||
}
|
||||
|
||||
.mdl-switch__label {
|
||||
cursor: pointer;
|
||||
margin: 0 0 0 .7em;
|
||||
display: -webkit-inline-box;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.mdl-switch__input[disabled] .mdl-switch__label {
|
||||
color: #bdbdbd;
|
||||
cursor: auto
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue