Make "selected" an extra CSS class
Avoid duplicating stuff in the style sheet by making the "selected" property an extra class, rather than a replacement for the base one.
This commit is contained in:
Pierre Ossman
parent
a49d929846
commit
d9e8621436
|
|
@ -60,12 +60,8 @@ html {
|
|||
/*box-shadow:inset 0.4px 0.4px 0.4px #000000;*/
|
||||
font-size: 12px;
|
||||
}
|
||||
.noVNC_button_selected {
|
||||
padding: 4px 4px;
|
||||
vertical-align: middle;
|
||||
border:1px solid #4366a9;
|
||||
-webkit-border-radius: 6px;
|
||||
-moz-border-radius: 6px;
|
||||
.noVNC_button.noVNC_selected {
|
||||
border-color: #4366a9;
|
||||
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+ */
|
||||
|
|
@ -74,7 +70,6 @@ html {
|
|||
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;*/
|
||||
}
|
||||
.noVNC_button:disabled {
|
||||
opacity: 0.4;
|
||||
|
|
|
|||
48
app/ui.js
48
app/ui.js
|
|
@ -592,7 +592,7 @@ var UI;
|
|||
document.getElementById('noVNC_settings')
|
||||
.classList.add("noVNC_open");
|
||||
document.getElementById('noVNC_settings_button')
|
||||
.className = "noVNC_button_selected";
|
||||
.classList.add("noVNC_selected");
|
||||
UI.settingsOpen = true;
|
||||
},
|
||||
|
||||
|
|
@ -601,7 +601,7 @@ var UI;
|
|||
document.getElementById('noVNC_settings')
|
||||
.classList.remove("noVNC_open");
|
||||
document.getElementById('noVNC_settings_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
UI.settingsOpen = false;
|
||||
},
|
||||
|
||||
|
|
@ -660,13 +660,13 @@ var UI;
|
|||
document.getElementById('noVNC_xvp')
|
||||
.classList.remove("noVNC_open");
|
||||
document.getElementById('noVNC_xvp_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
UI.xvpOpen = false;
|
||||
} else {
|
||||
document.getElementById('noVNC_xvp')
|
||||
.classList.add("noVNC_open");
|
||||
document.getElementById('noVNC_xvp_button')
|
||||
.className = "noVNC_button_selected";
|
||||
.classList.add("noVNC_selected");
|
||||
UI.xvpOpen = true;
|
||||
}
|
||||
},
|
||||
|
|
@ -712,13 +712,13 @@ var UI;
|
|||
document.getElementById('noVNC_clipboard')
|
||||
.classList.remove("noVNC_open");
|
||||
document.getElementById('noVNC_clipboard_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
UI.clipboardOpen = false;
|
||||
} else {
|
||||
document.getElementById('noVNC_clipboard')
|
||||
.classList.add("noVNC_open");
|
||||
document.getElementById('noVNC_clipboard_button')
|
||||
.className = "noVNC_button_selected";
|
||||
.classList.add("noVNC_selected");
|
||||
UI.clipboardOpen = true;
|
||||
}
|
||||
},
|
||||
|
|
@ -754,7 +754,7 @@ var UI;
|
|||
UI.settingsApply();
|
||||
UI.closeSettingsMenu();
|
||||
document.getElementById('noVNC_connect_controls_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
}
|
||||
// Close clipboard panel if open
|
||||
if (UI.clipboardOpen === true) {
|
||||
|
|
@ -770,7 +770,7 @@ var UI;
|
|||
document.getElementById('noVNC_connect_controls')
|
||||
.classList.remove("noVNC_open");
|
||||
document.getElementById('noVNC_connect_controls_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
UI.connSettingsOpen = false;
|
||||
UI.saveSetting('host');
|
||||
UI.saveSetting('port');
|
||||
|
|
@ -780,7 +780,7 @@ var UI;
|
|||
document.getElementById('noVNC_connect_controls')
|
||||
.classList.add("noVNC_open");
|
||||
document.getElementById('noVNC_connect_controls_button')
|
||||
.className = "noVNC_button_selected";
|
||||
.classList.add("noVNC_selected");
|
||||
UI.connSettingsOpen = true;
|
||||
document.getElementById('noVNC_setting_host').focus();
|
||||
}
|
||||
|
|
@ -881,10 +881,10 @@ var UI;
|
|||
document.webkitFullscreenElement ||
|
||||
document.msFullscreenElement ) {
|
||||
document.getElementById('noVNC_fullscreen_button')
|
||||
.className = "noVNC_button_selected";
|
||||
.classList.add("noVNC_selected");
|
||||
} else {
|
||||
document.getElementById('noVNC_fullscreen_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -1106,9 +1106,9 @@ var UI;
|
|||
}
|
||||
|
||||
if (UI.rfb.get_viewportDrag()) {
|
||||
viewDragButton.className = "noVNC_button_selected";
|
||||
viewDragButton.classList.add("noVNC_selected");
|
||||
} else {
|
||||
viewDragButton.className = "noVNC_button";
|
||||
viewDragButton.classList.remove("noVNC_selected");
|
||||
}
|
||||
|
||||
// Different behaviour for touch vs non-touch
|
||||
|
|
@ -1149,17 +1149,17 @@ var UI;
|
|||
try { kbi.setSelectionRange(l, l); } // Move the caret to the end
|
||||
catch (err) {} // setSelectionRange is undefined in Google Chrome
|
||||
UI.keyboardVisible = true;
|
||||
skb.className = "noVNC_button_selected";
|
||||
skb.classList.add("noVNC_selected");
|
||||
} else if(UI.keyboardVisible === true) {
|
||||
kbi.blur();
|
||||
skb.className = "noVNC_button";
|
||||
skb.classList.remove("noVNC_selected");
|
||||
UI.keyboardVisible = false;
|
||||
}
|
||||
},
|
||||
|
||||
hideKeyboard: function() {
|
||||
document.getElementById('noVNC_keyboard_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
//Weird bug in iOS if you change keyboardVisible
|
||||
//here it does not actually occur so next time
|
||||
//you click keyboard icon it doesnt work.
|
||||
|
|
@ -1173,11 +1173,11 @@ var UI;
|
|||
if(UI.keyboardVisible === true) {
|
||||
document.getElementById('noVNC_keyboardinput').focus();
|
||||
document.getElementById('noVNC_keyboard_button')
|
||||
.className = "noVNC_button_selected";
|
||||
.classList.add("noVNC_selected");
|
||||
} else if(UI.keyboardVisible === false) {
|
||||
document.getElementById('noVNC_keyboardinput').blur();
|
||||
document.getElementById('noVNC_keyboard_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -1264,13 +1264,13 @@ var UI;
|
|||
document.getElementById('noVNC_modifiers')
|
||||
.classList.add("noVNC_open");
|
||||
document.getElementById('noVNC_toggle_extra_keys_button')
|
||||
.className = "noVNC_button_selected";
|
||||
.classList.add("noVNC_selected");
|
||||
UI.extraKeysVisible = true;
|
||||
} else if(UI.extraKeysVisible === true) {
|
||||
document.getElementById('noVNC_modifiers')
|
||||
.classList.remove("noVNC_open");
|
||||
document.getElementById('noVNC_toggle_extra_keys_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
UI.extraKeysVisible = false;
|
||||
}
|
||||
},
|
||||
|
|
@ -1290,12 +1290,12 @@ var UI;
|
|||
if(UI.ctrlOn === false) {
|
||||
UI.rfb.sendKey(KeyTable.XK_Control_L, true);
|
||||
document.getElementById('noVNC_toggle_ctrl_button')
|
||||
.className = "noVNC_button_selected";
|
||||
.classList.add("noVNC_selected");
|
||||
UI.ctrlOn = true;
|
||||
} else if(UI.ctrlOn === true) {
|
||||
UI.rfb.sendKey(KeyTable.XK_Control_L, false);
|
||||
document.getElementById('noVNC_toggle_ctrl_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
UI.ctrlOn = false;
|
||||
}
|
||||
},
|
||||
|
|
@ -1305,12 +1305,12 @@ var UI;
|
|||
if(UI.altOn === false) {
|
||||
UI.rfb.sendKey(KeyTable.XK_Alt_L, true);
|
||||
document.getElementById('noVNC_toggle_alt_button')
|
||||
.className = "noVNC_button_selected";
|
||||
.classList.add("noVNC_selected");
|
||||
UI.altOn = true;
|
||||
} else if(UI.altOn === true) {
|
||||
UI.rfb.sendKey(KeyTable.XK_Alt_L, false);
|
||||
document.getElementById('noVNC_toggle_alt_button')
|
||||
.className = "noVNC_button";
|
||||
.classList.remove("noVNC_selected");
|
||||
UI.altOn = false;
|
||||
}
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue