crabapples
/
noVNC
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make handle as wide as it appears 

Instead of having it stick out on both sides, let's make it as wide as
it appears.
This commit is contained in:
Samuel Mannehed 2016-12-10 09:57:03 +01:00
parent e663da8c32
commit f23c18be27
1 changed files with 20 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
app/styles/base.css
View File

@ -289,20 +289,34 @@ input[type=button]:active, select:active {
#noVNC_control_bar_handle { #noVNC_control_bar_handle {
position: absolute; position: absolute;
left: -15px; left: 100%;
right: auto;
top: 0; top: 0;
transform: translateY(35px); transform: translateY(35px);
width: calc(100% + 30px); width: 15px;
height: 50px; height: 50px;
z-index: -2; z-index: -2;
cursor: pointer; cursor: pointer;
border-radius: 5px; border-radius: 0px 5px 5px 0px;
background-color: rgb(83, 99, 122); background-color: rgb(83, 99, 122);
background-image: url("../images/handle_bg.svg"); background-image: url("../images/handle_bg.svg");
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: right; background-position: right;
box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.5); box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.5);
} }
#noVNC_control_bar_handle::before {
/* This extra element is to get a proper shadow */
content: "";
position: absolute;
height: 3px;
width: 3px;
left: -3px;
top: 100%;
box-shadow: 3px 0 0 rgba(0, 0, 0, 0.5);
}
.noVNC_right #noVNC_control_bar_handle::before {
visibility: hidden;
}
#noVNC_control_bar_handle:after { #noVNC_control_bar_handle:after {
content: ""; content: "";
transition: transform 0.5s ease-in-out; transition: transform 0.5s ease-in-out;
@ -321,6 +335,9 @@ input[type=button]:active, select:active {
} }
.noVNC_right #noVNC_control_bar_handle { .noVNC_right #noVNC_control_bar_handle {
background-position: left; background-position: left;
left: auto;
right: 100%;
border-radius: 5px 0px 0px 5px;
} }
.noVNC_right #noVNC_control_bar_handle:after { .noVNC_right #noVNC_control_bar_handle:after {
left: 5px; left: 5px;