Updated to use CSS3 gradients instead of images.

Fixed display bug with keyboard textbox.
This commit is contained in:
Chris Gordon 2011-09-08 11:27:08 +10:00 committed by Joel Martin
parent 8e0f008841
commit a7eb596d89
2 changed files with 42 additions and 14 deletions

View File

@ -3,10 +3,10 @@ body {
padding:0; padding:0;
font-family: Helvetica; font-family: Helvetica;
/*Background image with light grey curve.*/ /*Background image with light grey curve.*/
background-image:url('../images/screenbg.png'); background-color:#494949;
background-color:#313131;
background-repeat:no-repeat; background-repeat:no-repeat;
background-position:right bottom; background-position:right bottom;
height:100%;
} }
html { html {
@ -44,17 +44,19 @@ html {
/*Mobile buttons bar.*/ /*Mobile buttons bar.*/
#noVNC-control-bar { #noVNC-control-bar {
position:fixed; position:fixed;
background-attachment:initial; background-color:#6d84a2;
background-clip:initial; background-image: -webkit-gradient(
background-color:initial; linear,
background-image:url(../images/bg.png); left bottom,
background-origin:initial; left top,
background-position:50% 0; color-stop(0.5, rgb(109,132,162)),
/* color-stop(1, rgb(140,157,179))
For Black: );
background-position:50% 100%; background-image: -moz-linear-gradient(
*/ center bottom,
background-repeat:repeat no-repeat; rgb(109,132,162) 50%,
rgb(140,157,179) 100%
);
display:block; display:block;
height:44px; height:44px;
left:0; left:0;
@ -135,6 +137,9 @@ html {
display: table; display: table;
width:100%; width:100%;
height:100%; height:100%;
background-color:#313131;
border-bottom-right-radius: 800px 600px;
/*border-top-left-radius: 800px 600px;*/
} }
#VNC_canvas { #VNC_canvas {
background: #eee; background: #eee;
@ -247,3 +252,14 @@ html {
#noVNC_defaultScreen span{ #noVNC_defaultScreen span{
color:green; color:green;
} }
#keyboardinput {
width:0px;
height:0px;
background-color:#313131;
border:0;
}
.noVNC_status_warn {
background-color:yellow;
}

View File

@ -1,5 +1,17 @@
#noVNC-control-bar { #noVNC-control-bar {
background-position:50% 100%; background-color:#000;
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.5, rgb(0,0,0)),
color-stop(0.5, rgb(20,20,20))
);
background-image: -moz-linear-gradient(
center bottom,
rgb(0,0,0) 50%,
rgb(20,20,20) 50%
);
} }
.triangle-right { .triangle-right {