diff options
Diffstat (limited to 'kvmd')
| -rw-r--r-- | kvmd/web/css/about.css | 7 | ||||
| -rw-r--r-- | kvmd/web/css/main.css | 18 | ||||
| -rw-r--r-- | kvmd/web/css/modals.css | 25 | ||||
| -rw-r--r-- | kvmd/web/css/vars.css | 2 | ||||
| -rw-r--r-- | kvmd/web/css/windows.css | 2 | ||||
| -rw-r--r-- | kvmd/web/index.html | 17 | ||||
| -rw-r--r-- | kvmd/web/js/main.js | 17 |
7 files changed, 73 insertions, 15 deletions
diff --git a/kvmd/web/css/about.css b/kvmd/web/css/about.css index 06525e7b..0db2e467 100644 --- a/kvmd/web/css/about.css +++ b/kvmd/web/css/about.css @@ -15,10 +15,3 @@ div#about p { font-family: monospace; padding: 0 10px 0 10px; } -div#about p a { - text-decoration: underline dotted; - color: var(--fg-color-normal); -} -div#about p a:hover { - text-decoration: underline; -} diff --git a/kvmd/web/css/main.css b/kvmd/web/css/main.css index dec3cb45..44ca1ac1 100644 --- a/kvmd/web/css/main.css +++ b/kvmd/web/css/main.css @@ -9,6 +9,20 @@ body { user-select: none; touch-action: manipulation; } + +a { + text-decoration: underline dotted; + color: var(--fg-color-normal); +} +a:hover { + text-decoration: underline; +} + +hr { + border: none; + border-top: var(--normal-border); +} + img#logo { -webkit-filter: invert(0.7); filter: invert(0.7); @@ -26,7 +40,7 @@ ul#ctl { top: 0; width: 100%; height: 50px; - z-index: 2147483647; + z-index: 2147483646; } ul#ctl li.ctl-logo { line-height: 50px; @@ -70,7 +84,7 @@ div.ctl-dropdown-content { background-color: var(--bg-color-ctl); min-width: 180px; box-shadow: var(--big-shadow); - z-index: 2147483646; + z-index: 2147483645; } div.ctl-dropdown-content div.buttons-row { margin: 0; diff --git a/kvmd/web/css/modals.css b/kvmd/web/css/modals.css new file mode 100644 index 00000000..eedb4ef6 --- /dev/null +++ b/kvmd/web/css/modals.css @@ -0,0 +1,25 @@ +div.modal { + visibility: hidden; + position: fixed; + left: 0; + top: 0; + width: 100%; + height: 100%; + background-color: rgb(0, 0, 0); + background-color: rgba(0, 0, 0, 0.5); + z-index: 2147483647; +} + +div.modal-content { + display: table; + outline: none; + margin: 15% auto; + overflow: hidden; + border: var(--important-border); + border-radius: 8px; + box-sizing: border-box; + box-shadow: var(--big-shadow); + white-space: nowrap; + background-color: var(--bg-color-light); + padding: 9px; +} diff --git a/kvmd/web/css/vars.css b/kvmd/web/css/vars.css index 6bd3d009..35d68c26 100644 --- a/kvmd/web/css/vars.css +++ b/kvmd/web/css/vars.css @@ -20,6 +20,7 @@ --border-color-grey: var(--bg-color-ctl); --border-color-dark: var(--bg-color-dark); --border-color-intensive: #5b90bb; + --border-color-important: #ff6467; --dark-border: thin solid var(--border-color-dark); --grey-border: thin solid var(--border-color-grey); @@ -27,6 +28,7 @@ --black-border: thin solid black; --intensive-border: 2px solid var(--border-color-intensive); --thin-intensive-border: thin solid var(--border-color-intensive); + --important-border: 2px solid var(--border-color-important); --micro-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.4); --small-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2); diff --git a/kvmd/web/css/windows.css b/kvmd/web/css/windows.css index c0ab5513..fb866008 100644 --- a/kvmd/web/css/windows.css +++ b/kvmd/web/css/windows.css @@ -1,4 +1,5 @@ div.window { + visibility: hidden; outline: none; overflow: hidden; position: fixed; @@ -6,7 +7,6 @@ div.window { border-radius: 8px; box-sizing: border-box; box-shadow: var(--big-shadow); - visibility: hidden; white-space: nowrap; background-color: var(--bg-color-light); padding: 30px 9px 9px 9px; diff --git a/kvmd/web/index.html b/kvmd/web/index.html index 4f225f02..adc024db 100644 --- a/kvmd/web/index.html +++ b/kvmd/web/index.html @@ -12,12 +12,12 @@ <link rel="stylesheet" href="css/vars.css"> <link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/windows.css"> + <link rel="stylesheet" href="css/modals.css"> <link rel="stylesheet" href="css/leds.css"> <link rel="stylesheet" href="css/stream.css"> <link rel="stylesheet" href="css/msd.css"> <link rel="stylesheet" href="css/keyboard.css"> <link rel="stylesheet" href="css/about.css"> - <link rel="stylesheet" href="css/mobile.css"> <script src="js/tools.js"></script> @@ -35,6 +35,21 @@ </head> <body> + <div id="bad-browser-modal" class="modal"> + <div class="modal-content"> + You are using an incompatible or legacy browser.<br> + Please use one of the following browsers:<br> + <hr> + <ul> + <li><a target="_blank" href="https://www.google.com/chrome">Google Chrome</a> <sup><i>recommended</i></sup></li> + <li><a target="_blank" href="https://www.chromium.org/Home">Chromium</a> <sup><i>recommended</i></sup></li> + <li><a target="_blank" href="https://www.mozilla.org/firefox">Mozilla Firefox</a></li> + <li><a target="_blank" href="https://www.apple.com/safari">Apple Safari</a></li> + <li><a target="_blank" href="https://www.opera.com">Opera</a></li> + </ul> + </div> + </div> + <ul id="ctl"> <li class="ctl-logo"><img id="logo" src="svg/logo.svg" alt="π-kvm" /></li> diff --git a/kvmd/web/js/main.js b/kvmd/web/js/main.js index fecfa2a6..a0008d53 100644 --- a/kvmd/web/js/main.js +++ b/kvmd/web/js/main.js @@ -1,6 +1,15 @@ function main() { - var hid = new Hid(); - var ui = new Ui(hid); - new Session(new Atx(), hid, new Msd()); - new Stream(ui); + if ( + !window.navigator + || window.navigator.userAgent.indexOf("MSIE ") > 0 + || window.navigator.userAgent.indexOf("Trident/") > 0 + || window.navigator.userAgent.indexOf("Edge/") > 0 + ) { + $("bad-browser-modal").style.visibility = "visible"; + } else { + var hid = new Hid(); + var ui = new Ui(hid); + new Session(new Atx(), hid, new Msd()); + new Stream(ui); + } } |