mirror of
https://github.com/lxsang/ant-http
synced 2024-11-12 14:58:21 +01:00
1255 lines
30 KiB
CSS
1255 lines
30 KiB
CSS
@charset "UTF-8";
|
|
/*!
|
|
* OS.js - JavaScript Cloud/Web Desktop Platform
|
|
*
|
|
* Copyright (c) 2011-2016, Anders Evenrud <andersevenrud@gmail.com>
|
|
* All rights reserved.
|
|
*
|
|
* Redistribution and use in source and binary forms, with or without
|
|
* modification, are permitted provided that the following conditions are met:
|
|
*
|
|
* 1. Redistributions of source code must retain the above copyright notice, this
|
|
* list of conditions and the following disclaimer.
|
|
* 2. Redistributions in binary form must reproduce the above copyright notice,
|
|
* this list of conditions and the following disclaimer in the documentation
|
|
* and/or other materials provided with the distribution.
|
|
*
|
|
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
|
|
* ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
|
|
* WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
|
|
* DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR
|
|
* ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
|
|
* (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
|
|
* LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
|
|
* ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
|
* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
|
|
* SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
|
*
|
|
* @author Anders Evenrud <andersevenrud@gmail.com>
|
|
* @licence Simplified BSD License
|
|
*/
|
|
/**
|
|
* ===========================================================================
|
|
* CLASSES
|
|
* ===========================================================================
|
|
*/
|
|
.gui-has-emblem {
|
|
background-repeat: no-repeat;
|
|
background-position: calc(96%) center;
|
|
padding-right: calc(20px);
|
|
}
|
|
.gui-generic-container {
|
|
padding: 4px;
|
|
color: #ffffff;
|
|
}
|
|
.gui-generic-zebra-container {
|
|
background-color: #777777;
|
|
}
|
|
.gui-generic-zebra-container > * {
|
|
padding: 4px;
|
|
}
|
|
.gui-generic-zebra-container > *:nth-child(even) {
|
|
background: rgba(53, 53, 53, 0.5);
|
|
}
|
|
.gui-generic-hoverable:hover {
|
|
background-color: #2d73d2;
|
|
}
|
|
.gui-generic-padded {
|
|
padding: 4px;
|
|
}
|
|
.gui-generic-double-padded {
|
|
padding: calc(8px);
|
|
}
|
|
.gui-generic-margin {
|
|
margin: 4px;
|
|
}
|
|
/**
|
|
* ===========================================================================
|
|
* OVERRIDES
|
|
* ===========================================================================
|
|
*/
|
|
body,
|
|
input,
|
|
button,
|
|
textarea,
|
|
label,
|
|
select {
|
|
font-family: Karla, Sans-serif;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
font-size: 12px;
|
|
color: #ffffff;
|
|
}
|
|
::-webkit-scrollbar {
|
|
width: 12px;
|
|
height: 12px;
|
|
}
|
|
::-webkit-scrollbar-button {
|
|
background: #232323;
|
|
color: #444444;
|
|
width: 12px;
|
|
height: 12px;
|
|
display: none;
|
|
}
|
|
::-webkit-scrollbar-track {
|
|
background: #353535;
|
|
}
|
|
::-webkit-scrollbar-track-piece {
|
|
background: #353535;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
background: #232323;
|
|
}
|
|
::-webkit-scrollbar-corner {
|
|
background: #353535;
|
|
}
|
|
::-webkit-resizer {
|
|
background: #353535;
|
|
}
|
|
/**
|
|
* ===========================================================================
|
|
* WM
|
|
* ===========================================================================
|
|
*/
|
|
body[data-attention="true"]:after {
|
|
background-color: #ffffff;
|
|
}
|
|
corewm-panel {
|
|
color: #ffffff;
|
|
/* Window Manager manages this */
|
|
font-size: 0;
|
|
padding: 4px;
|
|
}
|
|
corewm-panel:before {
|
|
background: #101010;
|
|
/* Window Manager manages this */
|
|
box-shadow: 0px 0px 10px 1px rgba(34, 34, 34, 0.3);
|
|
opacity: .85;
|
|
}
|
|
corewm-panel-container {
|
|
padding: 8px;
|
|
}
|
|
corewm-panel[data-orientation="horizontal"] corewm-panel-container {
|
|
width: calc(100% - 8px);
|
|
}
|
|
corewm-panel[data-orientation="vertical"] corewm-panel-container {
|
|
height: calc(100% - 8px);
|
|
}
|
|
corewm-panel corewm-panel-item .corewm-panel-buttons > li {
|
|
cursor: pointer;
|
|
font-size: 12px;
|
|
}
|
|
corewm-panel[data-orientation="horizontal"] corewm-panel-item .corewm-panel-buttons > li {
|
|
margin-right: 4px;
|
|
margin-left: 4px;
|
|
}
|
|
corewm-panel[data-orientation="vertical"] corewm-panel-item .corewm-panel-buttons > li {
|
|
margin-top: 4px;
|
|
margin-bottom: 4px;
|
|
}
|
|
corewm-panel .PanelItemClock {
|
|
font-family: Monospace, Courier New;
|
|
font-weight: normal;
|
|
text-align: right;
|
|
}
|
|
corewm-panel .PanelItemWindowList li {
|
|
opacity: .50;
|
|
}
|
|
corewm-panel .PanelItemWindowList li.Focused {
|
|
opacity: 1;
|
|
}
|
|
corewm-panel .PanelItemWindowList li img {
|
|
margin-right: 4px;
|
|
}
|
|
html[dir="rtl"] corewm-panel .PanelItemWindowList li img {
|
|
margin-right: 0;
|
|
margin-left: 4px;
|
|
}
|
|
/* Notifications */
|
|
application-splash {
|
|
box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.6);
|
|
background: #353535;
|
|
box-shadow: 0px 0px 10px 1px rgba(34, 34, 34, 0.3);
|
|
opacity: .85;
|
|
cursor: pointer;
|
|
}
|
|
.custom-notification {
|
|
color: #fff;
|
|
/* Window Manager manages this */
|
|
}
|
|
corewm-notifications {
|
|
top: 10px;
|
|
right: 10px;
|
|
}
|
|
corewm-notification {
|
|
color: #fff;
|
|
/* Window Manager manages this */
|
|
cursor: pointer;
|
|
padding: 8px;
|
|
margin-bottom: 4px;
|
|
}
|
|
.custom-notification:before,
|
|
corewm-notification:before {
|
|
content: '';
|
|
background: #101010;
|
|
/* Window Manager manages this */
|
|
box-shadow: 0px 0px 10px 1px rgba(34, 34, 34, 0.3);
|
|
opacity: .85;
|
|
}
|
|
.custom-notification .Title,
|
|
corewm-notification .Title {
|
|
font-weight: bold;
|
|
}
|
|
.custom-notification .Title,
|
|
.custom-notification .Message,
|
|
corewm-notification .Title,
|
|
corewm-notification .Message {
|
|
line-height: 16px;
|
|
}
|
|
/* Desktop drop wallpaper effect */
|
|
#Background.Blinking {
|
|
background: #fff;
|
|
}
|
|
/* Window Switcher */
|
|
corewm-window-switcher {
|
|
box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.6);
|
|
background: #353535;
|
|
}
|
|
corewm-window-switcher > div.Active {
|
|
background: #2d73d2;
|
|
}
|
|
corewm-window-switcher > div.Active > span {
|
|
color: #ffffff;
|
|
}
|
|
corewm-search {
|
|
padding: 4px;
|
|
min-width: 200px;
|
|
max-width: 40%;
|
|
right: 10px;
|
|
top: 10px;
|
|
}
|
|
corewm-search > div {
|
|
margin-top: 4px;
|
|
}
|
|
corewm-search > ul {
|
|
margin-top: 4px;
|
|
cursor: pointer;
|
|
}
|
|
corewm-search > ul > li {
|
|
padding: 4px;
|
|
padding-left: 24px;
|
|
}
|
|
corewm-search > ul > li > img {
|
|
top: 4px;
|
|
left: 4px;
|
|
}
|
|
corewm-search > ul > .active,
|
|
corewm-search > ul > li:hover {
|
|
background: #fff;
|
|
color: #000;
|
|
}
|
|
/**
|
|
* ===========================================================================
|
|
* WINDOW
|
|
* ===========================================================================
|
|
*/
|
|
application-window {
|
|
opacity: 0.8;
|
|
margin-top: 30px;
|
|
}
|
|
application-window:before {
|
|
box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.3);
|
|
background: #353535;
|
|
top: calc(-33px);
|
|
left: -3px;
|
|
right: -3px;
|
|
bottom: -3px;
|
|
}
|
|
application-window[data-focused="true"] {
|
|
opacity: 1.0;
|
|
}
|
|
application-window[data-focused="true"]:before {
|
|
box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.6);
|
|
}
|
|
application-window[data-dnd-state="true"]:after {
|
|
top: -30px;
|
|
}
|
|
application-window-top {
|
|
top: -30px;
|
|
height: 30px;
|
|
}
|
|
application-window-top application-window-icon {
|
|
width: 30px;
|
|
}
|
|
/* application-window-content {overflow : hidden;}*/
|
|
application-window-top:active {
|
|
cursor: move;
|
|
cursor: pointer;
|
|
}
|
|
application-window-title {
|
|
font-weight: bold;
|
|
color: #ffffff;
|
|
opacity: .5;
|
|
left: 24px;
|
|
line-height: 30px;
|
|
text-align: center;
|
|
}
|
|
application-window-title:active {
|
|
cursor: move;
|
|
cursor: pointer;
|
|
}
|
|
application-window[data-focused="true"] application-window-title {
|
|
opacity: 1;
|
|
}
|
|
.application-window-button-entry {
|
|
width: 22px;
|
|
text-align: center;
|
|
cursor: pointer;
|
|
}
|
|
application-window-resize {
|
|
cursor: move;
|
|
}
|
|
application-window-top,
|
|
application-window-top > * {
|
|
cursor: default;
|
|
}
|
|
application-window-loading {
|
|
background: #000;
|
|
opacity: 0.8;
|
|
}
|
|
application-window-loading-indicator {
|
|
position: absolute;
|
|
width: 48px;
|
|
height: 48px;
|
|
left: 50%;
|
|
top: 50%;
|
|
margin-left: -24px;
|
|
margin-top: -24px;
|
|
}
|
|
application-window-loading-indicator:before {
|
|
display: block;
|
|
content: '';
|
|
width: 44px;
|
|
height: 44px;
|
|
border-top: 4px solid #fff;
|
|
border-right: 4px solid #666;
|
|
border-left: 4px solid #666;
|
|
border-bottom: 4px solid #fff;
|
|
border-radius: 100%;
|
|
-webkit-animation: windowloadinganim 0.75s linear infinite;
|
|
-moz-animation: windowloadinganim 0.75s linear infinite;
|
|
-ms-animation: windowloadinganim 0.75s linear infinite;
|
|
animation: windowloadinganim 0.75s linear infinite;
|
|
}
|
|
application-window[data-dnd-state="true"]:after {
|
|
border: 4px solid rgba(0, 0, 0, 0.7);
|
|
border-radius: 1px;
|
|
-webkit-border-top-left-radius: 3px;
|
|
-moz-border-top-left-radius: 3px;
|
|
border-top-left-radius: 3px;
|
|
-webkit-border-top-right-radius: 3px;
|
|
-moz-border-top-right-radius: 3px;
|
|
border-top-right-radius: 3px;
|
|
margin: -4px;
|
|
}
|
|
application-window-disabled {
|
|
background: #000;
|
|
opacity: 0.5;
|
|
cursor: not-allowed;
|
|
}
|
|
application-window-warning {
|
|
background: #FFB800;
|
|
color: #fff;
|
|
border-color: #DF9F15;
|
|
height: 30px;
|
|
line-height: 20px;
|
|
margin: 4px;
|
|
border: 1px solid transparent;
|
|
}
|
|
application-window-warning > div:nth-child(1) {
|
|
padding: 4px;
|
|
}
|
|
application-window-warning > div:nth-child(2) {
|
|
right: 20px;
|
|
padding: 4px;
|
|
}
|
|
application-window-warning > div:nth-child(1):hover {
|
|
color: #111;
|
|
cursor: pointer;
|
|
opacity: .9;
|
|
}
|
|
application-window-resize {
|
|
top: -38px;
|
|
left: -8px;
|
|
right: -8px;
|
|
bottom: -8px;
|
|
}
|
|
/**
|
|
* ===========================================================================
|
|
* CONTAINERS
|
|
* ===========================================================================
|
|
*/
|
|
/* Container */
|
|
gui-container {
|
|
margin: 4px;
|
|
}
|
|
gui-container[data-borders="true"] {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
}
|
|
/* Box */
|
|
gui-hbox-container > .gui-element,
|
|
gui-vbox-container > .gui-element {
|
|
margin: 4px;
|
|
}
|
|
gui-hbox-container[data-fill='true'] > *,
|
|
gui-vbox-container[data-fill='true'] > * {
|
|
width: calc(100% - 8px);
|
|
height: calc(100% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-100 {
|
|
height: calc(100% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-100 {
|
|
width: calc(100% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-90 {
|
|
height: calc(90% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-90 {
|
|
width: calc(90% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-80 {
|
|
height: calc(80% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-80 {
|
|
width: calc(80% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-70 {
|
|
height: calc(70% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-70 {
|
|
width: calc(70% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-60 {
|
|
height: calc(60% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-60 {
|
|
width: calc(60% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-50 {
|
|
height: calc(50% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-50 {
|
|
width: calc(50% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-40 {
|
|
height: calc(40% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-40 {
|
|
width: calc(40% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-30 {
|
|
height: calc(30% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-30 {
|
|
width: calc(30% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-20 {
|
|
height: calc(20% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-20 {
|
|
width: calc(20% - 8px);
|
|
}
|
|
gui-hbox-container > .perc-10 {
|
|
height: calc(10% - 8px);
|
|
}
|
|
gui-vbox-container > .perc-10 {
|
|
width: calc(10% - 8px);
|
|
}
|
|
/* Paned View */
|
|
gui-paned-view > gui-paned-view-handle {
|
|
min-width: 8px;
|
|
width: 8px;
|
|
cursor: ew-resize;
|
|
}
|
|
gui-paned-view[data-orientation='vertical'] > gui-paned-view-handle {
|
|
min-width: auto;
|
|
width: auto;
|
|
min-height: 8px;
|
|
height: 8px;
|
|
cursor: ns-resize;
|
|
}
|
|
/* IFrame */
|
|
gui-iframe {
|
|
background-color: #777777;
|
|
}
|
|
gui-iframe > iframe {
|
|
background-color: #777777;
|
|
}
|
|
/* Button Bar */
|
|
/* Toolbar */
|
|
gui-toolbar > *,
|
|
gui-button-bar > *,
|
|
gui-toolbar > gui-expander > *,
|
|
gui-button-bar > gui-expander > * {
|
|
margin: 4px;
|
|
}
|
|
gui-toolbar > gui-expander,
|
|
gui-button-bar > gui-expander {
|
|
margin: 0;
|
|
}
|
|
gui-toolbar[data-orientation="vertical"] {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
margin-top: 4px;
|
|
margin-bottom: 4px;
|
|
}
|
|
/* Expander */
|
|
gui-expander {
|
|
font-size: 12px;
|
|
}
|
|
gui-expander-label {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #444444;
|
|
margin-bottom: 4px;
|
|
}
|
|
gui-expander-label:before {
|
|
content: '▼';
|
|
font-family: sans-serif;
|
|
padding-right: 4px;
|
|
}
|
|
gui-expander[data-expanded="false"] > gui-expander-label:before {
|
|
content: '►';
|
|
}
|
|
/* Tabs */
|
|
gui-tabs > ul {
|
|
height: 25px;
|
|
}
|
|
gui-tabs > ul > li {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
cursor: pointer;
|
|
background-color: #444444;
|
|
border: 1px solid transparent;
|
|
border-bottom: 0 none;
|
|
line-height: 25px;
|
|
}
|
|
gui-tabs > ul > li.gui-active {
|
|
background-color: transparent;
|
|
border-color: #232323;
|
|
}
|
|
gui-tabs > ul > li.gui-active:after {
|
|
bottom: -1px;
|
|
border-bottom: 1px solid #353535;
|
|
}
|
|
gui-tabs > gui-tab-container {
|
|
height: calc(100% - 25px);
|
|
border: 1px solid #232323;
|
|
padding: 4px;
|
|
}
|
|
/* Button Bar */
|
|
/**
|
|
* ===========================================================================
|
|
* INPUTS
|
|
* ===========================================================================
|
|
*/
|
|
/* Label */
|
|
gui-label {
|
|
height: 26px;
|
|
line-height: 26px;
|
|
}
|
|
gui-hbox-container > gui-label,
|
|
gui-vbox-container > gui-label {
|
|
height: 16px;
|
|
line-height: 16px;
|
|
min-height: 16px;
|
|
}
|
|
/* Button */
|
|
gui-button {
|
|
height: 26px;
|
|
}
|
|
gui-button[data-icon-size="32"] {
|
|
height: 42px;
|
|
}
|
|
gui-button button {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #353535;
|
|
background: #353535;
|
|
border: 1px solid #232323;
|
|
color: #ffffff;
|
|
}
|
|
gui-button button:focus {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-button button.gui-active,
|
|
gui-button button:active {
|
|
border-color: #333333;
|
|
color: #ffffff;
|
|
background-color: #353535;
|
|
background: linear-gradient(to bottom, #f8f8f8 0%, #f4f4f4 100%);
|
|
}
|
|
gui-button button.gui-active:disabled,
|
|
gui-button button:disabled:active,
|
|
gui-button button:disabled {
|
|
border-color: #000000;
|
|
color: #ffffff;
|
|
background-color: #333232;
|
|
background: #333232;
|
|
}
|
|
gui-button button:disabled img {
|
|
opacity: .5;
|
|
}
|
|
gui-button button:disabled {
|
|
cursor: default;
|
|
color: #565656;
|
|
}
|
|
gui-button button.gui-has-image img {
|
|
padding-right: 4px;
|
|
}
|
|
gui-button.gui-has-image.gui-has-label button {
|
|
padding-left: 28px;
|
|
}
|
|
gui-button[data-icon-size="32"].gui-has-image.gui-has-label button {
|
|
padding-left: 44px;
|
|
}
|
|
/* Checkbox Button */
|
|
/* Radio Button */
|
|
gui-radio,
|
|
gui-checkbox {
|
|
height: 26px;
|
|
}
|
|
gui-radio input,
|
|
gui-checkbox input {
|
|
text-align: center;
|
|
background: #777777;
|
|
border: 1px solid #232323;
|
|
width: 16px;
|
|
height: 16px;
|
|
line-height: 12px;
|
|
color: #ffffff;
|
|
font-family: Arial;
|
|
}
|
|
gui-radio input:focus,
|
|
gui-checkbox input:focus {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-radio input {
|
|
-webkit-border-radius: 16px;
|
|
-moz-border-radius: 16px;
|
|
-ms-border-radius: 16px;
|
|
border-radius: 16px;
|
|
}
|
|
gui-radio input:checked:after {
|
|
content: "\2022";
|
|
font-size: 32px;
|
|
}
|
|
gui-checkbox input:checked:after {
|
|
content: "\2713";
|
|
font-size: 12px;
|
|
}
|
|
gui-radio[data-disabled="true"] label,
|
|
gui-checkbox[data-disabled="true"] label {
|
|
color: #565656;
|
|
}
|
|
gui-radio input:disabled,
|
|
gui-checkbox input:disabled {
|
|
border-color: #000000;
|
|
background-color: #333232;
|
|
}
|
|
gui-radio > label,
|
|
gui-checkbox > label {
|
|
line-height: 26px;
|
|
}
|
|
gui-radio > label > span,
|
|
gui-checkbox > label > span {
|
|
padding-left: 4px;
|
|
}
|
|
/* Select Dropdown */
|
|
gui-select {
|
|
height: 26px;
|
|
}
|
|
gui-select select {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
padding-right: 20px;
|
|
}
|
|
gui-select select:disabled {
|
|
border-color: #000000;
|
|
background-color: #333232;
|
|
color: #565656;
|
|
}
|
|
gui-select select:focus {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-select:before {
|
|
right: 1px;
|
|
top: 1px;
|
|
bottom: 1px;
|
|
width: 22px;
|
|
background: #777777;
|
|
}
|
|
gui-select:after {
|
|
content: '<>';
|
|
font: 11px "Consolas", monospace;
|
|
color: #232323;
|
|
right: 2px;
|
|
top: 5px;
|
|
padding: 0 0 2px;
|
|
border-bottom: 1px solid #232323;
|
|
-webkit-transform: rotate(90deg);
|
|
-moz-transform: rotate(90deg);
|
|
-ms-transform: rotate(90deg);
|
|
transform: rotate(90deg);
|
|
}
|
|
gui-select[data-disabled="true"]:before {
|
|
background-color: #333232;
|
|
}
|
|
/* Select List */
|
|
gui-select-list select {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
}
|
|
gui-select-list select:focus {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-select-list select:disabled {
|
|
border-color: #000000;
|
|
background-color: #333232;
|
|
color: #565656;
|
|
}
|
|
/* Slider */
|
|
gui-slider {
|
|
height: 26px;
|
|
}
|
|
gui-slider input {
|
|
background: transparent;
|
|
border: 0 none;
|
|
height: 26px;
|
|
}
|
|
/*
|
|
* RANGE TRACK
|
|
*/
|
|
gui-slider input::-moz-range-track {
|
|
height: 4px;
|
|
background-color: #444444;
|
|
}
|
|
gui-slider input::-webkit-slider-runnable-track {
|
|
height: 4px;
|
|
background-color: #444444;
|
|
}
|
|
gui-slider input::-ms-track {
|
|
height: 4px;
|
|
background-color: #444444;
|
|
}
|
|
/*
|
|
* RANGE THUMB
|
|
*/
|
|
gui-slider input::-moz-range-thumb {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #353535;
|
|
background: #353535;
|
|
border: 1px solid #232323;
|
|
color: #ffffff;
|
|
height: 18px;
|
|
width: 10px;
|
|
}
|
|
gui-slider input:disabled::-moz-range-thumb {
|
|
border-color: #000000;
|
|
color: #ffffff;
|
|
background-color: #333232;
|
|
background: #333232;
|
|
}
|
|
gui-slider input::-webkit-slider-thumb {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #353535;
|
|
background: #353535;
|
|
border: 1px solid #232323;
|
|
color: #ffffff;
|
|
height: 24px;
|
|
width: 16px;
|
|
margin-top: -10px;
|
|
}
|
|
gui-slider input:disabled::-webkit-range-thumb {
|
|
border-color: #000000;
|
|
color: #ffffff;
|
|
background-color: #333232;
|
|
background: #333232;
|
|
}
|
|
gui-slider input::-ms-thumb {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #353535;
|
|
background: #353535;
|
|
border: 1px solid #232323;
|
|
color: #ffffff;
|
|
height: 24px;
|
|
width: 16px;
|
|
}
|
|
gui-slider input:disabled::-ms-thumb {
|
|
border-color: #000000;
|
|
color: #ffffff;
|
|
background-color: #333232;
|
|
background: #333232;
|
|
}
|
|
/**
|
|
* MISC
|
|
*/
|
|
gui-slider input[type=range]::-ms-fill-lower {
|
|
border: 0 none;
|
|
background-color: #444444;
|
|
}
|
|
gui-slider input[type=range]::-ms-fill-upper {
|
|
border: 0 none;
|
|
background-color: #444444;
|
|
}
|
|
gui-slider input[type=range]:focus::-ms-fill-lower {
|
|
background-color: #444444;
|
|
}
|
|
gui-slider input[type=range]:focus::-ms-fill-upper {
|
|
background-color: #444444;
|
|
}
|
|
/* Switch */
|
|
gui-switch {
|
|
height: 26px;
|
|
}
|
|
gui-switch div {
|
|
width: 48px;
|
|
padding: 4px;
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
cursor: pointer;
|
|
padding: 0;
|
|
}
|
|
gui-switch button {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #353535;
|
|
background: #353535;
|
|
border: 1px solid #232323;
|
|
color: #ffffff;
|
|
}
|
|
gui-switch button:focus {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-switch > label > div {
|
|
margin-left: 4px;
|
|
}
|
|
gui-switch[data-disabled="true"] button {
|
|
border-color: #000000;
|
|
color: #ffffff;
|
|
background-color: #333232;
|
|
background: #333232;
|
|
}
|
|
gui-switch[data-disabled="true"] div {
|
|
border-color: #000000;
|
|
background-color: #333232;
|
|
color: #565656;
|
|
padding: 0;
|
|
}
|
|
gui-switch[data-disabled="true"] button,
|
|
gui-switch[data-disabled="true"] label {
|
|
color: #565656;
|
|
}
|
|
/* Text Field */
|
|
/* Password Field */
|
|
gui-password,
|
|
gui-text {
|
|
height: 26px;
|
|
}
|
|
gui-password input,
|
|
gui-text input {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
gui-password > label > input,
|
|
gui-text > label > input {
|
|
margin-left: 4px;
|
|
}
|
|
gui-password input:disabled,
|
|
gui-text input:disabled {
|
|
border-color: #000000;
|
|
background-color: #333232;
|
|
color: #565656;
|
|
}
|
|
gui-password input:focus,
|
|
gui-text input:focus {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-password[data-disabled="true"] label,
|
|
gui-text[data-disabled="true"] label {
|
|
color: #565656;
|
|
}
|
|
/* Text Area */
|
|
gui-textarea textarea {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
}
|
|
gui-textarea textarea:focus {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-textarea textarea:disabled {
|
|
border-color: #000000;
|
|
background-color: #333232;
|
|
color: #565656;
|
|
}
|
|
gui-textarea[data-disabled="true"] label {
|
|
color: #565656;
|
|
}
|
|
/* Rich Text */
|
|
gui-richtext {
|
|
padding: 4px;
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
}
|
|
gui-richtext > iframe {
|
|
background-color: #777777;
|
|
}
|
|
/* Grid */
|
|
gui-grid > gui-grid-row > gui-grid-entry {
|
|
/* li */
|
|
margin: 4px;
|
|
}
|
|
/* Modal Input */
|
|
gui-input-modal input {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
border-color: #000000;
|
|
background-color: #333232;
|
|
color: #565656;
|
|
}
|
|
gui-input-modal button {
|
|
margin-left: 4px;
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #353535;
|
|
background: #353535;
|
|
border: 1px solid #232323;
|
|
color: #ffffff;
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
gui-input-modal button:focus {
|
|
outline: 0 none transparent;
|
|
}
|
|
/**
|
|
* ===========================================================================
|
|
* MISC
|
|
* ===========================================================================
|
|
*/
|
|
/* Video */
|
|
/* Color Swatch */
|
|
gui-color-swatch {
|
|
border: 1px solid #232323;
|
|
}
|
|
/* Color Box */
|
|
gui-color-box {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
background-color: #353535;
|
|
background: #353535;
|
|
border: 1px solid #232323;
|
|
color: #ffffff;
|
|
}
|
|
gui-color-box > div {
|
|
background: #fff;
|
|
}
|
|
/* Menu */
|
|
gui-menu {
|
|
border: 1px solid transparent;
|
|
background: #353535;
|
|
box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.6);
|
|
color: #ffffff;
|
|
}
|
|
gui-menu > gui-menu-entry {
|
|
color: #ffffff;
|
|
}
|
|
gui-menu > gui-menu-entry > label {
|
|
cursor: pointer;
|
|
line-height: 18px;
|
|
padding: 4px;
|
|
}
|
|
gui-menu > gui-menu-entry.gui-menu-expand {
|
|
padding-right: 16px;
|
|
}
|
|
html[dir="rtl"] gui-menu > gui-menu-entry.gui-menu-expand {
|
|
padding-right: 0;
|
|
}
|
|
html[dir="rtl"] gui-menu > gui-menu-entry[data-icon] {
|
|
padding-right: 16px;
|
|
}
|
|
gui-menu > gui-menu-entry.gui-menu-expand:after {
|
|
content: '►';
|
|
font-family: sans-serif;
|
|
line-height: 18px;
|
|
padding: 4px;
|
|
}
|
|
gui-menu > gui-menu-entry.gui-hover,
|
|
gui-menu > gui-menu-entry:hover {
|
|
background-color: #2d73d2;
|
|
}
|
|
gui-menu > gui-menu-entry.gui-hover > label,
|
|
gui-menu > gui-menu-entry:hover > label {
|
|
color: #ffffff;
|
|
}
|
|
gui-menu > gui-menu-entry {
|
|
background-position: 4px center;
|
|
}
|
|
html[dir="rtl"] gui-menu > gui-menu-entry {
|
|
background-position: right 4px center;
|
|
}
|
|
gui-menu > gui-menu-entry > label.gui-has-image {
|
|
padding-left: 22px;
|
|
}
|
|
gui-menu > gui-menu-entry[data-disabled="true"],
|
|
gui-menu > gui-menu-entry[data-disabled="true"] > label {
|
|
color: #565656;
|
|
}
|
|
/* Menu Bar */
|
|
gui-menu-bar {
|
|
padding-left: 4px;
|
|
padding-right: 4px;
|
|
}
|
|
gui-menu-bar-entry {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
}
|
|
gui-menu-bar-entry:hover {
|
|
background: #2d73d2;
|
|
color: #ffffff;
|
|
}
|
|
gui-menu-bar-entry[data-disabled="true"] > span {
|
|
color: #565656;
|
|
}
|
|
/* Progressbar */
|
|
gui-progress-bar {
|
|
display: block;
|
|
height: 26px;
|
|
}
|
|
gui-progress-bar:before {
|
|
background-color: #444444;
|
|
border: 1px solid #232323;
|
|
padding: 4px;
|
|
}
|
|
gui-progress-bar > div {
|
|
background: #2d73d2 url('/themes/styles/dark/gui/progressbar.png') repeat-x center;
|
|
}
|
|
gui-progress-bar > span {
|
|
color: #fff;
|
|
}
|
|
/* Statusbar */
|
|
gui-statusbar {
|
|
margin: 4px;
|
|
padding-bottom: 4px;
|
|
}
|
|
/**
|
|
* ===========================================================================
|
|
* VIEWS
|
|
* ===========================================================================
|
|
*/
|
|
/* Icon View */
|
|
gui-icon-view {
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
padding: 4px;
|
|
}
|
|
gui-icon-view.gui-element-focused {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-icon-view-entry {
|
|
cursor: pointer;
|
|
margin: 2px;
|
|
padding: 2px;
|
|
text-align: center;
|
|
min-width: 60px !important;
|
|
min-height: 60px !important;
|
|
}
|
|
gui-icon-view-entry.gui-active {
|
|
background: rgba(45, 115, 210, 0.2);
|
|
color: #ffffff;
|
|
}
|
|
gui-icon-view-entry.gui-active > div > span {
|
|
background: rgba(45, 115, 210, 0.2);
|
|
}
|
|
gui-icon-view.gui-element-focused gui-icon-view-entry.gui-active {
|
|
background: #2d73d2;
|
|
}
|
|
gui-icon-view.gui-element-focused gui-icon-view-entry.gui-active > div > span {
|
|
background: #2d73d2;
|
|
}
|
|
/* List View */
|
|
gui-list-view {
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
}
|
|
gui-list-view.gui-element-focused {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-list-view-head {
|
|
background-color: #444444;
|
|
}
|
|
gui-list-view[data-zebra="true"] gui-list-view-body gui-list-view-row:nth-child(2n) {
|
|
background-color: #5A5A5A;
|
|
color: inherit;
|
|
}
|
|
gui-list-view-column {
|
|
padding: 4px;
|
|
}
|
|
gui-list-view-column.gui-has-image {
|
|
padding-left: 24px;
|
|
background-position: 4px;
|
|
}
|
|
html[dir="rtl"] gui-list-view gui-list-view-column.gui-has-image {
|
|
padding-left: 0;
|
|
padding-right: 24px;
|
|
background-position: right 4px center;
|
|
}
|
|
gui-list-view[data-icon-size="32"] gui-list-view-column.gui-has-image {
|
|
padding-left: 40px;
|
|
}
|
|
html[dir="rtl"] gui-list-view[data-icon-size="32"] gui-list-view-column.gui-has-image {
|
|
padding-left: 0;
|
|
padding-right: 40px;
|
|
}
|
|
gui-list-view-row.gui-active {
|
|
background-color: rgba(45, 115, 210, 0.2);
|
|
color: #ffffff;
|
|
}
|
|
gui-list-view.gui-element-focused gui-list-view-row.gui-active {
|
|
background-color: #2d73d2;
|
|
}
|
|
gui-list-view-column-resizer {
|
|
cursor: ew-resize;
|
|
width: 3px;
|
|
right: 0px;
|
|
}
|
|
gui-list-view-column-resizer:after {
|
|
background: #232323;
|
|
}
|
|
/* Tree View */
|
|
gui-tree-view {
|
|
background-color: #777777;
|
|
border: 1px solid #232323;
|
|
}
|
|
gui-tree-view.gui-element-focused {
|
|
outline: 0 none transparent;
|
|
}
|
|
gui-tree-view-entry.dnd-over > div {
|
|
font-weight: bold;
|
|
text-decoration: underline;
|
|
}
|
|
gui-tree-view-entry > div {
|
|
padding: 4px;
|
|
}
|
|
gui-tree-view-entry > div > span {
|
|
cursor: pointer;
|
|
padding: 2px;
|
|
}
|
|
gui-tree-view-entry > div > span.gui-has-image {
|
|
padding-left: 20px;
|
|
}
|
|
gui-tree-view-entry > gui-tree-view-entry {
|
|
margin-left: 16px;
|
|
}
|
|
gui-tree-view-entry > gui-tree-view-entry.gui-expandable {
|
|
margin-left: 2px;
|
|
}
|
|
gui-tree-view-entry.gui-active > div {
|
|
background-color: rgba(45, 115, 210, 0.2);
|
|
color: #ffffff;
|
|
}
|
|
gui-tree-view.gui-element-focused gui-tree-view-entry.gui-active > div {
|
|
background-color: #2d73d2;
|
|
}
|
|
gui-tree-view-entry.gui-expandable {
|
|
padding-left: 16px;
|
|
}
|
|
gui-tree-view-entry.gui-expandable gui-tree-view-expander {
|
|
padding-left: 4px;
|
|
cursor: pointer;
|
|
line-height: 24px;
|
|
}
|
|
gui-tree-view-entry.gui-expandable gui-tree-view-expander:before {
|
|
content: '\25BA';
|
|
font-family: Arial;
|
|
color: #232323;
|
|
}
|
|
gui-tree-view-entry.gui-expandable.gui-expanded > gui-tree-view-expander:before {
|
|
content: '\25BC';
|
|
}
|
|
/* Max */
|
|
application-window-button-maximize {
|
|
background: url('dark/wm/maximize_unfocused.png') no-repeat center center, url('dark/wm/maximize.png') no-repeat center center !important;
|
|
}
|
|
application-window-button-maximize:hover {
|
|
background: url('dark/wm/maximize_unfocused_prelight.png') no-repeat center center, url('dark/wm/maximize.png') no-repeat center center !important;
|
|
}
|
|
application-window-button-maximize:active {
|
|
background: url('dark/wm/maximize_unfocused_pressed.png') no-repeat center center, url('dark/wm/maximize.png') no-repeat center center !important;
|
|
}
|
|
application-window[data-focused="true"] application-window-button-maximize {
|
|
background: url('dark/wm/maximize_focused_normal.png') no-repeat center center, url('dark/wm/maximize.png') no-repeat center center !important;
|
|
}
|
|
application-window[data-focused="true"] application-window-button-maximize:hover {
|
|
background: url('dark/wm/maximize_focused_prelight.png') no-repeat center center, url('dark/wm/maximize.png') no-repeat center center !important;
|
|
}
|
|
application-window[data-focused="true"] application-window-button-maximize:active {
|
|
background: url('dark/wm/maximize_focused_pressed.png') no-repeat center center, url('dark/wm/maximize.png') no-repeat center center !important;
|
|
}
|
|
/* Min */
|
|
application-window-button-minimize {
|
|
background: url('dark/wm/minimize_unfocused.png') no-repeat center center, url('dark/wm/minimize.png') no-repeat center center !important;
|
|
}
|
|
application-window-button-minimize:hover {
|
|
background: url('dark/wm/minimize_unfocused_prelight.png') no-repeat center center, url('dark/wm/minimize.png') no-repeat center center !important;
|
|
}
|
|
application-window-button-minimize:active {
|
|
background: url('dark/wm/minimize_unfocused_pressed.png') no-repeat center center, url('dark/wm/minimize.png') no-repeat center center !important;
|
|
}
|
|
application-window[data-focused="true"] application-window-button-minimize {
|
|
background: url('dark/wm/minimize_focused_normal.png') no-repeat center center, url('dark/wm/minimize.png') no-repeat center center !important;
|
|
}
|
|
application-window[data-focused="true"] application-window-button-minimize:hover {
|
|
background: url('dark/wm/minimize_focused_prelight.png') no-repeat center center, url('dark/wm/minimize.png') no-repeat center center !important;
|
|
}
|
|
application-window[data-focused="true"] application-window-button-minimize:active {
|
|
background: url('dark/wm/minimize_focused_pressed.png') no-repeat center center, url('dark/wm/minimize.png') no-repeat center center !important;
|
|
}
|
|
/* Close */
|
|
application-window-button-close {
|
|
background: url('dark/wm/close_unfocused.png') no-repeat center center, url('dark/wm/close.png') no-repeat center center !important;
|
|
}
|
|
application-window-button-close:hover {
|
|
background: url('dark/wm/close_unfocused_prelight.png') no-repeat center center, url('dark/wm/close.png') no-repeat center center !important;
|
|
}
|
|
application-window-button-close:active {
|
|
background: url('dark/wm/close_unfocused_pressed.png') no-repeat center center, url('dark/wm/close.png') no-repeat center center !important;
|
|
}
|
|
application-window[data-focused="true"] application-window-button-close {
|
|
background: url('dark/wm/close_focused_normal.png') no-repeat center center, url('dark/wm/close.png') no-repeat center center !important;
|
|
}
|
|
application-window[data-focused="true"] application-window-button-close:hover {
|
|
background: url('dark/wm/close_focused_prelight.png') no-repeat center center, url('dark/wm/close.png') no-repeat center center !important;
|
|
}
|
|
application-window[data-focused="true"] application-window-button-close:active {
|
|
background: url('dark/wm/close_focused_pressed.png') no-repeat center center, url('dark/wm/close.png') no-repeat center center !important;
|
|
}
|