summaryrefslogtreecommitdiff
path: root/kvmd/web/css
diff options
context:
space:
mode:
authorDevaev Maxim <[email protected]>2018-09-26 02:57:24 +0300
committerDevaev Maxim <[email protected]>2018-09-26 02:57:24 +0300
commit81a5311349564a1016c4af2bf18ae872b650e85b (patch)
treed01fd027948494e22ae2c14334b98c1515e5e8a4 /kvmd/web/css
parentf3946f102fc167efdc53c73412b2c0d6ac6c72c5 (diff)
moved kvmd to the root
Diffstat (limited to 'kvmd/web/css')
-rw-r--r--kvmd/web/css/about.css17
-rw-r--r--kvmd/web/css/keyboard.css107
-rw-r--r--kvmd/web/css/leds.css69
-rw-r--r--kvmd/web/css/main.css204
-rw-r--r--kvmd/web/css/mobile.css87
-rw-r--r--kvmd/web/css/modals.css52
-rw-r--r--kvmd/web/css/msd.css53
-rw-r--r--kvmd/web/css/stream.css101
-rw-r--r--kvmd/web/css/vars.css35
-rw-r--r--kvmd/web/css/windows.css57
10 files changed, 0 insertions, 782 deletions
diff --git a/kvmd/web/css/about.css b/kvmd/web/css/about.css
deleted file mode 100644
index 0db2e467..00000000
--- a/kvmd/web/css/about.css
+++ /dev/null
@@ -1,17 +0,0 @@
-div#about {
- -webkit-user-select: text;
- -moz-user-select: text;
- user-select: text;
-}
-
-div#about
-td#about-version-kvmd,
-td#about-version-python,
-td#about-version-platform {
- font-weight: bold;
-}
-
-div#about p {
- font-family: monospace;
- padding: 0 10px 0 10px;
-}
diff --git a/kvmd/web/css/keyboard.css b/kvmd/web/css/keyboard.css
deleted file mode 100644
index ebe1d95e..00000000
--- a/kvmd/web/css/keyboard.css
+++ /dev/null
@@ -1,107 +0,0 @@
-div.keyboard {
- zoom: 0.8;
-}
-
-div.keyboard div.keyboard-block {
- display: table-cell;
- padding-right: 0;
-}
-div.keyboard div.keyboard-block:not(:first-child) {
- padding-left: 15px;
-}
-
-div.keyboard div.keyboard-row {
- white-space: nowrap;
- height: 40px;
- margin-bottom: 5px;
-}
-div.keyboard div.keyboard-row:last-child {
- margin-bottom: 0;
-}
-
-div.keyboard div.key, div.modifier, div.empty-key {
- box-sizing: border-box;
- display: inline-block;
- margin-right: 5px;
- padding: 0;
- width: 40px;
-}
-div.keyboard div.key, div.modifier {
- font-size: 0.9em;
- text-align: center;
- vertical-align: top;
- box-shadow: var(--micro-shadow);
- border: var(--grey-border);
- border-radius: 6px;
- color: var(--fg-color-normal);
- background-color: var(--bg-color-gray);
- cursor: pointer;
- height: 40px;
-}
-div.keyboard div.key:hover, div.modifier:hover {
- color: var(--fg-color-intensive);
- background-color: var(--bg-color-ctl);
-}
-div.keyboard div.pressed {
- box-shadow: none;
- color: var(--fg-color-selected) !important;
- background-color: var(--bg-color-dark) !important;
-}
-div.keyboard div.holded {
- box-shadow: none;
- color: var(--fg-color-normal) !important;
- background-color: var(--bg-color-intensive) !important;
-}
-div.keyboard div.key:last-child, div.empty-key:last-child, div.modifier:last-child {
- margin-right: 0;
-}
-div.keyboard div.margin-0 {
- margin-right: 0px;
-}
-div.keyboard div.wide-0 {
- width: 26px;
-}
-div.keyboard div.wide-1 {
- width: 61px;
-}
-div.keyboard div.wide-2 {
- width: 64px;
-}
-div.keyboard div.wide-3 {
- width: 77px;
-}
-div.keyboard div.wide-4 {
- width: 102px;
-}
-div.keyboard div.wide-5 {
- width: 288px;
-}
-div.keyboard div.left {
- text-align: left !important;
- padding-left: 6px !important;
-}
-div.keyboard div.right {
- text-align: right !important;
- padding-right: 6px !important;
-}
-div.keyboard div.small {
- font-size: 0.7em;
-}
-
-div.keyboard p {
- margin: 0;
- position: relative;
- top: 50%;
- -webkit-transform: translateY(-50%);
- transform: translateY(-50%);
-}
-div.keyboard b {
- color: var(--bg-color-intensive);
-}
-
-div#keyboard-desktop {
- display: block;
-}
-div#keyboard-mobile {
- display: none;
-}
diff --git a/kvmd/web/css/leds.css b/kvmd/web/css/leds.css
deleted file mode 100644
index c5c122e3..00000000
--- a/kvmd/web/css/leds.css
+++ /dev/null
@@ -1,69 +0,0 @@
-@-webkit-keyframes spin {
- 100% {
- -webkit-transform: rotate(360deg);
- }
-}
-@keyframes spin {
- 100% {
- -webkit-transform: rotate(360deg);
- transform: rotate(360deg);
- }
-}
-
-:root {
- --led-filter-gray: invert(0.5);
- --led-filter-green: invert(0.5) sepia(1) saturate(5) hue-rotate(100deg);
- --led-filter-red: invert(0.5) sepia(1) saturate(15) hue-rotate(320deg);
- --led-filter-yellow: invert(0.5) sepia(1) saturate(5) hue-rotate(0deg);
-
- --led-spin-slow: spin 6s linear infinite;
- --led-spin-medium: spin 3s linear infinite;
- --led-spin-fast: spin 2s linear infinite;
-}
-
-img.led-on {
- -webkit-filter: var(--led-filter-green);
- filter: var(--led-filter-green);
-}
-
-img.led-off {
- -webkit-filter: var(--led-filter-gray);
- filter: var(--led-filter-gray);
-}
-
-img.led-hdd-busy {
- -webkit-filter: var(--led-filter-red);
- filter: var(--led-filter-red);
-}
-
-img.led-msd-writing,
-img.led-pak-typing {
- -webkit-filter: var(--led-filter-yellow);
- filter: var(--led-filter-yellow);
- -webkit-animation: var(--led-spin-fast);
- animation: var(--led-spin-fast);
-}
-
-img.led-link-connecting {
- -webkit-filter: var(--led-filter-yellow);
- filter: var(--led-filter-yellow);
-}
-
-img.led-fan-on {
- -webkit-filter: var(--led-filter-green);
- filter: var(--led-filter-green);
- -webkit-animation: var(--led-spin-medium);
- animation: var(--led-spin-medium);
-}
-
-img.led-fan-slow {
- -webkit-filter: var(--led-filter-yellow);
- filter: var(--led-filter-yellow);
- -webkit-animation: var(--led-spin-slow);
- animation: var(--led-spin-slow);
-}
-
-img.led-fan-fail {
- -webkit-filter: var(--led-filter-red);
- filter: var(--led-filter-red);
-}
diff --git a/kvmd/web/css/main.css b/kvmd/web/css/main.css
deleted file mode 100644
index 0dd07fc2..00000000
--- a/kvmd/web/css/main.css
+++ /dev/null
@@ -1,204 +0,0 @@
-body {
- margin: 0;
- overflow: hidden;
- color: var(--fg-color-normal);
- background-color: var(--bg-color-normal);
- font-family: sans-serif !important;
- -webkit-user-select: none;
- -moz-user-select: none;
- user-select: none;
- touch-action: manipulation;
-}
-
-a {
- text-decoration: underline dotted;
- color: var(--fg-color-normal);
-}
-@media (hover: hover), (min--moz-device-pixel-ratio: 0) {
- a:hover {
- text-decoration: underline;
- }
-}
-
-hr {
- border: none;
- border-top: var(--normal-border);
-}
-
-button, select {
- box-shadow: none;
- border: none;
- color: var(--fg-color-normal);
- background-color: var(--bg-color-normal);
- display: block;
- width: 100%;
- height: 30px;
- font-size: 16px;
- outline: none;
- cursor: pointer;
-}
-@media (hover: hover), (min--moz-device-pixel-ratio: 0) {
- button:enabled:hover, select:enabled:hover {
- color: var(--fg-color-intensive);
- background-color: var(--bg-color-dark) !important;
- }
- button:active, select:active {
- color: var(--fg-color-selected) !important;
- }
- select:enabled:hover {
- background-image: url("../svg/select-arrow-intensive.svg") !important;
- }
-}
-@media (hover: none) {
- button:active, select:active {
- color: var(--fg-color-intensive);
- background-color: var(--bg-color-dark);
- }
-}
-button:disabled, select:disabled {
- color: var(--fg-color-inactive);
- cursor: default;
-}
-
-select {
- -webkit-appearance: button;
- -moz-appearance: button;
- appearance: button;
- -webkit-user-select: none;
- -moz-user-select: none;
- user-select: none;
- background-image: url("../svg/select-arrow-normal.svg");
- background-position: center right;
- background-repeat: no-repeat;
-}
-select:disabled {
- background-image: url("../svg/select-arrow-inactive.svg") !important;
-}
-select:active {
- color: var(--fg-color-intensive) !important;
- background-color: var(--bg-color-dark) !important;
- background-image: url("../svg/select-arrow-intensive.svg") !important;
-}
-
-.row50 {
- display: inline-block;
- width: 50%;
-}
-.row25 {
- display: inline-block;
- width: 25%;
-}
-.row50:not(:first-child), .row25:not(:first-child) {
- border-left: var(--dark-border);
-}
-
-img#logo {
- -webkit-filter: invert(0.7);
- filter: invert(0.7);
- vertical-align: middle;
- padding-left: 16px;
-}
-
-ul#ctl {
- box-shadow: var(--small-shadow);
- list-style-type: none;
- margin: 0;
- padding: 0;
- background-color: var(--bg-color-ctl);
- position: fixed;
- top: 0;
- width: 100%;
- height: 50px;
- z-index: 2147483646;
-}
-ul#ctl li.ctl-logo {
- line-height: 50px;
- margin-top: -2px;
- float: left;
-}
-ul#ctl li.ctl-right-actions {
- float: right;
-}
-ul#ctl img {
- vertical-align: middle;
- margin-right: 10px;
- height: 20px;
-}
-ul#ctl li a.ctl-item {
- line-height: 50px;
- outline: none;
- cursor: pointer;
- border-left: var(--black-border);
- display: inline-block;
- color: var(--fg-color-normal);
- padding-left: 16px;
- padding-right: 16px;
- text-decoration: none;
-}
-ul#ctl li a.ctl-item:hover:not(.active) {
- background-color: var(--bg-color-hovered);
-}
-ul#ctl li a.ctl-item-selected {
- box-shadow: 0 5px 0 var(--border-color-intensive) inset;
- background-color: var(--bg-color-selected) !important;
-}
-div.ctl-dropdown-content {
- visibility: hidden;
- overflow: hidden;
- white-space: nowrap;
- border: var(--intensive-border);
- border-top: var(--dark-border);
- border-radius: 0 0 8px 8px;
- position: absolute;
- background-color: var(--bg-color-ctl);
- min-width: 180px;
- box-shadow: var(--big-shadow);
- z-index: 2147483645;
-}
-div.ctl-dropdown-content button, select {
- text-align: left;
- padding: 0 16px;
-}
-div.ctl-dropdown-content div.buttons-row {
- margin: 0;
- padding: 0;
- font-size: 0;
-}
-div.ctl-dropdown-content hr {
- margin: 0;
- display: block;
- height: 0px;
- padding: 0;
- border: none;
- border-top: var(--dark-border);
-}
-div.ctl-dropdown-content-buttons {
- background-color: var(--bg-color-normal);
-}
-div.ctl-dropdown-content-text {
- margin: 10px 15px 10px 15px;
- font-size: 14px;
-}
-
-ul#footer {
- list-style-type: none;
- bottom: 0;
- position: fixed;
- width: 100%;
- padding: 0;
- font-size: 0.7em;
- color: var(--fg-color-inactive);
- z-index: -10;
-}
-ul#footer li {
- padding: 0 10px;
-}
-ul#footer li.footer-left {
- float: left;
-}
-ul#footer li.footer-right {
- float: right;
-}
-ul#footer li a {
- color: var(--fg-color-inactive);
-}
diff --git a/kvmd/web/css/mobile.css b/kvmd/web/css/mobile.css
deleted file mode 100644
index fdec7fc3..00000000
--- a/kvmd/web/css/mobile.css
+++ /dev/null
@@ -1,87 +0,0 @@
-/*
- http://stephen.io/mediaqueries/
- https://gist.github.com/gokulkrishh/242e68d1ee94ad05f488
-*/
-
-@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
- div.window {
- padding-top: 45px !important;
- }
- div.window-header {
- height: 35px !important;
- }
- div.window-grab {
- height: 35px !important;
- }
- button.window-button-close {
- height: 40px !important;
- }
-
- ul#ctl li a.ctl-item:hover:not(.active) {
- background-color: var(--bg-color-ctl) !important;
- }
-
- div.keyboard {
- zoom: 1.28 !important;
- }
- div#keyboard-window {
- visibility: visible !important;
- padding-top: 9px !important;
- padding-bottom: 30px !important;
- border-bottom: 0 !important;
- border-left: 0 !important;
- border-right: 0 !important;
- border-radius: 0 !important;
- top: unset !important;
- bottom: 0 !important;
- width: 100% !important;
- left: 50% !important;
- -webkit-transform: translateX(-50%) !important;
- transform: translateX(-50%) !important;
- }
- div#keyboard-window-header {
- display: none !important
- }
- div.keyboard div.key:hover, div.modifier:hover {
- color: var(--fg-color-normal);
- background-color: var(--bg-color-gray);
- }
- div#keyboard-desktop {
- display: none !important;
- }
- div#keyboard-mobile {
- display: block !important;
- }
-
- div#stream-window {
- padding-top: 9px !important;
- border-top: 0 !important;
- border-radius: 0 0 8px 8px !important;
- top: 50px !important;
- left: 50% !important;
- -webkit-transform: translateX(-50%) !important;
- transform: translateX(-50%) !important;
- }
- div#stream-window-header {
- display: none !important;
- }
- div#stream-mouse-buttons {
- display: block !important;
- }
-}
-
-@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
- button, select {
- height: 45px !important;
- }
-
- div.modal-buttons button {
- height: 50px !important;
- }
-
- @supports (-webkit-appearance:none) {
- div#stream-size-slider-box input[type=range] {
- margin: 20px 0 20px 0 !important;
- }
- }
-}
diff --git a/kvmd/web/css/modals.css b/kvmd/web/css/modals.css
deleted file mode 100644
index cfb0df20..00000000
--- a/kvmd/web/css/modals.css
+++ /dev/null
@@ -1,52 +0,0 @@
-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-window {
- display: table;
- outline: none;
- margin: 15% auto;
- overflow: hidden;
- border: var(--dark-border);
- border-radius: 8px;
- box-sizing: border-box;
- box-shadow: var(--big-shadow);
- background-color: var(--bg-color-light);
- padding: 0;
-}
-div.modal-window:focus {
- border: var(--intensive-border) !important;
-}
-
-
-div.modal-header {
- text-align: center;
- font-weight: bold;
- padding: 3px 9px 3px 9px;
- border-bottom: var(--normal-border);
-}
-
-div.modal-content {
- max-width: 500px;
- max-height: 500px;
- padding: 16px 9px 16px 9px;
-}
-
-div.modal-buttons {
- border-top: var(--dark-border);
- margin: 0;
- padding: 0;
- font-size: 0;
-}
-
-div.modal-buttons button {
- height: 40px;
-}
diff --git a/kvmd/web/css/msd.css b/kvmd/web/css/msd.css
deleted file mode 100644
index 91c6a280..00000000
--- a/kvmd/web/css/msd.css
+++ /dev/null
@@ -1,53 +0,0 @@
-div#msd-menu {
- width: 450px;
-}
-div#msd-menu
-div#msd-not-in-operate,
-div#msd-current-image-broken,
-div#msd-another-another-user-uploads,
-input#msd-select-new-image-file,
-div#msd-new-image {
- display: none;
-}
-
-table.msd-info {
- -webkit-user-select: text;
- -moz-user-select: text;
- user-select: text;
- border-spacing: 5px;
- margin: 0 10px 0 10px;
- font-size: 12px;
-}
-table.msd-info
-td#msd-status,
-td#msd-current-image-name,
-td#msd-current-image-size,
-td#msd-storage-size,
-td#msd-new-image-name,
-td#msd-new-image-size {
- font-weight: bold;
- max-width: 310px;
- overflow: hidden;
-}
-
-div#msd-progress {
- background-color: var(--bg-color-selected);
- height: 1.5em;
- width: 100%;
- position: relative;
-}
-div#msd-progress:before {
- color: var(--fg-color-intensive);
- content: attr(data-label);
- font-size: 0.8em;
- position: absolute;
- text-align: center;
- top: 4px;
- left: 0;
- right: 0;
-}
-div#msd-progress span#msd-progress-value {
- background-color: var(--bg-color-intensive);
- display: inline-block;
- height: 100%;
-}
diff --git a/kvmd/web/css/stream.css b/kvmd/web/css/stream.css
deleted file mode 100644
index 0ddcf780..00000000
--- a/kvmd/web/css/stream.css
+++ /dev/null
@@ -1,101 +0,0 @@
-img#stream-image {
- width: 640px;
- height: 480px;
- display: block;
- background-color: var(--bg-color-stream-screen);
-}
-
-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;
- border: var(--dark-border);
-}
-div.stream-box-inactive::after {
- cursor: wait;
- content: "";
- position: absolute;
- left: 0;
- top: 0;
- width: 100%;
- height: 100%;
- display: inline-block;
- background: radial-gradient(transparent 20%, black);
-}
-div.stream-box-mouse-enabled {
- cursor: url("../svg/stream-mouse-cursor.svg"), pointer;
-}
-
-select#stream-quality-select {
- margin: 8px 0 8px 0;
-}
-
-span#stream-size-value {
-}
-div#stream-size-slider-box {
- margin-top: 5px;
- display: flex;
-}
-@supports (-webkit-appearance:none) {
- div#stream-size-slider-box input[type=range] {
- cursor: pointer;
- outline: none;
- width: 100%;
- box-shadow: none;
- background: transparent;
- margin: 8px 0 8px 0;
- -webkit-appearance: none;
- }
-}
-@supports not (-webkit-appearance:none) {
- div#stream-size-slider-box input[type=range] {
- cursor: pointer;
- outline: none;
- width: 100%;
- box-shadow: none;
- margin-left: 0;
- margin-right: 0;
- }
-}
-div#stream-size-slider-box input[type=range]::-webkit-slider-runnable-track {
- height: 5px;
- background: var(--bg-color-light);
- border-radius: 3px;
-}
-div#stream-size-slider-box input[type=range]::-webkit-slider-thumb {
- border: var(--intensive-border);
- height: 18px;
- width: 18px;
- border-radius: 25px;
- background: var(--bg-color-intensive);
- -webkit-appearance: none;
- margin-top: -7px;
-}
-div#stream-size-slider-box input[type=range]::-moz-range-track {
- height: 5px;
- background: var(--bg-color-light);
- border-radius: 3px;
-}
-div#stream-size-slider-box input[type=range]::-moz-range-thumb {
- border: var(--intensive-border);
- height: 18px;
- width: 18px;
- border-radius: 25px;
- background: var(--bg-color-intensive);
-}
-
-div#stream-mouse-buttons {
- display: none;
- margin: 0;
- padding: 0;
- font-size: 0;
-}
diff --git a/kvmd/web/css/vars.css b/kvmd/web/css/vars.css
deleted file mode 100644
index d6d5a604..00000000
--- a/kvmd/web/css/vars.css
+++ /dev/null
@@ -1,35 +0,0 @@
-:root {
- --bg-color-normal: #36393f;
- --bg-color-light: #484b51;
- --bg-color-gray: #3b3e43;
- --bg-color-dark: #17191d;
- --bg-color-ctl: #202225;
- --bg-color-intensive: #436a8a;
- --bg-color-hovered: #1a1c1f;
- --bg-color-selected: #171717;
-
- --fg-color-normal: #c3c3c3;
- --fg-color-dark: #aaaaaa;
- --fg-color-intensive: white;
- --fg-color-inactive: #6c7481;
- --fg-color-selected: var(--fg-color-inactive);
-
- --bg-color-stream-screen: black;
-
- --border-color-normal: var(--bg-color-normal);
- --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);
- --normal-border: thin solid var(--border-color-normal);
- --black-border: thin solid black;
- --intensive-border: 2px solid var(--border-color-intensive);
- --thin-intensive-border: thin solid var(--border-color-intensive);
-
- --micro-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.4);
- --small-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
- --big-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.4);
-}
diff --git a/kvmd/web/css/windows.css b/kvmd/web/css/windows.css
deleted file mode 100644
index 151ca59a..00000000
--- a/kvmd/web/css/windows.css
+++ /dev/null
@@ -1,57 +0,0 @@
-div.window {
- visibility: hidden;
- outline: none;
- overflow: hidden;
- position: fixed;
- border: var(--dark-border);
- border-radius: 8px;
- box-sizing: border-box;
- box-shadow: var(--big-shadow);
- white-space: nowrap;
- background-color: var(--bg-color-light);
- padding: 30px 9px 9px 9px;
-}
-div.window:focus {
- border: var(--intensive-border) !important;
-}
-
-div.window-header {
- overflow: hidden;
- top: 0;
- left: 0;
- position: absolute;
- width: 100%;
- padding: 0;
- height: 20px;
- font-size: 0.8em;
- color: var(--fg-color-dark);
- border-bottom: var(--normal-border);
-}
-
-div.window-grab {
- overflow: hidden;
- top: 0;
- left: 0;
- position: absolute;
- width: 100%;
- height: 20px;
- cursor: move;
- padding: 3px 0 2px 20px;
-}
-
-div.window-header-grabbed {
- color: var(--fg-color-intensive);
- background-color: var(--bg-color-intensive);
- border-bottom: var(--thin-intensive-border);
-}
-
-button.window-button-close {
- position: absolute;
- top: -2px;
- right: -6px;
- width: 44px;
- height: 24px;
- padding-left: 0;
- color: var(--fg-color-inactive);
- display: inline-block;
-}