diff options
-rw-r--r-- | web/css/kvm/msd.css | 6 | ||||
-rw-r--r-- | web/css/kvm/stream.css | 34 | ||||
-rw-r--r-- | web/css/main.css | 8 | ||||
-rw-r--r-- | web/css/menu.css | 39 | ||||
-rw-r--r-- | web/css/switches.css | 10 | ||||
-rw-r--r-- | web/css/windows.css | 2 | ||||
-rw-r--r-- | web/js/ui.js | 4 | ||||
-rw-r--r-- | web/kvm.html | 378 |
8 files changed, 243 insertions, 238 deletions
diff --git a/web/css/kvm/msd.css b/web/css/kvm/msd.css index de22d6e5..4a1c5d28 100644 --- a/web/css/kvm/msd.css +++ b/web/css/kvm/msd.css @@ -2,11 +2,11 @@ div#msd-menu { width: 450px; } -div.msd-message, input.msd-message { +div#msd-menu div.msd-message, input.msd-message { display: none; } -table.msd-info { +div#msd-menu table.msd-info { -webkit-user-select: text; -moz-user-select: text; user-select: text; @@ -15,7 +15,7 @@ table.msd-info { font-size: 12px; } -table.msd-info td.msd-info-value { +div#msd-menu table.msd-info td.msd-info-value { font-weight: bold; max-width: 310px; overflow: hidden; diff --git a/web/css/kvm/stream.css b/web/css/kvm/stream.css index 4cdb7fe4..10670ef4 100644 --- a/web/css/kvm/stream.css +++ b/web/css/kvm/stream.css @@ -2,23 +2,6 @@ div#stream-info { display: none; } -img#stream-image { - width: 640px; - height: 480px; - display: block; - background-color: black; -} - -img.stream-image-active { - -webkit-filter: none; - filter: none; -} - -img.stream-image-inactive { - -webkit-filter: grayscale(100%) brightness(75%) sepia(75%); - filter: grayscale(100%) brightness(75%) sepia(75%); -} - div#stream-box { position: relative; display: inline-block; @@ -39,6 +22,23 @@ div.stream-box-mouse-enabled { cursor: url("../../svg/stream-mouse-cursor.svg"), pointer; } +img#stream-image { + width: 640px; + height: 480px; + display: block; + background-color: black; +} + +img.stream-image-active { + -webkit-filter: none; + filter: none; +} + +img.stream-image-inactive { + -webkit-filter: grayscale(100%) brightness(75%) sepia(75%); + filter: grayscale(100%) brightness(75%) sepia(75%); +} + div.stream-slider-box { margin-top: 5px; display: flex; diff --git a/web/css/main.css b/web/css/main.css index 65a9afe9..a9f9600f 100644 --- a/web/css/main.css +++ b/web/css/main.css @@ -4,6 +4,8 @@ body { color: var(--fg-color-normal); background-color: var(--bg-color-normal); font-family: sans-serif !important; +} +body.body-no-select { -webkit-user-select: none; -moz-user-select: none; user-select: none; @@ -96,6 +98,12 @@ select:active { } } +div.buttons-row { + margin: 0; + padding: 0; + font-size: 0; +} + .row50 { display: inline-block; width: 50%; diff --git a/web/css/menu.css b/web/css/menu.css index b70419f9..581aaf97 100644 --- a/web/css/menu.css +++ b/web/css/menu.css @@ -10,20 +10,24 @@ ul.menu { height: 50px; z-index: 2147483646; } + ul.menu li.menu-logo { line-height: 50px; margin-top: -2px; margin-left: 16px; float: left; } -ul.menu li.menu-right-actions { + +ul.menu li.menu-right-items { float: right; } + ul.menu img { vertical-align: middle; margin-right: 10px; height: 20px; } + ul.menu li a.menu-item { line-height: 50px; outline: none; @@ -35,6 +39,7 @@ ul.menu li a.menu-item { padding-right: 16px; text-decoration: none; } + ul.menu li a.menu-item:hover:not(.active) { background-color: var(--bg-color-hovered); } @@ -44,11 +49,13 @@ ul.menu li a.menu-item:hover:not(.active) { background-color: var(--bg-color-menu) !important; } } + ul.menu li a.menu-item-selected { box-shadow: 0 5px 0 var(--border-color-intensive) inset; background-color: var(--bg-color-selected) !important; } -div.menu-dropdown-content { + +ul.menu li div.menu-item-content { visibility: hidden; overflow: hidden; white-space: nowrap; @@ -61,16 +68,22 @@ div.menu-dropdown-content { box-shadow: var(--shadow-big); z-index: 2147483645; } -div.menu-dropdown-content button, select { + +ul.menu li div.menu-item-content-buttons { + background-color: var(--bg-color-normal); +} + +ul.menu li div.menu-item-content-text { + margin: 10px 15px 10px 15px; + font-size: 14px; +} + +ul.menu li div.menu-item-content button, select { text-align: left; padding: 0 16px; } -div.menu-dropdown-content div.buttons-row { - margin: 0; - padding: 0; - font-size: 0; -} -div.menu-dropdown-content hr { + +ul.menu li div.menu-item-content hr { margin: 0; display: block; height: 0px; @@ -78,11 +91,3 @@ div.menu-dropdown-content hr { border: none; border-top: var(--border-dark-thin); } -div.menu-dropdown-content-buttons { - background-color: var(--bg-color-normal); -} -div.menu-dropdown-content-text { - margin: 10px 15px 10px 15px; - font-size: 14px; -} - diff --git a/web/css/switches.css b/web/css/switches.css index 08e50033..603115c4 100644 --- a/web/css/switches.css +++ b/web/css/switches.css @@ -19,13 +19,13 @@ div.switch-box label.switch-label { border-radius: 15px; } -div.switch-box span.switch-inner { +div.switch-box label.switch-label span.switch-inner { display: block; width: 200%; margin-left: -100%; } -div.switch-box span.switch-inner:before, span.switch-inner:after { +div.switch-box label.switch-label span.switch-inner:before, span.switch-inner:after { display: block; float: left; width: 50%; @@ -38,7 +38,7 @@ div.switch-box span.switch-inner:before, span.switch-inner:after { box-sizing: border-box; } -div.switch-box span.switch-inner:before { +div.switch-box label.switch-label span.switch-inner:before { content: "ON"; padding-left: 5px; background-color: var(--bg-color-gray); @@ -46,7 +46,7 @@ div.switch-box span.switch-inner:before { text-align: left; } -div.switch-box span.switch-inner:after { +div.switch-box label.switch-label span.switch-inner:after { content: "OFF"; padding-right: 5px; background-color: var(--bg-color-gray); @@ -54,7 +54,7 @@ div.switch-box span.switch-inner:after { text-align: right; } -div.switch-box span.switch { +div.switch-box label.switch-label span.switch { display: block; width: 15px; margin: 0px; diff --git a/web/css/windows.css b/web/css/windows.css index 56f06106..68351896 100644 --- a/web/css/windows.css +++ b/web/css/windows.css @@ -67,7 +67,7 @@ div.window div.window-header button.window-button-close { div.window div.window-header div.window-grab { height: 35px !important; } - div.window div.window-header button.window-button-close { + div.window div.window-header button.window-button-close { height: 40px !important; } } diff --git a/web/js/ui.js b/web/js/ui.js index 754e80b0..ff19cf25 100644 --- a/web/js/ui.js +++ b/web/js/ui.js @@ -155,7 +155,7 @@ function Ui() { var all_hidden = true; __menu_items.forEach(function(el_item) { - var el_menu = el_item.parentElement.querySelector(".menu-dropdown-content"); + var el_menu = el_item.parentElement.querySelector(".menu-item-content"); if (el_item === el_a && window.getComputedStyle(el_menu, null).visibility === "hidden") { el_item.focus(); el_item.classList.add("menu-item-selected"); @@ -184,7 +184,7 @@ function Ui() { var __closeAllMenues = function() { document.onkeyup = null; __menu_items.forEach(function(el_item) { - var el_menu = el_item.parentElement.querySelector(".menu-dropdown-content"); + var el_menu = el_item.parentElement.querySelector(".menu-item-content"); el_item.classList.remove("menu-item-selected"); el_menu.style.visibility = "hidden"; }); diff --git a/web/kvm.html b/web/kvm.html index 8df1b83d..27c23a86 100644 --- a/web/kvm.html +++ b/web/kvm.html @@ -42,7 +42,7 @@ <script>window.onload = main;</script> </head> -<body> +<body class="body-no-select"> <div id="bad-browser-modal" class="modal"> <div class="modal-window"> <div class="modal-content"> @@ -66,234 +66,226 @@ <img class="svg-gray" src="svg/logo.svg" alt="π-kvm" /> </li> - <li class="menu-right-actions"> - <div class="menu-dropdown"> - <a class="menu-item" href="#"> - <img data-dont-hide-menu id="link-led" class="led-gray" src="svg/link-led.svg" /> - <img data-dont-hide-menu id="stream-led" class="led-gray" src="svg/stream-led.svg" /> - <img data-dont-hide-menu id="hid-keyboard-led" class="led-gray" src="svg/hid-keyboard-led.svg" /> - <img data-dont-hide-menu id="hid-mouse-led" class="led-gray" src="svg/hid-mouse-led.svg" /> - System ↴ - </a> - <div data-dont-hide-menu class="menu-dropdown-content"> - <div class="menu-dropdown-content-buttons"> - <button disabled data-force-hide-menu id="stream-screenshot-button">• Take a screenshot</button> - <hr> - <button data-force-hide-menu id="show-stream-button">• Show stream</button> - <button data-force-hide-menu id="show-keyboard-button">• Show keyboard</button> - <button data-force-hide-menu id="show-about-button">• Show about</button> - </div> - <hr> - <div class="menu-dropdown-content-text"> - Stream quality: <span id="stream-quality-value">80%</span> - <div class="stream-slider-box"> - <input disabled type="range" id="stream-quality-slider" class="slider" /> - </div> - </div> + <li class="menu-right-items"> + <a class="menu-item" href="#"> + <img data-dont-hide-menu id="link-led" class="led-gray" src="svg/link-led.svg" /> + <img data-dont-hide-menu id="stream-led" class="led-gray" src="svg/stream-led.svg" /> + <img data-dont-hide-menu id="hid-keyboard-led" class="led-gray" src="svg/hid-keyboard-led.svg" /> + <img data-dont-hide-menu id="hid-mouse-led" class="led-gray" src="svg/hid-mouse-led.svg" /> + System ↴ + </a> + <div data-dont-hide-menu class="menu-item-content"> + <div class="menu-item-content-buttons"> + <button disabled data-force-hide-menu id="stream-screenshot-button">• Take a screenshot</button> <hr> - <div class="menu-dropdown-content-text"> - Stream FPS: <span id="stream-desired-fps-value">30</span> - <div class="stream-slider-box"> - <input disabled type="range" id="stream-desired-fps-slider" class="slider" /> - </div> - </div> - <hr> - <div class="menu-dropdown-content-text"> - Stream size: <span id="stream-size-value">100%</span> - <div class="stream-slider-box"> - <input type="range" id="stream-size-slider" class="slider" /> - </div> + <button data-force-hide-menu id="show-stream-button">• Show stream</button> + <button data-force-hide-menu id="show-keyboard-button">• Show keyboard</button> + <button data-force-hide-menu id="show-about-button">• Show about</button> + </div> + <hr> + <div class="menu-item-content-text"> + Stream quality: <span id="stream-quality-value">80%</span> + <div class="stream-slider-box"> + <input disabled type="range" id="stream-quality-slider" class="slider" /> </div> - <hr> - <div class="menu-dropdown-content-text"> - <table id="stream-auto-resize-box"><tr> - <td>Auto-resize stream:</td> - <td align="right"> - <div class="switch-box"> - <input type="checkbox" id="stream-auto-resize-checkbox" class="switch-checkbox" checked /> - <label class="switch-label" for="stream-auto-resize-checkbox"> - <span class="switch-inner"></span> - <span class="switch"></span> - </label> - </div> - </td> - </tr></table> + </div> + <hr> + <div class="menu-item-content-text"> + Stream FPS: <span id="stream-desired-fps-value">30</span> + <div class="stream-slider-box"> + <input disabled type="range" id="stream-desired-fps-slider" class="slider" /> </div> - <div class="menu-dropdown-content-buttons"> - <hr> - <button disabled data-force-hide-menu id="stream-reset-button">• Reset stream</button> - <button disabled data-force-hide-menu id="hid-reset-button">• Reset keyboard & mouse</button> - <button disabled data-force-hide-menu id="msd-reset-button">• Reset mass storage</button> + </div> + <hr> + <div class="menu-item-content-text"> + Stream size: <span id="stream-size-value">100%</span> + <div class="stream-slider-box"> + <input type="range" id="stream-size-slider" class="slider" /> </div> + </div> + <hr> + <div class="menu-item-content-text"> + <table id="stream-auto-resize-box"><tr> + <td>Auto-resize stream:</td> + <td align="right"> + <div class="switch-box"> + <input type="checkbox" id="stream-auto-resize-checkbox" class="switch-checkbox" checked /> + <label class="switch-label" for="stream-auto-resize-checkbox"> + <span class="switch-inner"></span> + <span class="switch"></span> + </label> + </div> + </td> + </tr></table> + </div> + <div class="menu-item-content-buttons"> <hr> - <div class="menu-dropdown-content-buttons"> - <button data-force-hide-menu id="open-log-button">• Open log</button> - </div> + <button disabled data-force-hide-menu id="stream-reset-button">• Reset stream</button> + <button disabled data-force-hide-menu id="hid-reset-button">• Reset keyboard & mouse</button> + <button disabled data-force-hide-menu id="msd-reset-button">• Reset mass storage</button> + </div> + <hr> + <div class="menu-item-content-buttons"> + <button data-force-hide-menu id="open-log-button">• Open log</button> </div> </div> </li> - <li class="menu-right-actions"> - <div class="menu-dropdown"> - <a class="menu-item" href="#"> - <img data-dont-hide-menu id="atx-power-led" class="led-gray" src="svg/atx-power-led.svg" /> - <img data-dont-hide-menu id="atx-hdd-led" class="led-gray" src="svg/atx-hdd-led.svg" /> - ATX ↴ - </a> - <div class="menu-dropdown-content menu-dropdown-content-buttons"> - <button disabled id="atx-power-button">• Click Power <sup><i>short</i></sup></button> - <button disabled id="atx-power-button-long">• Click Power <sup><i>long</i></sup></button> - <hr> - <button disabled id="atx-reset-button">• Click Reset</button> - </div> + <li class="menu-right-items"> + <a class="menu-item" href="#"> + <img data-dont-hide-menu id="atx-power-led" class="led-gray" src="svg/atx-power-led.svg" /> + <img data-dont-hide-menu id="atx-hdd-led" class="led-gray" src="svg/atx-hdd-led.svg" /> + ATX ↴ + </a> + <div class="menu-item-content menu-item-content-buttons"> + <button disabled id="atx-power-button">• Click Power <sup><i>short</i></sup></button> + <button disabled id="atx-power-button-long">• Click Power <sup><i>long</i></sup></button> + <hr> + <button disabled id="atx-reset-button">• Click Reset</button> </div> </li> - <li class="menu-right-actions"> - <div class="menu-dropdown"> - <a class="menu-item" href="#"> - <img data-dont-hide-menu id="msd-led" class="led-gray" src="svg/msd-led.svg" /> - Mass Storage ↴ - </a> - <div data-dont-hide-menu id="msd-menu" class="menu-dropdown-content"> - <div id="msd-not-in-operate" class="msd-message"> - <div class="menu-dropdown-content-text"> - <table> - <tr> - <td><img src="svg/warning.svg" /></td> - <td><b>Mass Storage Device is not operational</b></td> - </tr> - </table> - </div> - <hr> + <li class="menu-right-items"> + <a class="menu-item" href="#"> + <img data-dont-hide-menu id="msd-led" class="led-gray" src="svg/msd-led.svg" /> + Mass Storage ↴ + </a> + <div data-dont-hide-menu id="msd-menu" class="menu-item-content"> + <div id="msd-not-in-operate" class="msd-message"> + <div class="menu-item-content-text"> + <table> + <tr> + <td><img src="svg/warning.svg" /></td> + <td><b>Mass Storage Device is not operational</b></td> + </tr> + </table> </div> + <hr> + </div> - <div id="msd-current-image-broken" class="msd-message"> - <div class="menu-dropdown-content-text"> - <table> - <tr> - <td><img src="svg/warning.svg" /></td> - <td><b>Current image is broken!</b><br><sub>Perhaps uploading was interrupted</sub></td> - </tr> - </table> - </div> - <hr> + <div id="msd-current-image-broken" class="msd-message"> + <div class="menu-item-content-text"> + <table> + <tr> + <td><img src="svg/warning.svg" /></td> + <td><b>Current image is broken!</b><br><sub>Perhaps uploading was interrupted</sub></td> + </tr> + </table> </div> + <hr> + </div> - <div id="msd-another-another-user-uploads" class="msd-message"> - <div class="menu-dropdown-content-text"> - <table> - <tr> - <td><img src="svg/info.svg" /></td> - <td><b>Another user uploads an image</b></td> - </tr> - </table> - </div> - <hr> + <div id="msd-another-another-user-uploads" class="msd-message"> + <div class="menu-item-content-text"> + <table> + <tr> + <td><img src="svg/info.svg" /></td> + <td><b>Another user uploads an image</b></td> + </tr> + </table> </div> - - <table class="msd-info"> - <tr> - <td>Status: </td> - <td id="msd-status" class="msd-info-value"></td> - </tr> - </table> <hr> + </div> + + <table class="msd-info"> + <tr> + <td>Status: </td> + <td id="msd-status" class="msd-info-value"></td> + </tr> + </table> + <hr> + <table class="msd-info"> + <tr> + <td>Current image:</td> + <td id="msd-current-image-name" class="msd-info-value"></td> + </tr> + <tr> + <td>Image size:</td> + <td id="msd-current-image-size" class="msd-info-value"></td> + </tr> + <tr> + <td>Storage size:</td> + <td id="msd-storage-size" class="msd-info-value"></td> + </tr> + </table> + <hr> + + <input type="file" id="msd-select-new-image-file" class="msd-message" /> + <div class="menu-item-content-buttons buttons-row"> + <button disabled id="msd-select-new-image-button" class="row50">Upload new image</button> + <button disabled id="msd-upload-new-image-button" class="row25">Start</button> + <button disabled id="msd-abort-uploading-button" class="row25">Abort</button> + </div> + <hr> + + <div id="msd-new-image" class="msd-message"> <table class="msd-info"> <tr> - <td>Current image:</td> - <td id="msd-current-image-name" class="msd-info-value"></td> + <td>New name:</td> + <td id="msd-new-image-name" class="msd-info-value"></td> </tr> <tr> - <td>Image size:</td> - <td id="msd-current-image-size" class="msd-info-value"></td> - </tr> - <tr> - <td>Storage size:</td> - <td id="msd-storage-size" class="msd-info-value"></td> + <td>Upload size:</td> + <td id="msd-new-image-size" class="msd-info-value"></td> </tr> </table> <hr> - - <input type="file" id="msd-select-new-image-file" class="msd-message" /> - <div class="menu-dropdown-content-buttons buttons-row"> - <button disabled id="msd-select-new-image-button" class="row50">Upload new image</button> - <button disabled id="msd-upload-new-image-button" class="row25">Start</button> - <button disabled id="msd-abort-uploading-button" class="row25">Abort</button> - </div> - <hr> - - <div id="msd-new-image" class="msd-message"> - <table class="msd-info"> - <tr> - <td>New name:</td> - <td id="msd-new-image-name" class="msd-info-value"></td> - </tr> - <tr> - <td>Upload size:</td> - <td id="msd-new-image-size" class="msd-info-value"></td> - </tr> - </table> - <hr> - <div class="menu-dropdown-content-text"> - <div id="msd-progress" class="progress"> - <span id="msd-progress-value" class="progress-value"></span> - </div> + <div class="menu-item-content-text"> + <div id="msd-progress" class="progress"> + <span id="msd-progress-value" class="progress-value"></span> </div> - <hr> </div> + <hr> + </div> - <div class="menu-dropdown-content-buttons buttons-row"> - <button disabled data-force-hide-menu id="msd-switch-to-kvm-button" class="row50">• Switch drive to KVM</button> - <button disabled data-force-hide-menu id="msd-switch-to-server-button" class="row50">• Switch drive to Server</button> - </div> + <div class="menu-item-content-buttons buttons-row"> + <button disabled data-force-hide-menu id="msd-switch-to-kvm-button" class="row50">• Switch drive to KVM</button> + <button disabled data-force-hide-menu id="msd-switch-to-server-button" class="row50">• Switch drive to Server</button> </div> </div> </li> - <li class="menu-right-actions"> - <div class="menu-dropdown"> - <a class="menu-item" href="#"> - <img data-dont-hide-menu id="hid-pak-led" class="led-gray" src="svg/gear-led.svg" /> - Shortcuts ↴ - </a> - <div data-dont-hide-menu class="menu-dropdown-content"> - <div class="menu-dropdown-content-buttons"> - <textarea id="hid-pak-text" placeholder="Paste your text here"></textarea> - <hr> - <button disabled data-force-hide-menu id="hid-pak-button">• ↑ Paste-as-Keys <sup><i>ascii-only</i></sup></button> - <hr> - <div class="buttons-row"> - <button data-force-hide-menu data-shortcut="CapsLock" class="row50">• CapsLock</button> - <button data-force-hide-menu data-shortcut="MetaLeft" class="row50">• Left Win</button> - </div> - <hr> - <button data-force-hide-menu data-shortcut="AltLeft ShiftLeft">• Alt+Shift</button> - <button data-force-hide-menu data-shortcut="ControlLeft ShiftLeft">• Ctrl+Shift</button> - <button data-force-hide-menu data-shortcut="ShiftLeft ShiftRight">• Shift+Shift</button> - <button data-force-hide-menu data-shortcut="MetaLeft Space">• Win+Space</button> - <hr> - <button data-force-hide-menu data-shortcut="ControlLeft KeyW">• Ctrl+W</button> - <button data-force-hide-menu data-shortcut="AltLeft Tab">• Alt+Tab</button> - <button data-force-hide-menu data-shortcut="AltLeft Enter">• Alt+Enter</button> - <button data-force-hide-menu data-shortcut="AltLeft F4">• Alt+F4</button> - <hr> - <button data-force-hide-menu data-shortcut="ControlLeft AltLeft Delete">• Ctrl+Alt+Del</button> - </div> + <li class="menu-right-items"> + <a class="menu-item" href="#"> + <img data-dont-hide-menu id="hid-pak-led" class="led-gray" src="svg/gear-led.svg" /> + Shortcuts ↴ + </a> + <div data-dont-hide-menu class="menu-item-content"> + <div class="menu-item-content-buttons"> + <textarea id="hid-pak-text" placeholder="Paste your text here"></textarea> <hr> - <div class="menu-dropdown-content-text"> - ↓ Alt+SysRq+... <sup><i>linux magic (<a target="_blank" href="https://www.kernel.org/doc/html/latest/admin-guide/sysrq.html">help</a>)</i></sup> - </div> + <button disabled data-force-hide-menu id="hid-pak-button">• ↑ Paste-as-Keys <sup><i>ascii-only</i></sup></button> <hr> - <div class="menu-dropdown-content-buttons buttons-row"> - <button data-shortcut="AltLeft PrintScreen KeyR" class="row16">R</button> - <button data-shortcut="AltLeft PrintScreen KeyE" class="row16">E</button> - <button data-shortcut="AltLeft PrintScreen KeyI" class="row16">I</button> - <button data-shortcut="AltLeft PrintScreen KeyS" class="row16">S</button> - <button data-shortcut="AltLeft PrintScreen KeyU" class="row16">U</button> - <button data-shortcut="AltLeft PrintScreen KeyB" class="row16">B</button> + <div class="buttons-row"> + <button data-force-hide-menu data-shortcut="CapsLock" class="row50">• CapsLock</button> + <button data-force-hide-menu data-shortcut="MetaLeft" class="row50">• Left Win</button> </div> + <hr> + <button data-force-hide-menu data-shortcut="AltLeft ShiftLeft">• Alt+Shift</button> + <button data-force-hide-menu data-shortcut="ControlLeft ShiftLeft">• Ctrl+Shift</button> + <button data-force-hide-menu data-shortcut="ShiftLeft ShiftRight">• Shift+Shift</button> + <button data-force-hide-menu data-shortcut="MetaLeft Space">• Win+Space</button> + <hr> + <button data-force-hide-menu data-shortcut="ControlLeft KeyW">• Ctrl+W</button> + <button data-force-hide-menu data-shortcut="AltLeft Tab">• Alt+Tab</button> + <button data-force-hide-menu data-shortcut="AltLeft Enter">• Alt+Enter</button> + <button data-force-hide-menu data-shortcut="AltLeft F4">• Alt+F4</button> + <hr> + <button data-force-hide-menu data-shortcut="ControlLeft AltLeft Delete">• Ctrl+Alt+Del</button> + </div> + <hr> + <div class="menu-item-content-text"> + ↓ Alt+SysRq+... <sup><i>linux magic (<a target="_blank" href="https://www.kernel.org/doc/html/latest/admin-guide/sysrq.html">help</a>)</i></sup> + </div> + <hr> + <div class="menu-item-content-buttons buttons-row"> + <button data-shortcut="AltLeft PrintScreen KeyR" class="row16">R</button> + <button data-shortcut="AltLeft PrintScreen KeyE" class="row16">E</button> + <button data-shortcut="AltLeft PrintScreen KeyI" class="row16">I</button> + <button data-shortcut="AltLeft PrintScreen KeyS" class="row16">S</button> + <button data-shortcut="AltLeft PrintScreen KeyU" class="row16">U</button> + <button data-shortcut="AltLeft PrintScreen KeyB" class="row16">B</button> </div> </div> </li> |