GithubFollow/One-KVM
1
0
Fork 0
mirror of https://github.com/mofeng-git/One-KVM.git synced 2026-01-30 09:31:53 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

pretty ui

Browse Source
This commit is contained in:
Devaev Maxim
2018-07-16 23:29:29 +03:00
parent eda2949809
commit ddabd32807
3 changed files with 242 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
kvmd/web/css/main.css
View File

@@ -1,3 +1,99 @@
body {
margin: 0px;
}
img#logo {
height: 24px;
-webkit-filter: invert(0.7);
filter: invert(0.7);
}
div.centered {
position: absolute;
top: 8%;
left: 50%;
-webkit-transform: translate(-50%);
-moz-transform: translate(-50%);
transform: translate(-50%);
}
ul#ctl {
list-style-type: none;
margin: 0;
padding: 0;
background-color: #333;
position: fixed;
top: 0;
width: 100%;
z-index: 1;
}
ul#ctl li a:hover:not(.active) {
background-color: #111;
}
ul#ctl li.ctl-left {
float: left;
}
ul#ctl li.ctl-left-sep:last-child {
float: left;
border-right: 1px solid black;
}
ul#ctl li.ctl-right {
float: right;
}
ul#ctl li.ctl-right-sep:not(last-child) {
float: right;
border-left: 1px solid black;
}
ul#ctl p {
color: #aeaeae;
margin: 0px;
padding: 15px 16px;
}
ul#ctl img {
margin: 0px;
padding: 11px 11px;
}
ul#ctl a.ctl-item {
display: block;
color: #e1e1e1;
text-align: center;
padding: 15px 16px;
text-decoration: none;
}
div.ctl-dropdown {
position: relative;
display: inline-block;
}
div.ctl-dropdown-content {
display: none;
position: absolute;
background-color: #e1e1e1;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 2;
}
div.ctl-dropdown:hover .ctl-dropdown-content {
display: block;
}
div.ctl-dropdown:hover .ctl-item {
background-color: #111;
}
div.ctl-dropdown-content button {
/*color: #111;*/
display: block;
width: 100%;
white-space:nowrap;
height: 30px!important;
font-size: 16px!important;
text-align: left;
}
div.ctl-dropdown-content button:enabled:hover {
color: white;
background-color: #5f5f5f!important;
}
div.ctl-dropdown-content hr {
margin: 0px;
}
div#stream-box {
box-sizing: border-box;
display: inline-block;
@@ -30,20 +126,20 @@ img#hid-keyboard-led {
height: 24px;
}
img.led-on {
-webkit-filter: invert(.5) sepia(1) saturate(5) hue-rotate(100deg);
filter: invert(.5) sepia(1) saturate(5) hue-rotate(100deg);
-webkit-filter: invert(0.5) sepia(1) saturate(5) hue-rotate(100deg);
filter: invert(0.5) sepia(1) saturate(5) hue-rotate(100deg);
}
img.led-off {
-webkit-filter: invert(.5);
filter: invert(.5);
-webkit-filter: invert(0.5);
filter: invert(0.5);
}
img.led-hdd-busy {
-webkit-filter: invert(.5) sepia(1) saturate(15) hue-rotate(320deg);
filter: invert(.5) sepia(1) saturate(15) hue-rotate(320deg);
-webkit-filter: invert(0.5) sepia(1) saturate(15) hue-rotate(320deg);
filter: invert(0.5) sepia(1) saturate(15) hue-rotate(320deg);
}
img.led-msd-writing {
-webkit-filter: invert(.5) sepia(1) saturate(5) hue-rotate(0deg);
filter: invert(.5) sepia(1) saturate(5) hue-rotate(0deg);
-webkit-filter: invert(0.5) sepia(1) saturate(5) hue-rotate(0deg);
filter: invert(0.5) sepia(1) saturate(5) hue-rotate(0deg);
-webkit-animation:spin 2s linear infinite;
-moz-animation:spin 2s linear infinite;
animation:spin 2s linear infinite;
@@ -51,10 +147,3 @@ img.led-msd-writing {
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
button#stream-reset-button,
button#atx-power-button,
button#atx-power-button-long,
button#atx-reset-button {
height: 24px;
}