GitHub/noVNC
1
0
Fork 0
mirror of https://github.com/novnc/noVNC.git synced 2026-06-02 10:29:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

* On low resolution devices the status text is now justified to the left

Browse Source 
button group instead of centered.
* On low resolution devices the padding towards the edges of the screen of
  the left and right button groups are now removed.
* Since the status_bar was merged into the control-bar the actual status_bar
  element became redundant and was therefor removed.
* Improved the style of the control-bar when there is an error or a warning.
* Implemented a fix so that vnc_auto.html works as intended with the improved
  screen real estate patch.
This commit is contained in:
samhed
2013-07-17 16:11:19 +02:00
parent 6ca8a2c05c
commit 35b29c98ea
6 changed files with 117 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
include/base.css
View File

@@ -51,7 +51,6 @@ html {
float:right;
}
#noVNC_view_drag_button {
display: none;
}
@@ -64,7 +63,6 @@ html {
.noVNC-buttons-left {
float: left;
padding-left:10px;
z-index: 1;
position: relative;
}
@@ -72,30 +70,19 @@ html {
.noVNC-buttons-right {
float:right;
right: 0px;
padding-right:10px;
z-index: 1;
position: relative;
}
#noVNC_status_bar {
margin-top: 0px;
padding: 0px;
z-index: 0;
z-index: 2;
position: absolute;
width: 100%;
}
#noVNC_status_bar div {
font-size: 12px;
padding-top: 4px;
}
#noVNC_status {
font-size: 12px;
padding-top: 4px;
height:32px;
text-align: center;
font-weight: bold;
color: #fff;
}
#noVNC_settings_menu {
margin: 3px;
text-align: left;
@@ -110,16 +97,6 @@ html {
float:right;
}
.noVNC_status_normal {
background: transparent;
}
.noVNC_status_error {
background: rgba(240,64,64,0.5);
}
.noVNC_status_warn {
background: rgba(240,240,64,0.5);
}
/* Do not set width/height for VNC_screen or VNC_canvas or incorrect
* scaling will occur. Canvas resizes to remote VNC settings */
#noVNC_screen_pad {
@@ -238,9 +215,7 @@ html {
* Advanced Styling
*/
/* Control bar */
#noVNC-control-bar {
position:fixed;
.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+ */
@@ -248,7 +223,30 @@ html {
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 */
}
.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 */
}
.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 */
}
/* Control bar */
#noVNC-control-bar {
position:fixed;
display:block;
height:36px;
left:0;
@@ -391,10 +389,39 @@ html {
font-size: 180px;
}
@media screen and (min-width: 481px) and (max-width: 640px) {
.noVNC-buttons-left {
padding-left: 10px;
}
.noVNC-buttons-right {
padding-right: 10px;
}
#noVNC_status {
z-index: 0;
position: absolute;
width: 100%;
}
@media screen and (max-width: 640px){
.noVNC_status_button {
font-size: 10px;
}
.noVNC-buttons-left {
padding-left: 0px;
}
.noVNC-buttons-right {
padding-right: 0px;
}
#noVNC_status {
z-index: 1;
position: relative;
width: auto;
float: left;
}
}
@media screen and (min-width: 481px) and (max-width: 640px) {
#noVNC_clipboard_text {
width: 410px;
}
@@ -404,9 +431,6 @@ html {
}
@media screen and (min-width: 321px) and (max-width: 480px) {
.noVNC_status_button {
font-size: 10px;
}
#noVNC_clipboard_text {
width: 250px;
}