mirror of
git://git.proxmox.com/git/novnc-pve.git
synced 2025-03-11 16:58:31 +03:00
adjust novnc look, to better blend in with web gui
this patch makes the bar white (instead of a blue gradient), yellow in warning state, and red in error state this also makes the buttons blue like our "Create VM" Button Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
This commit is contained in:
Dominik Csapak
Dietmar Maurer
parent
ecdd814018
commit
77d2f9657f
112
debian/patches/fix-base-css.patch
vendored
112
debian/patches/fix-base-css.patch
vendored
@ -48,7 +48,25 @@
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@@ -229,7 +248,7 @@
|
||||
@@ -95,8 +114,7 @@
|
||||
padding-top: 4px;
|
||||
height:32px;
|
||||
text-align: center;
|
||||
- font-weight: bold;
|
||||
- color: #fff;
|
||||
+ color: #000;
|
||||
}
|
||||
|
||||
#noVNC_settings_menu {
|
||||
@@ -202,7 +220,6 @@
|
||||
width:auto;
|
||||
|
||||
text-align:center;
|
||||
- font-weight:bold;
|
||||
word-wrap:break-word;
|
||||
color:#fff;
|
||||
background:rgba(0,0,0,0.65);
|
||||
@@ -229,7 +246,7 @@
|
||||
position:fixed;
|
||||
}
|
||||
#noVNC_clipboard.top:after {
|
||||
@ -57,7 +75,93 @@
|
||||
}
|
||||
|
||||
#keyboardinput {
|
||||
@@ -389,7 +408,7 @@
|
||||
@@ -249,31 +266,13 @@
|
||||
*/
|
||||
|
||||
.noVNC_status_normal {
|
||||
- background: #b2bdcd; /* Old browsers */
|
||||
- background: -moz-linear-gradient(top, #b2bdcd 0%, #899cb3 49%, #7e93af 51%, #6e84a3 100%); /* FF3.6+ */
|
||||
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2bdcd), color-stop(49%,#899cb3), color-stop(51%,#7e93af), color-stop(100%,#6e84a3)); /* Chrome,Safari4+ */
|
||||
- background: -webkit-linear-gradient(top, #b2bdcd 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* Chrome10+,Safari5.1+ */
|
||||
- background: -o-linear-gradient(top, #b2bdcd 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* Opera11.10+ */
|
||||
- background: -ms-linear-gradient(top, #b2bdcd 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* IE10+ */
|
||||
- background: linear-gradient(top, #b2bdcd 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* W3C */
|
||||
+ background: #fff;
|
||||
}
|
||||
.noVNC_status_error {
|
||||
- background: #f04040; /* Old browsers */
|
||||
- background: -moz-linear-gradient(top, #f04040 0%, #899cb3 49%, #7e93af 51%, #6e84a3 100%); /* FF3.6+ */
|
||||
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f04040), color-stop(49%,#899cb3), color-stop(51%,#7e93af), color-stop(100%,#6e84a3)); /* Chrome,Safari4+ */
|
||||
- background: -webkit-linear-gradient(top, #f04040 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* Chrome10+,Safari5.1+ */
|
||||
- background: -o-linear-gradient(top, #f04040 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* Opera11.10+ */
|
||||
- background: -ms-linear-gradient(top, #f04040 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* IE10+ */
|
||||
- background: linear-gradient(top, #f04040 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* W3C */
|
||||
+ background: #ff6666;
|
||||
}
|
||||
.noVNC_status_warn {
|
||||
- background: #f0f040; /* Old browsers */
|
||||
- background: -moz-linear-gradient(top, #f0f040 0%, #899cb3 49%, #7e93af 51%, #6e84a3 100%); /* FF3.6+ */
|
||||
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f0f040), color-stop(49%,#899cb3), color-stop(51%,#7e93af), color-stop(100%,#6e84a3)); /* Chrome,Safari4+ */
|
||||
- background: -webkit-linear-gradient(top, #f0f040 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* Chrome10+,Safari5.1+ */
|
||||
- background: -o-linear-gradient(top, #f0f040 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* Opera11.10+ */
|
||||
- background: -ms-linear-gradient(top, #f0f040 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* IE10+ */
|
||||
- background: linear-gradient(top, #f0f040 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* W3C */
|
||||
+ background: #ffff80;
|
||||
}
|
||||
|
||||
/* Control bar */
|
||||
@@ -291,36 +290,25 @@
|
||||
.noVNC_status_button {
|
||||
padding: 4px 4px;
|
||||
vertical-align: middle;
|
||||
- border:1px solid #869dbc;
|
||||
- -webkit-border-radius: 6px;
|
||||
- -moz-border-radius: 6px;
|
||||
- border-radius: 6px;
|
||||
- background: #b2bdcd; /* Old browsers */
|
||||
- background: -moz-linear-gradient(top, #b2bdcd 0%, #899cb3 49%, #7e93af 51%, #6e84a3 100%); /* FF3.6+ */
|
||||
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2bdcd), color-stop(49%,#899cb3), color-stop(51%,#7e93af), color-stop(100%,#6e84a3)); /* Chrome,Safari4+ */
|
||||
- background: -webkit-linear-gradient(top, #b2bdcd 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* Chrome10+,Safari5.1+ */
|
||||
- background: -o-linear-gradient(top, #b2bdcd 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* Opera11.10+ */
|
||||
- background: -ms-linear-gradient(top, #b2bdcd 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* IE10+ */
|
||||
- filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2bdcd', endColorstr='#6e84a3',GradientType=0 ); /* IE6-9 */
|
||||
- background: linear-gradient(top, #b2bdcd 0%,#899cb3 49%,#7e93af 51%,#6e84a3 100%); /* W3C */
|
||||
- /*box-shadow:inset 0.4px 0.4px 0.4px #000000;*/
|
||||
+ height:20px;
|
||||
+ margin: 3px 0;
|
||||
+ border:1px solid #3892d4;
|
||||
+ -webkit-border-radius: 3px;
|
||||
+ -moz-border-radius: 3px;
|
||||
+ border-radius: 3px;
|
||||
+ background: #3892d4;
|
||||
}
|
||||
|
||||
.noVNC_status_button_selected {
|
||||
padding: 4px 4px;
|
||||
vertical-align: middle;
|
||||
- border:1px solid #4366a9;
|
||||
- -webkit-border-radius: 6px;
|
||||
- -moz-border-radius: 6px;
|
||||
- background: #779ced; /* Old browsers */
|
||||
- background: -moz-linear-gradient(top, #779ced 0%, #3970e0 49%, #2160dd 51%, #2463df 100%); /* FF3.6+ */
|
||||
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#779ced), color-stop(49%,#3970e0), color-stop(51%,#2160dd), color-stop(100%,#2463df)); /* Chrome,Safari4+ */
|
||||
- background: -webkit-linear-gradient(top, #779ced 0%,#3970e0 49%,#2160dd 51%,#2463df 100%); /* Chrome10+,Safari5.1+ */
|
||||
- background: -o-linear-gradient(top, #779ced 0%,#3970e0 49%,#2160dd 51%,#2463df 100%); /* Opera11.10+ */
|
||||
- background: -ms-linear-gradient(top, #779ced 0%,#3970e0 49%,#2160dd 51%,#2463df 100%); /* IE10+ */
|
||||
- filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#779ced', endColorstr='#2463df',GradientType=0 ); /* IE6-9 */
|
||||
- background: linear-gradient(top, #779ced 0%,#3970e0 49%,#2160dd 51%,#2463df 100%); /* W3C */
|
||||
- /*box-shadow:inset 0.4px 0.4px 0.4px #000000;*/
|
||||
+ height:20px;
|
||||
+ margin: 3px 0;
|
||||
+ border:1px solid #3892d4;
|
||||
+ -webkit-border-radius: 3px;
|
||||
+ -moz-border-radius: 3px;
|
||||
+ border-radius: 3px;
|
||||
+ background: #3892d4;
|
||||
}
|
||||
|
||||
.noVNC_status_button:disabled {
|
||||
@@ -389,7 +377,7 @@
|
||||
}
|
||||
|
||||
#noVNC_logo {
|
||||
@ -66,7 +170,7 @@
|
||||
margin-left: 10px;
|
||||
color:yellow;
|
||||
text-align:left;
|
||||
@@ -446,6 +465,7 @@
|
||||
@@ -446,6 +434,7 @@
|
||||
#toggleAltButton { display: inline; }
|
||||
#sendTabButton { display: inline; }
|
||||
#sendEscButton { display: inline; }
|
||||
@ -74,7 +178,7 @@
|
||||
|
||||
/* left-align the status text on lower resolutions */
|
||||
@media screen and (max-width: 800px){
|
||||
@@ -502,6 +522,14 @@
|
||||
@@ -502,6 +491,14 @@
|
||||
top: 135px;
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user