diff options
Diffstat (limited to 'web/share/css/navbar.css')
| -rw-r--r-- | web/share/css/navbar.css | 172 |
1 files changed, 172 insertions, 0 deletions
diff --git a/web/share/css/navbar.css b/web/share/css/navbar.css new file mode 100644 index 00000000..c52a6050 --- /dev/null +++ b/web/share/css/navbar.css @@ -0,0 +1,172 @@ +/***************************************************************************** +# # +# KVMD - The main Pi-KVM daemon. # +# # +# Copyright (C) 2018 Maxim Devaev <[email protected]> # +# # +# This program is free software: you can redistribute it and/or modify # +# it under the terms of the GNU General Public License as published by # +# the Free Software Foundation, either version 3 of the License, or # +# (at your option) any later version. # +# # +# This program is distributed in the hope that it will be useful, # +# but WITHOUT ANY WARRANTY; without even the implied warranty of # +# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the # +# GNU General Public License for more details. # +# # +# You should have received a copy of the GNU General Public License # +# along with this program. If not, see <https://www.gnu.org/licenses/>. # +# # +*****************************************************************************/ + + +ul#navbar { + box-shadow: var(--shadow-small); + list-style-type: none; + margin: 0; + padding: 0; + background-color: var(--cs-navbar-default-bg); + position: fixed; + top: 0; + width: 100%; + height: 50px; + z-index: 2147483646; +} + +ul#navbar li.right { + border-left: var(--border-navbar-item-thin); + float: right; +} + +ul#navbar li.left { + border-right: var(--border-navbar-item-thin); + float: left; +} + +ul#navbar li a#logo { + line-height: 50px; + outline: none; + cursor: pointer; + display: inline-block; + color: var(--cs-navbar-default-fg); + padding-left: 16px; + padding-right: 16px; + text-decoration: none; +} + +ul#navbar li a.menu-button { + line-height: 50px; + outline: none; + cursor: pointer; + display: inline-block; + color: var(--cs-navbar-default-fg); + padding-left: 16px; + padding-right: 16px; + text-decoration: none; +} + +ul#navbar li a#logo:hover:not(.active), +ul#navbar li a.menu-button:hover:not(.active) { + background-color: var(--cs-navbar-item-hovered-bg); +} +@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) { + /* iPad 8 */ + ul#navbar li a#menu-button:hover:not(.active), + ul#navbar li a.menu-button:hover:not(.active) { + background-color: var(--cs-navbar-default-bg) !important; + } +} + +ul#navbar li a#logo img { + margin-top: -2px; + height: 24px; +} + +ul#navbar li a.menu-button img { + vertical-align: middle; + margin-right: 10px; + height: 20px; +} + +ul#navbar li a.menu-button-pressed { + box-shadow: var(--shadow-navbar-item-pressed); + background-color: var(--cs-navbar-item-pressed-bg) !important; +} + +ul#navbar li div.menu { + visibility: hidden; + outline: none; + overflow: hidden; + white-space: nowrap; + border: var(--border-navbar-menu-default-2px); + border-top: var(--border-navbar-menu-top-thin); + border-radius: 0 0 8px 8px; + position: absolute; + background-color: var(--cs-navbar-default-bg); + min-width: 180px; + box-shadow: var(--shadow-big); + z-index: 2147483645; +} +ul#navbar li div.menu-active { + border: var(--border-navbar-menu-active-2px) !important; + border-top: var(--border-navbar-menu-top-thin) !important; +} + +ul#navbar li div.menu div.buttons { + background-color: var(--cs-control-default-bg); +} + +ul#navbar li div.menu div.text { + margin: 10px 15px 10px 15px; + font-size: 14px; +} + +ul#navbar li div.menu div.text table.one-line-switch { + width: 100%; + border-collapse: collapse; +} +@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) { + @supports (-webkit-appearance: none) { + ul#navbar li div.menu div.text table.one-line-switch { + margin: 20px 0 20px 0 !important; + } + } +} + +ul#navbar li div.menu table.kv { + -webkit-user-select: text; + -moz-user-select: text; + user-select: text; + border-spacing: 5px; + margin: 0 10px 0 10px; + font-size: 12px; +} +ul#navbar li div.menu table.kv td.value { + font-weight: bold; + max-width: 310px; + overflow: hidden; +} + +ul#navbar li div.menu div.buttons button, +ul#navbar li div.menu div.buttons select { + box-shadow: none; + border: none; + border-radius: 0; + text-align: left; + padding: 0 16px; +} + +ul#navbar li div.menu hr { + margin: 0; + display: block; + height: 0px; + padding: 0; + border: none; + border-top: var(--border-control-thin); +} + +ul#navbar li div.menu img.sign { + vertical-align: middle; + margin-right: 10px; + height: 20px; +} |