mirror of
https://github.com/lxsang/ant-http
synced 2024-11-08 21:28:22 +01:00
1703 lines
38 KiB
CSS
1703 lines
38 KiB
CSS
|
@charset "UTF-8";
|
||
|
|
/*!
|
||
|
|
* OS.js - JavaScript Cloud/Web Desktop Platform
|
||
|
|
*
|
||
|
|
* Copyright (c) 2011-2015, 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
|
||
|
|
*/
|
||
|
|
|
||
|
|
html, body {
|
||
|
|
height : 100%;
|
||
|
|
overflow : hidden;
|
||
|
|
}
|
||
|
|
body {
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
background-color : #572a79;
|
||
|
|
}
|
||
|
|
body, input, button, textarea, label, select {
|
||
|
|
font-size : 12px;
|
||
|
|
font-family : Sans-serif, Arial;
|
||
|
|
}
|
||
|
|
#Login {
|
||
|
|
background : #fff;
|
||
|
|
width : 400px;
|
||
|
|
height : 230px;
|
||
|
|
padding : 20px;
|
||
|
|
position : absolute;
|
||
|
|
left : 50%;
|
||
|
|
top : 50%;
|
||
|
|
z-index : 9999;
|
||
|
|
margin-left : -200px;
|
||
|
|
margin-top : -155px;
|
||
|
|
border : 4px solid rgba(0, 0, 0, .1);
|
||
|
|
-webkit-box-shadow: 0 0 5px 4px rgba(0,0,0,0.15);
|
||
|
|
-moz-box-shadow: 0 0 5px 4px rgba(0,0,0,0.15);
|
||
|
|
box-shadow: 0 0 5px 4px rgba(0,0,0,0.15);
|
||
|
|
box-sizing : border-box;
|
||
|
|
display : none;
|
||
|
|
}
|
||
|
|
#LoginForm > div {
|
||
|
|
margin-bottom : 20px;
|
||
|
|
}
|
||
|
|
#Login label {
|
||
|
|
display : block;
|
||
|
|
font-weight : bold;
|
||
|
|
height : 30px;
|
||
|
|
line-height : 30px;
|
||
|
|
}
|
||
|
|
#Login input[type=text],
|
||
|
|
#Login input[type=password] {
|
||
|
|
display : block;
|
||
|
|
width : 100%;
|
||
|
|
height : 24px;
|
||
|
|
padding : 4px;
|
||
|
|
line-height : 12px;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
#Login input[type=submit] {
|
||
|
|
height : 40px;
|
||
|
|
padding : 10px;
|
||
|
|
padding-left : 20px;
|
||
|
|
padding-right : 20px;
|
||
|
|
box-sizing : border-box;
|
||
|
|
background : rgba(0, 0, 0, .1);
|
||
|
|
border : 0 none;
|
||
|
|
cursor : pointer;
|
||
|
|
}
|
||
|
|
#Login .Submit {
|
||
|
|
text-align : right;
|
||
|
|
}
|
||
|
|
#LoadingScreen {
|
||
|
|
position : absolute;
|
||
|
|
width : 320px;
|
||
|
|
height : 182px;
|
||
|
|
top : 50%;
|
||
|
|
left : 50%;
|
||
|
|
margin-top : -91px;
|
||
|
|
margin-left : -160px;
|
||
|
|
z-index : 999;
|
||
|
|
}
|
||
|
|
#LoadingScreen span {
|
||
|
|
color : #fff;
|
||
|
|
font-family : sans-serif, Arial;
|
||
|
|
font-size : 30px;
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
application-splash {
|
||
|
|
display : block;
|
||
|
|
position : absolute;
|
||
|
|
top : 50%;
|
||
|
|
left : 50%;
|
||
|
|
width : 300px;
|
||
|
|
height : 55px;
|
||
|
|
margin-left : -150px;
|
||
|
|
margin-top : -28px;
|
||
|
|
z-index : 99999998;
|
||
|
|
}
|
||
|
|
application-splash > img {
|
||
|
|
display : block;
|
||
|
|
position : absolute;
|
||
|
|
top : 5px;
|
||
|
|
left : 5px;
|
||
|
|
width : 16px;
|
||
|
|
height : 16px;
|
||
|
|
}
|
||
|
|
application-splash > span {
|
||
|
|
display : block;
|
||
|
|
position : absolute;
|
||
|
|
top : 5px;
|
||
|
|
left : 26px;
|
||
|
|
height : 16px;
|
||
|
|
line-height : 16px;
|
||
|
|
}
|
||
|
|
application-splash > gui-progress-bar {
|
||
|
|
position : absolute;
|
||
|
|
bottom : 5px;
|
||
|
|
left : 5px;
|
||
|
|
right : 5px;
|
||
|
|
}
|
||
|
|
#LoadingScreen application-splash {
|
||
|
|
position : absolute;
|
||
|
|
height : 30px;
|
||
|
|
width : auto;
|
||
|
|
top : auto;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : -40px;
|
||
|
|
margin : 0;
|
||
|
|
background : #fff;
|
||
|
|
z-index : 99999999;
|
||
|
|
}
|
||
|
|
#LoadingScreen application-splash > span {
|
||
|
|
display : none;
|
||
|
|
}
|
||
|
|
#LoadingScreen application-splash > gui-progress-bar {
|
||
|
|
top : 5px;
|
||
|
|
left : 5px;
|
||
|
|
right : 5px;
|
||
|
|
bottom : 5px;
|
||
|
|
height : auto;
|
||
|
|
}
|
||
|
|
#LoadingScreen application-splash > gui-progress-bar:before {
|
||
|
|
border : 1px solid #ccc;
|
||
|
|
background : #ddd;
|
||
|
|
}
|
||
|
|
#LoadingScreen application-splash > gui-progress-bar > span {
|
||
|
|
display : none;
|
||
|
|
}
|
||
|
|
#LoadingScreen application-splash > gui-progress-bar > div {
|
||
|
|
background : rgb(87, 42, 121);
|
||
|
|
}
|
||
|
|
body[data-attention="true"]:after {
|
||
|
|
content : '';
|
||
|
|
display : block;
|
||
|
|
position : fixed;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
z-index : 1;
|
||
|
|
}
|
||
|
|
#DebugNotice {
|
||
|
|
position : absolute;
|
||
|
|
bottom : 5px;
|
||
|
|
right : 5px;
|
||
|
|
font-size : 12px;
|
||
|
|
color : #fff;
|
||
|
|
text-shadow: 0 0 2px rgba(34, 34, 34, .5);
|
||
|
|
text-align : right;
|
||
|
|
line-height : 20px;
|
||
|
|
z-index : 2;
|
||
|
|
opacity : .7;
|
||
|
|
cursor : default;
|
||
|
|
}
|
||
|
|
#DebugNotice a {
|
||
|
|
color : #fff;
|
||
|
|
text-decoration : underline;
|
||
|
|
font-weight : normal;
|
||
|
|
cursor : pointer;
|
||
|
|
}
|
||
|
|
.application-window-button-entry,
|
||
|
|
application-window,
|
||
|
|
application-window-top,
|
||
|
|
application-window-content,
|
||
|
|
application-window-icon,
|
||
|
|
application-window-title,
|
||
|
|
application-window-loading,
|
||
|
|
application-window-disabled,
|
||
|
|
application-window-loading-indicator {
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
application-window {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
overflow : visible;
|
||
|
|
}
|
||
|
|
application-window:before {
|
||
|
|
content : '';
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
}
|
||
|
|
application-window-top {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
height : 20px;
|
||
|
|
z-index : 5;
|
||
|
|
display: -webkit-box;
|
||
|
|
display: -moz-box;
|
||
|
|
display: -ms-flexbox;
|
||
|
|
display: -webkit-flex;
|
||
|
|
display: flex;
|
||
|
|
-webkit-flex-wrap: nowrap;
|
||
|
|
-moz-flex-wrap: nowrap;
|
||
|
|
-ms-flex-wrap: nowrap;
|
||
|
|
-o-flex-wrap: nowrap;
|
||
|
|
flex-wrap: nowrap;
|
||
|
|
}
|
||
|
|
application-window-top > * {
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
display: -webkit-box;
|
||
|
|
display: -moz-box;
|
||
|
|
display: -ms-flexbox;
|
||
|
|
display: -webkit-flex;
|
||
|
|
display: flex;
|
||
|
|
-webkit-flex: 0 0 auto;
|
||
|
|
-moz-flex: 0 0 auto;
|
||
|
|
-ms-flex: 0 0 auto;
|
||
|
|
-o-flex: 0 0 auto;
|
||
|
|
flex: 0 0 auto;
|
||
|
|
}
|
||
|
|
application-window-icon {
|
||
|
|
text-align : center;
|
||
|
|
position : relative;
|
||
|
|
background-position : center center;
|
||
|
|
background-repeat : no-repeat;
|
||
|
|
background-size : 16px;
|
||
|
|
}
|
||
|
|
application-window-title {
|
||
|
|
height : 100%;
|
||
|
|
z-index : 1;
|
||
|
|
overflow : hidden;
|
||
|
|
white-space : nowrap;
|
||
|
|
line-height : 20px;
|
||
|
|
display : block;
|
||
|
|
-webkit-text-overflow: ellipsis;
|
||
|
|
-moz-text-overflow: ellipsis;
|
||
|
|
-ms-text-overflow: ellipsis;
|
||
|
|
-o-text-overflow: ellipsis;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
-webkit-flex: 1 1 auto;
|
||
|
|
-moz-flex: 1 1 auto;
|
||
|
|
-ms-flex: 1 1 auto;
|
||
|
|
-o-flex: 1 1 auto;
|
||
|
|
flex: 1 1 auto;
|
||
|
|
}
|
||
|
|
.application-window-button-entry {
|
||
|
|
padding : 0;
|
||
|
|
margin : 0;
|
||
|
|
height : 100%;
|
||
|
|
text-align : center;
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
display : none;
|
||
|
|
}
|
||
|
|
application-window[data-allow-maximize="true"] application-window-button-maximize {
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
application-window[data-allow-minimize="true"] application-window-button-minimize {
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
application-window[data-allow-close="true"] application-window-button-close {
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
application-window-content {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
z-index : 1;
|
||
|
|
}
|
||
|
|
application-window-resize {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
z-index : -1;
|
||
|
|
}
|
||
|
|
application-window[data-allow-resize="false"] > application-window-resize {
|
||
|
|
display : none;
|
||
|
|
cursor : default !important;
|
||
|
|
}
|
||
|
|
application-window-resize-handle {
|
||
|
|
position : absolute;
|
||
|
|
-webkit-touch-callout: none;
|
||
|
|
-webkit-user-select: none;
|
||
|
|
-moz-user-select: none;
|
||
|
|
-ms-user-select: none;
|
||
|
|
user-select: none;
|
||
|
|
}
|
||
|
|
application-window-resize-handle[data-direction="n"] {
|
||
|
|
cursor : n-resize;
|
||
|
|
top : 0;
|
||
|
|
height : 30px;
|
||
|
|
left : 20px;
|
||
|
|
right : 20px;
|
||
|
|
}
|
||
|
|
application-window-resize-handle[data-direction="s"] {
|
||
|
|
cursor : s-resize;
|
||
|
|
bottom : 0;
|
||
|
|
height : 30px;
|
||
|
|
left : 20px;
|
||
|
|
right : 20px;
|
||
|
|
}
|
||
|
|
application-window-resize-handle[data-direction="w"] {
|
||
|
|
cursor : w-resize;
|
||
|
|
left : 0;
|
||
|
|
width : 30px;
|
||
|
|
top : 20px;
|
||
|
|
bottom : 20px;
|
||
|
|
}
|
||
|
|
application-window-resize-handle[data-direction="e"] {
|
||
|
|
cursor : e-resize;
|
||
|
|
right : 0;
|
||
|
|
width : 30px;
|
||
|
|
top : 20px;
|
||
|
|
bottom : 20px;
|
||
|
|
}
|
||
|
|
application-window-resize-handle[data-direction="sw"] {
|
||
|
|
cursor : sw-resize;
|
||
|
|
bottom : 0;
|
||
|
|
left : 0;
|
||
|
|
height : 30px;
|
||
|
|
width : 30px;
|
||
|
|
}
|
||
|
|
application-window-resize-handle[data-direction="se"] {
|
||
|
|
cursor : se-resize;
|
||
|
|
bottom : 0;
|
||
|
|
right : 0;
|
||
|
|
height : 30px;
|
||
|
|
width : 30px;
|
||
|
|
}
|
||
|
|
application-window-resize-handle[data-direction="nw"] {
|
||
|
|
cursor : nw-resize;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
height : 30px;
|
||
|
|
width : 30px;
|
||
|
|
}
|
||
|
|
application-window-resize-handle[data-direction="ne"] {
|
||
|
|
cursor : ne-resize;
|
||
|
|
top : 0;
|
||
|
|
right : 0;
|
||
|
|
height : 30px;
|
||
|
|
width : 30px;
|
||
|
|
}
|
||
|
|
application-window-loading {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
z-index : 999999;
|
||
|
|
}
|
||
|
|
application-window-loading-indicator {
|
||
|
|
position : absolute;
|
||
|
|
left : 50%;
|
||
|
|
top : 50%;
|
||
|
|
}
|
||
|
|
application-window-disabled {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
z-index : 999998;
|
||
|
|
}
|
||
|
|
application-window[data-dnd-state="true"]:after {
|
||
|
|
content : '';
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
bottom : 0;
|
||
|
|
right : 0;
|
||
|
|
}
|
||
|
|
application-window[data-hint="resizing"] iframe,
|
||
|
|
application-window[data-hint="moving"] iframe {
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
application-window-warning {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
height : 30px;
|
||
|
|
line-height : 20px;
|
||
|
|
margin : 4px;
|
||
|
|
border : 1px solid transparent;
|
||
|
|
z-index : 99999;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
application-window-warning > div:nth-child(1) {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
padding : 4px;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
application-window-warning > div:nth-child(2) {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 20px;
|
||
|
|
bottom : 0;
|
||
|
|
padding : 4px;
|
||
|
|
overflow : hidden;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
application-window.DialogWindow gui-label label {
|
||
|
|
white-space : inherit;
|
||
|
|
}
|
||
|
|
application-window.DialogWindow gui-button-bar gui-button {
|
||
|
|
min-width : 80px;
|
||
|
|
}
|
||
|
|
application-window.DialogWindow gui-label[data-id="Message"] span {
|
||
|
|
font-weight : bold;
|
||
|
|
}
|
||
|
|
.IFrameApplicationWindow application-window-content {
|
||
|
|
background : #000;
|
||
|
|
}
|
||
|
|
.IframeApplicationFrame {
|
||
|
|
box-sizing : border-box;
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
border : 0 none;
|
||
|
|
outline : 0 none;
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
}
|
||
|
|
application-window[data-focused="false"] iframe {
|
||
|
|
pointer-events : none;
|
||
|
|
}
|
||
|
|
@media all and (max-width: 800px) {
|
||
|
|
body {
|
||
|
|
overflow : hidden;
|
||
|
|
}
|
||
|
|
application-window {
|
||
|
|
width : auto !important;
|
||
|
|
height : auto !important;
|
||
|
|
left : 0 !important;
|
||
|
|
right : 0 !important;
|
||
|
|
bottom : 0 !important;
|
||
|
|
top : 0 !important;
|
||
|
|
}
|
||
|
|
application-window-button-maximize,
|
||
|
|
application-window-button-minimize {
|
||
|
|
display : none !important;
|
||
|
|
}
|
||
|
|
application-window-content {
|
||
|
|
overflow : auto !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
button, div, span, p, a, img, label, .gui-element, application-window {
|
||
|
|
cursor : default;
|
||
|
|
-webkit-touch-callout: none;
|
||
|
|
-webkit-user-select: none;
|
||
|
|
-moz-user-select: none;
|
||
|
|
-ms-user-select: none;
|
||
|
|
user-select: none;
|
||
|
|
}
|
||
|
|
.gui-bold > label,
|
||
|
|
.gui-bold {
|
||
|
|
font-weight : bold;
|
||
|
|
}
|
||
|
|
.gui-italic > label,
|
||
|
|
.gui-italic {
|
||
|
|
font-style : italic;
|
||
|
|
}
|
||
|
|
.gui-underline > label,
|
||
|
|
.gui-underline {
|
||
|
|
text-decoration : underline;
|
||
|
|
}
|
||
|
|
.gui-align-left {
|
||
|
|
text-align : left;
|
||
|
|
}
|
||
|
|
.gui-align-center {
|
||
|
|
text-align : center;
|
||
|
|
}
|
||
|
|
.gui-align-right {
|
||
|
|
text-align : right;
|
||
|
|
}
|
||
|
|
.gui-disable-events {
|
||
|
|
pointer-events : none;
|
||
|
|
}
|
||
|
|
.gui-no-overflow {
|
||
|
|
overflow : hidden;
|
||
|
|
}
|
||
|
|
.gui-has-emblem {
|
||
|
|
background-repeat : no-repeat;
|
||
|
|
background-position : right center;
|
||
|
|
}
|
||
|
|
.gui-focus-element {
|
||
|
|
-webkit-appearance: none;
|
||
|
|
-moz-appearance: none;
|
||
|
|
-ms-appearance: none;
|
||
|
|
-o-appearance: none;
|
||
|
|
appearance: none;
|
||
|
|
display : block;
|
||
|
|
outline : 0 none;
|
||
|
|
resize : none;
|
||
|
|
border : 0 none;
|
||
|
|
background : transparent;
|
||
|
|
color : transparent;
|
||
|
|
position : absolute;
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
left : 0;
|
||
|
|
bottom : 0;
|
||
|
|
top : 0;
|
||
|
|
right : 0;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
z-index : 1;
|
||
|
|
overflow : hidden;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
.gui-flex-align-start {
|
||
|
|
-webkit-box-align: start;
|
||
|
|
-moz-box-align: start;
|
||
|
|
-ms-box-align: start;
|
||
|
|
-o-box-align: start;
|
||
|
|
box-align: start;
|
||
|
|
-webkit-align-self: flex-start;
|
||
|
|
-moz-align-self: flex-start;
|
||
|
|
-ms-align-self: flex-start;
|
||
|
|
-o-align-self: flex-start;
|
||
|
|
align-self: flex-start;
|
||
|
|
}
|
||
|
|
.gui-flex-align-end {
|
||
|
|
-webkit-box-align: end;
|
||
|
|
-moz-box-align: end;
|
||
|
|
-ms-box-align: end;
|
||
|
|
-o-box-align: end;
|
||
|
|
box-align: end;
|
||
|
|
-webkit-align-self: flex-end;
|
||
|
|
-moz-align-self: flex-end;
|
||
|
|
-ms-align-self: flex-end;
|
||
|
|
-o-align-self: flex-end;
|
||
|
|
align-self: flex-end;
|
||
|
|
}
|
||
|
|
.gui-flex-align-center {
|
||
|
|
-webkit-box-align: center;
|
||
|
|
-moz-box-align: center;
|
||
|
|
-ms-box-align: center;
|
||
|
|
-o-box-align: center;
|
||
|
|
box-align: center;
|
||
|
|
-webkit-align-self: center;
|
||
|
|
-moz-align-self: center;
|
||
|
|
-ms-align-self: center;
|
||
|
|
-o-align-self: center;
|
||
|
|
align-self: center;
|
||
|
|
}
|
||
|
|
.gui-flex {
|
||
|
|
display: -webkit-box;
|
||
|
|
display: -moz-box;
|
||
|
|
display: -ms-flexbox;
|
||
|
|
display: -webkit-flex;
|
||
|
|
display: flex;
|
||
|
|
-webkit-box-orient: horizontal;
|
||
|
|
-moz-box-orient: horizontal;
|
||
|
|
-ms-box-orient: horizontal;
|
||
|
|
-o-box-orient: horizontal;
|
||
|
|
box-orient: horizontal;
|
||
|
|
-webkit-flex-direction: row;
|
||
|
|
-moz-flex-direction: row;
|
||
|
|
-ms-flex-direction: row;
|
||
|
|
-o-flex-direction: row;
|
||
|
|
flex-direction: row;
|
||
|
|
}
|
||
|
|
.gui-flex > * {
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
.gui-flex-normal {
|
||
|
|
-webkit-box-flex: 0 0 auto;
|
||
|
|
-moz-box-flex: 0 0 auto;
|
||
|
|
-ms-box-flex: 0 0 auto;
|
||
|
|
-o-box-flex: 0 0 auto;
|
||
|
|
-webkit-flex: 0 0 auto;
|
||
|
|
-moz-flex: 0 0 auto;
|
||
|
|
-ms-flex: 0 0 auto;
|
||
|
|
-o-flex: 0 0 auto;
|
||
|
|
flex: 0 0 auto;
|
||
|
|
}
|
||
|
|
.gui-flex-grow-shrink {
|
||
|
|
-webkit-box-flex: 1 1 auto;
|
||
|
|
-moz-box-flex: 1 1 auto;
|
||
|
|
-ms-box-flex: 1 1 auto;
|
||
|
|
-o-box-flex: 1 1 auto;
|
||
|
|
-webkit-flex: 1 1 auto;
|
||
|
|
-moz-flex: 1 1 auto;
|
||
|
|
-ms-flex: 1 1 auto;
|
||
|
|
-o-flex: 1 1 auto;
|
||
|
|
flex: 1 1 auto;
|
||
|
|
}
|
||
|
|
.gui-flex-grow {
|
||
|
|
-webkit-box-flex: 1 0 auto;
|
||
|
|
-moz-box-flex: 1 0 auto;
|
||
|
|
-ms-box-flex: 1 0 auto;
|
||
|
|
-o-box-flex: 1 0 auto;
|
||
|
|
-webkit-flex: 1 0 auto;
|
||
|
|
-moz-flex: 1 0 auto;
|
||
|
|
-ms-flex: 1 0 auto;
|
||
|
|
-o-flex: 1 0 auto;
|
||
|
|
flex: 1 0 auto;
|
||
|
|
}
|
||
|
|
.gui-flex-shrink {
|
||
|
|
-webkit-box-flex: 0 1 auto;
|
||
|
|
-moz-box-flex: 0 1 auto;
|
||
|
|
-ms-box-flex: 0 1 auto;
|
||
|
|
-o-box-flex: 0 1 auto;
|
||
|
|
-webkit-flex: 0 1 auto;
|
||
|
|
-moz-flex: 0 1 auto;
|
||
|
|
-ms-flex: 0 1 auto;
|
||
|
|
-o-flex: 0 1 auto;
|
||
|
|
flex: 0 1 auto;
|
||
|
|
}
|
||
|
|
gui-container {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
overflow : auto;
|
||
|
|
}
|
||
|
|
gui-hbox,
|
||
|
|
gui-vbox {
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
position : relative;
|
||
|
|
display: -webkit-box;
|
||
|
|
display: -moz-box;
|
||
|
|
display: -ms-flexbox;
|
||
|
|
display: -webkit-flex;
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
gui-hbox {
|
||
|
|
-webkit-box-orient: horizontal;
|
||
|
|
-moz-box-orient: horizontal;
|
||
|
|
-ms-box-orient: horizontal;
|
||
|
|
-o-box-orient: horizontal;
|
||
|
|
box-orient: horizontal;
|
||
|
|
-webkit-flex-direction: row;
|
||
|
|
-moz-flex-direction: row;
|
||
|
|
-ms-flex-direction: row;
|
||
|
|
-o-flex-direction: row;
|
||
|
|
flex-direction: row;
|
||
|
|
}
|
||
|
|
gui-vbox {
|
||
|
|
-webkit-box-orient: vertical;
|
||
|
|
-moz-box-orient: vertical;
|
||
|
|
-ms-box-orient: vertical;
|
||
|
|
-o-box-orient: vertical;
|
||
|
|
box-orient: vertical;
|
||
|
|
-webkit-flex-direction: column;
|
||
|
|
-moz-flex-direction: column;
|
||
|
|
-ms-flex-direction: column;
|
||
|
|
-o-flex-direction: column;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
gui-hbox-container {
|
||
|
|
height : 100%;
|
||
|
|
}
|
||
|
|
gui-hbox-container,
|
||
|
|
gui-vbox-container {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
-webkit-box-flex: 0 0 auto;
|
||
|
|
-moz-box-flex: 0 0 auto;
|
||
|
|
-ms-box-flex: 0 0 auto;
|
||
|
|
-o-box-flex: 0 0 auto;
|
||
|
|
-webkit-flex: 0 0 auto;
|
||
|
|
-moz-flex: 0 0 auto;
|
||
|
|
-ms-flex: 0 0 auto;
|
||
|
|
-o-flex: 0 0 auto;
|
||
|
|
flex: 0 0 auto;
|
||
|
|
}
|
||
|
|
gui-hbox-container[data-fill='true'],
|
||
|
|
gui-vbox-container[data-fill='true'] {
|
||
|
|
-webkit-align-items: stretch;
|
||
|
|
-moz-align-items: stretch;
|
||
|
|
-ms-align-items: stretch;
|
||
|
|
-o-align-items: stretch;
|
||
|
|
align-items: stretch;
|
||
|
|
-webkit-align-content: stretch;
|
||
|
|
-moz-align-content: stretch;
|
||
|
|
-ms-align-content: stretch;
|
||
|
|
-o-align-content: stretch;
|
||
|
|
align-content: stretch;
|
||
|
|
}
|
||
|
|
gui-hbox-container[data-expand='true'] > *,
|
||
|
|
gui-vbox-container[data-expand='true'] > * {
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
gui-hbox-container[data-fill='true'] > *,
|
||
|
|
gui-vbox-container[data-fill='true'] > * {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
bottom : 0;
|
||
|
|
right : 0;
|
||
|
|
}
|
||
|
|
gui-hbox-container[data-fill='true'] > gui-hbox,
|
||
|
|
gui-hbox-container[data-fill='true'] > gui-vbox,
|
||
|
|
gui-vbox-container[data-fill='true'] > gui-hbox,
|
||
|
|
gui-vbox-container[data-fill='true'] > gui-vbox {
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
}
|
||
|
|
gui-hbox-container[data-fill='true'] > gui-vbox,
|
||
|
|
gui-hbox-container[data-fill='true'] > gui-hbox,
|
||
|
|
gui-vbox-container[data-fill='true'] > gui-vbox,
|
||
|
|
gui-vbox-container[data-fill='true'] > gui-hbox {
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
}
|
||
|
|
gui-scroll-view {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
overflow : auto;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
}
|
||
|
|
gui-paned-view {
|
||
|
|
position : relative;
|
||
|
|
overflow : hidden;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
display: -webkit-box;
|
||
|
|
display: -moz-box;
|
||
|
|
display: -ms-flexbox;
|
||
|
|
display: -webkit-flex;
|
||
|
|
display: flex;
|
||
|
|
-webkit-box-orient: horizontal;
|
||
|
|
-moz-box-orient: horizontal;
|
||
|
|
-ms-box-orient: horizontal;
|
||
|
|
-o-box-orient: horizontal;
|
||
|
|
box-orient: horizontal;
|
||
|
|
-webkit-flex-direction: row;
|
||
|
|
-moz-flex-direction: row;
|
||
|
|
-ms-flex-direction: row;
|
||
|
|
-o-flex-direction: row;
|
||
|
|
flex-direction: row;
|
||
|
|
}
|
||
|
|
gui-paned-view[data-orientation='vertical'] {
|
||
|
|
-webkit-box-orient: vertical;
|
||
|
|
-moz-box-orient: vertical;
|
||
|
|
-ms-box-orient: vertical;
|
||
|
|
-o-box-orient: vertical;
|
||
|
|
box-orient: vertical;
|
||
|
|
-webkit-flex-direction: column;
|
||
|
|
-moz-flex-direction: column;
|
||
|
|
-ms-flex-direction: column;
|
||
|
|
-o-flex-direction: column;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
gui-paned-view > * {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
-webkit-box-flex: 1 1 auto;
|
||
|
|
-moz-box-flex: 1 1 auto;
|
||
|
|
-ms-box-flex: 1 1 auto;
|
||
|
|
-o-box-flex: 1 1 auto;
|
||
|
|
-webkit-flex: 1 1 auto;
|
||
|
|
-moz-flex: 1 1 auto;
|
||
|
|
-ms-flex: 1 1 auto;
|
||
|
|
-o-flex: 1 1 auto;
|
||
|
|
flex: 1 1 auto;
|
||
|
|
}
|
||
|
|
gui-paned-view > gui-paned-view-container {
|
||
|
|
height : 100%;
|
||
|
|
overflow : hidden;
|
||
|
|
}
|
||
|
|
gui-paned-view > gui-paned-view-container > * {
|
||
|
|
height : 100%;
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
gui-paned-view > gui-paned-view-container[data-fill='true'] > * {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
bottom : 0;
|
||
|
|
right : 0;
|
||
|
|
}
|
||
|
|
gui-paned-view > gui-paned-view-handle {
|
||
|
|
height : 100%;
|
||
|
|
-webkit-box-flex: 0 1 auto;
|
||
|
|
-moz-box-flex: 0 1 auto;
|
||
|
|
-ms-box-flex: 0 1 auto;
|
||
|
|
-o-box-flex: 0 1 auto;
|
||
|
|
-webkit-flex: 0 1 auto;
|
||
|
|
-moz-flex: 0 1 auto;
|
||
|
|
-ms-flex: 0 1 auto;
|
||
|
|
-o-flex: 0 1 auto;
|
||
|
|
flex: 0 1 auto;
|
||
|
|
}
|
||
|
|
gui-paned-view > gui-paned-view-container {
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : auto;
|
||
|
|
}
|
||
|
|
gui-paned-view[data-orientation='vertical'] > gui-paned-view-container {
|
||
|
|
min-width : auto;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-iframe {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-iframe > iframe {
|
||
|
|
display : block;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
border : 0 none;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-toolbar,
|
||
|
|
gui-button-bar {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
overflow : hidden;
|
||
|
|
font-size : 0;
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-button-bar {
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
gui-toolbar[data-orientation="vertical"],
|
||
|
|
gui-button-bar[data-orientation="vertical"] {
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
}
|
||
|
|
gui-toolbar-separator {
|
||
|
|
display : inline-block;
|
||
|
|
}
|
||
|
|
gui-expander {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-expander-label {
|
||
|
|
display : block !important;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-expander[data-expanded="false"] > * {
|
||
|
|
display : none;
|
||
|
|
}
|
||
|
|
gui-tabs {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-tabs > ul {
|
||
|
|
display : block;
|
||
|
|
list-style-type : none;
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
gui-tabs > ul > li {
|
||
|
|
position : relative;
|
||
|
|
display : inline-block;
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
height : 100%;
|
||
|
|
}
|
||
|
|
gui-tabs > ul > li.gui-active:after {
|
||
|
|
content : '';
|
||
|
|
position : absolute;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
z-index : 999999999;
|
||
|
|
}
|
||
|
|
gui-tabs > gui-tab-container {
|
||
|
|
overflow : hidden;
|
||
|
|
display : none;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-tab-container.gui-active {
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
application-window-content > gui-tabs {
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
}
|
||
|
|
gui-grid {
|
||
|
|
position : relative;
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
gui-grid > gui-grid-row {
|
||
|
|
display: -webkit-box;
|
||
|
|
display: -moz-box;
|
||
|
|
display: -ms-flexbox;
|
||
|
|
display: -webkit-flex;
|
||
|
|
display: flex;
|
||
|
|
-webkit-box-orient: horizontal;
|
||
|
|
-moz-box-orient: horizontal;
|
||
|
|
-ms-box-orient: horizontal;
|
||
|
|
-o-box-orient: horizontal;
|
||
|
|
box-orient: horizontal;
|
||
|
|
-webkit-flex-direction: row;
|
||
|
|
-moz-flex-direction: row;
|
||
|
|
-ms-flex-direction: row;
|
||
|
|
-o-flex-direction: row;
|
||
|
|
flex-direction: row;
|
||
|
|
justify-content: space-around;
|
||
|
|
}
|
||
|
|
gui-grid > gui-grid-row > gui-grid-entry {
|
||
|
|
margin: 5px;
|
||
|
|
-webkit-box-flex: 1 0 auto;
|
||
|
|
-moz-box-flex: 1 0 auto;
|
||
|
|
-ms-box-flex: 1 0 auto;
|
||
|
|
-o-box-flex: 1 0 auto;
|
||
|
|
-webkit-flex: 1 0 auto;
|
||
|
|
-moz-flex: 1 0 auto;
|
||
|
|
-ms-flex: 1 0 auto;
|
||
|
|
-o-flex: 1 0 auto;
|
||
|
|
flex: 1 0 auto;
|
||
|
|
height: auto;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
gui-grid > gui-grid-row > gui-grid-entry > * {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
margin : 0;
|
||
|
|
box-sizing : border-box;
|
||
|
|
overflow : hidden;
|
||
|
|
}
|
||
|
|
gui-grid > gui-grid-row > gui-grid-entry > * > * {
|
||
|
|
height : 100%;
|
||
|
|
}
|
||
|
|
gui-grid > gui-grid-row > gui-grid-entry:before {
|
||
|
|
content:'';
|
||
|
|
float:left;
|
||
|
|
padding-top:100%;
|
||
|
|
}
|
||
|
|
gui-label {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-label > label {
|
||
|
|
display : inline;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
gui-button {
|
||
|
|
position : relative;
|
||
|
|
display : inline-block;
|
||
|
|
box-sizing : content-box;
|
||
|
|
}
|
||
|
|
gui-button button {
|
||
|
|
display : block;
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
outline : 0 none;
|
||
|
|
white-space: nowrap;
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
}
|
||
|
|
gui-button button::-moz-focus-inner {
|
||
|
|
border : 0;
|
||
|
|
padding : 0;
|
||
|
|
}
|
||
|
|
gui-button[data-icon-size="32"] {
|
||
|
|
min-width : 32px;
|
||
|
|
min-height : 32px;
|
||
|
|
}
|
||
|
|
gui-button.gui-has-image img {
|
||
|
|
vertical-align : middle;
|
||
|
|
}
|
||
|
|
gui-button.gui-has-image.gui-has-label img {
|
||
|
|
position : absolute;
|
||
|
|
top : 50%;
|
||
|
|
margin-top : -8px;
|
||
|
|
left : 8px;
|
||
|
|
}
|
||
|
|
gui-button[data-icon-size="32"].gui-has-image.gui-has-label img {
|
||
|
|
margin-top : -16px;
|
||
|
|
}
|
||
|
|
gui-radio,
|
||
|
|
gui-checkbox {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-radio input,
|
||
|
|
gui-checkbox input {
|
||
|
|
-webkit-appearance: none;
|
||
|
|
-moz-appearance: none;
|
||
|
|
-ms-appearance: none;
|
||
|
|
-o-appearance: none;
|
||
|
|
appearance: none;
|
||
|
|
display: inline-block;
|
||
|
|
vertical-align : middle;
|
||
|
|
position: relative;
|
||
|
|
background: transparent;
|
||
|
|
border: 0 none;
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
overflow : hidden;
|
||
|
|
outline : none;
|
||
|
|
}
|
||
|
|
gui-radio input:checked:after {
|
||
|
|
display : inline;
|
||
|
|
vertical-align: middle;
|
||
|
|
}
|
||
|
|
gui-checkbox input:checked:after {
|
||
|
|
display : inline;
|
||
|
|
vertical-align: middle;
|
||
|
|
}
|
||
|
|
gui-radio > label > span,
|
||
|
|
gui-checkbox > label > span {
|
||
|
|
vertical-align : middle;
|
||
|
|
}
|
||
|
|
gui-radio {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-select {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-select select {
|
||
|
|
-webkit-appearance: none;
|
||
|
|
-moz-appearance: none;
|
||
|
|
-ms-appearance: none;
|
||
|
|
-o-appearance: none;
|
||
|
|
appearance: none;
|
||
|
|
-webkit-border-radius: 0;
|
||
|
|
-moz-border-radius: 0;
|
||
|
|
-ms-border-radius: 0;
|
||
|
|
-o-border-radius: 0;
|
||
|
|
border-radius: 0;
|
||
|
|
display : block;
|
||
|
|
padding : 0;
|
||
|
|
margin : 0;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
outline : none;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-select:before {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
z-index: 99;
|
||
|
|
pointer-events: none;
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
gui-select:after {
|
||
|
|
position: absolute;
|
||
|
|
z-index: 100;
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
gui-select-list {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
min-height : 32px;
|
||
|
|
}
|
||
|
|
gui-select-list select {
|
||
|
|
-webkit-appearance: none;
|
||
|
|
-moz-appearance: none;
|
||
|
|
-ms-appearance: none;
|
||
|
|
-o-appearance: none;
|
||
|
|
appearance: none;
|
||
|
|
-webkit-border-radius: 0;
|
||
|
|
-moz-border-radius: 0;
|
||
|
|
-ms-border-radius: 0;
|
||
|
|
-o-border-radius: 0;
|
||
|
|
border-radius: 0;
|
||
|
|
display : block;
|
||
|
|
padding : 0;
|
||
|
|
margin : 0;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
outline : none;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-slider {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-slider input {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
width : 100%;
|
||
|
|
padding : 0;
|
||
|
|
margin : 0;
|
||
|
|
vertical-align : middle;
|
||
|
|
outline : 0 none;
|
||
|
|
box-sizing : border-box;
|
||
|
|
-webkit-appearance: none;
|
||
|
|
-moz-appearance: none;
|
||
|
|
-ms-appearance: none;
|
||
|
|
-o-appearance: none;
|
||
|
|
appearance: none;
|
||
|
|
}
|
||
|
|
gui-slider input::-moz-range-track {
|
||
|
|
-moz-appearance: none;
|
||
|
|
appearance: none;
|
||
|
|
background : transparent;
|
||
|
|
border : 0 none;
|
||
|
|
width : 100%;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-slider input::-webkit-slider-runnable-track {
|
||
|
|
width : 100%;
|
||
|
|
border : 0 none;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-slider input::-ms-track {
|
||
|
|
width: 100%;
|
||
|
|
border : 0 none;
|
||
|
|
cursor: pointer;
|
||
|
|
background: transparent;
|
||
|
|
border-color: transparent;
|
||
|
|
color: transparent;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-slider input::-moz-range-thumb {
|
||
|
|
-moz-appearance: none;
|
||
|
|
-moz-border-radius : 0;
|
||
|
|
border-radius : 0;
|
||
|
|
}
|
||
|
|
gui-slider input::-webkit-slider-thumb {
|
||
|
|
-webkit-appearance: none !important;
|
||
|
|
-webkit-border-radius : 0;
|
||
|
|
border-radius : 0;
|
||
|
|
}
|
||
|
|
gui-slider input::-ms-thumb {
|
||
|
|
-ms-appearance : none !important;
|
||
|
|
-ms-border-radius : 0;
|
||
|
|
border-radius : 0;
|
||
|
|
}
|
||
|
|
gui-slider input[type=range]::-ms-fill-lower {
|
||
|
|
border : 0 none;
|
||
|
|
background-color : #d9d9d9;
|
||
|
|
}
|
||
|
|
gui-slider input[type=range]::-ms-fill-upper {
|
||
|
|
border : 0 none;
|
||
|
|
background-color : #d9d9d9;
|
||
|
|
}
|
||
|
|
gui-slider input[type=range]:focus::-ms-fill-lower {
|
||
|
|
background-color : #d9d9d9;
|
||
|
|
}
|
||
|
|
gui-slider input[type=range]:focus::-ms-fill-upper {
|
||
|
|
background-color : #d9d9d9;
|
||
|
|
}
|
||
|
|
gui-switch {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-switch div {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-switch button {
|
||
|
|
display : inline-block;
|
||
|
|
outline : 0 none;
|
||
|
|
margin : 0;
|
||
|
|
width : 50%;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-switch button.gui-active {
|
||
|
|
margin-left : 50%;
|
||
|
|
}
|
||
|
|
gui-switch input {
|
||
|
|
display : none;
|
||
|
|
pointer-events : none;
|
||
|
|
}
|
||
|
|
gui-password,
|
||
|
|
gui-text {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-password input,
|
||
|
|
gui-text input {
|
||
|
|
display : block;
|
||
|
|
padding : 0;
|
||
|
|
margin : 0;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
background : transparent;
|
||
|
|
border : 0 none;
|
||
|
|
outline : none;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-password > label > input,
|
||
|
|
gui-text > label > input {
|
||
|
|
display : inline-block;
|
||
|
|
width : auto;
|
||
|
|
}
|
||
|
|
gui-textarea {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-textarea textarea {
|
||
|
|
display : block;
|
||
|
|
padding : 0;
|
||
|
|
margin : 0;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
border : 0 none;
|
||
|
|
resize : none;
|
||
|
|
outline : none;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-richtext {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
min-height : 100px !important;
|
||
|
|
}
|
||
|
|
gui-richtext > iframe {
|
||
|
|
display : block;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
border : 0 none;
|
||
|
|
box-sizing : border-box;
|
||
|
|
}
|
||
|
|
gui-file-upload {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-input-modal {
|
||
|
|
position : relative;
|
||
|
|
display : inline-block;
|
||
|
|
}
|
||
|
|
gui-input-modal > div {
|
||
|
|
display: -webkit-box;
|
||
|
|
display: -moz-box;
|
||
|
|
display: -ms-flexbox;
|
||
|
|
display: -webkit-flex;
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
gui-input-modal input {
|
||
|
|
display : inline-block;
|
||
|
|
padding : 0;
|
||
|
|
margin : 0;
|
||
|
|
border : 0 none;
|
||
|
|
outline : none;
|
||
|
|
-webkit-box-flex: 1 0 auto;
|
||
|
|
-moz-box-flex: 1 0 auto;
|
||
|
|
-ms-box-flex: 1 0 auto;
|
||
|
|
-o-box-flex: 1 0 auto;
|
||
|
|
-webkit-flex: 1 0 auto;
|
||
|
|
-moz-flex: 1 0 auto;
|
||
|
|
-ms-flex: 1 0 auto;
|
||
|
|
-o-flex: 1 0 auto;
|
||
|
|
flex: 1 0 auto;
|
||
|
|
}
|
||
|
|
gui-input-modal button {
|
||
|
|
display : inline-block;
|
||
|
|
-webkit-box-flex: 0 1 auto;
|
||
|
|
-moz-box-flex: 0 1 auto;
|
||
|
|
-ms-box-flex: 0 1 auto;
|
||
|
|
-o-box-flex: 0 1 auto;
|
||
|
|
-webkit-flex: 0 1 auto;
|
||
|
|
-moz-flex: 0 1 auto;
|
||
|
|
-ms-flex: 0 1 auto;
|
||
|
|
-o-flex: 0 1 auto;
|
||
|
|
flex: 0 1 auto;
|
||
|
|
}
|
||
|
|
gui-audio {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-video {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-image {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-image > img {
|
||
|
|
border : 0 none;
|
||
|
|
outline : 0 none;
|
||
|
|
vertical-align : middle;
|
||
|
|
}
|
||
|
|
gui-canvas {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-color-swatch {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
min-width : 100px !important;
|
||
|
|
min-height : 100px !important;
|
||
|
|
}
|
||
|
|
gui-color-swatch canvas {
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
gui-color-box {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
background-color : #fff;
|
||
|
|
}
|
||
|
|
gui-color-box[data-disabled="true"] {
|
||
|
|
cursor : default !important;
|
||
|
|
}
|
||
|
|
gui-color-box > div {
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-menu {
|
||
|
|
display : inline-block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-menu.gui-root-menu {
|
||
|
|
display : block;
|
||
|
|
position : absolute;
|
||
|
|
z-index : 99999999;
|
||
|
|
}
|
||
|
|
gui-menu > gui-menu-entry {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
white-space : nowrap;
|
||
|
|
}
|
||
|
|
gui-menu > gui-menu-entry[data-disabled="true"] {
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
gui-menu > .gui-menu-expand:after {
|
||
|
|
position : absolute;
|
||
|
|
right : 0;
|
||
|
|
top : 0;
|
||
|
|
bottom : 0;
|
||
|
|
}
|
||
|
|
html[dir="rtl"] gui-menu > .gui-menu-expand:after {
|
||
|
|
right : auto;
|
||
|
|
left : 0;
|
||
|
|
-webkit-transform: rotate(180deg);
|
||
|
|
-moz-transform: rotate(180deg);
|
||
|
|
-ms-transform: rotate(180deg);
|
||
|
|
transform: rotate(180deg);
|
||
|
|
}
|
||
|
|
gui-menu > gui-menu-entry {
|
||
|
|
background-repeat : no-repeat;
|
||
|
|
background-position : left center;
|
||
|
|
background-size : 16px;
|
||
|
|
}
|
||
|
|
gui-menu > gui-menu-entry > label {
|
||
|
|
vertical-align : middle;
|
||
|
|
display : inline-block;
|
||
|
|
pointer-events : none;
|
||
|
|
}
|
||
|
|
gui-menu > gui-menu-entry > label > input {
|
||
|
|
margin : 0;
|
||
|
|
padding : 0;
|
||
|
|
vertical-align : middle;
|
||
|
|
margin-top : -2px;
|
||
|
|
padding-right : 2px;
|
||
|
|
pointer-events : none;
|
||
|
|
}
|
||
|
|
gui-menu > gui-menu-entry > gui-menu {
|
||
|
|
position : absolute;
|
||
|
|
z-index : 99999;
|
||
|
|
}
|
||
|
|
.gui-showing gui-menu-entry > gui-menu {
|
||
|
|
display : none;
|
||
|
|
}
|
||
|
|
gui-menu > .gui-hover > gui-menu,
|
||
|
|
gui-menu > gui-menu-entry:hover > gui-menu {
|
||
|
|
display : inline-block;
|
||
|
|
left : 100%;
|
||
|
|
top : 0;
|
||
|
|
}
|
||
|
|
.gui-overflowing > gui-menu-entry:hover > gui-menu {
|
||
|
|
left : auto;
|
||
|
|
top : 0;
|
||
|
|
}
|
||
|
|
gui-menu.gui-root-menu > gui-menu-entry:hover > gui-menu {
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
gui-menu.gui-root-menu > gui-menu-entry[data-disabled="true"]:hover > gui-menu {
|
||
|
|
display : none;
|
||
|
|
}
|
||
|
|
gui-menu-bar {
|
||
|
|
position : relative;
|
||
|
|
display : block;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-menu-bar-entry {
|
||
|
|
position : relative;
|
||
|
|
display : inline-block;
|
||
|
|
}
|
||
|
|
gui-menu-bar-entry > span {
|
||
|
|
pointer-events : none;
|
||
|
|
display : block;
|
||
|
|
}
|
||
|
|
gui-menu-bar-entry > gui-menu {
|
||
|
|
display : none;
|
||
|
|
position : absolute;
|
||
|
|
z-index : 99999;
|
||
|
|
}
|
||
|
|
gui-menu-bar-entry.gui-active > gui-menu {
|
||
|
|
display : inline-block;
|
||
|
|
top : 100%;
|
||
|
|
left : 0;
|
||
|
|
}
|
||
|
|
gui-progress-bar {
|
||
|
|
position : relative;
|
||
|
|
display : inline-block;
|
||
|
|
text-align : center;
|
||
|
|
overflow : hidden;
|
||
|
|
}
|
||
|
|
gui-progress-bar:before {
|
||
|
|
content : '';
|
||
|
|
position : absolute;
|
||
|
|
left : 0;
|
||
|
|
bottom : 0;
|
||
|
|
right : 0;
|
||
|
|
top : 0;
|
||
|
|
z-index : -1;
|
||
|
|
}
|
||
|
|
gui-progress-bar > div {
|
||
|
|
position : absolute;
|
||
|
|
left : 1px;
|
||
|
|
bottom : 1px;
|
||
|
|
top : 1px;
|
||
|
|
z-index : -1;
|
||
|
|
}
|
||
|
|
gui-progress-bar > span {
|
||
|
|
display : inline-block;
|
||
|
|
vertical-align : middle;
|
||
|
|
position : absolute;
|
||
|
|
top : 50%;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
height : 16px;
|
||
|
|
margin-top : -8px;
|
||
|
|
}
|
||
|
|
gui-statusbar {
|
||
|
|
position : relative;
|
||
|
|
display : block;
|
||
|
|
min-height : 16px;
|
||
|
|
overflow : hidden;
|
||
|
|
white-space : nowrap;
|
||
|
|
-webkit-text-overflow: ellipsis;
|
||
|
|
-moz-text-overflow: ellipsis;
|
||
|
|
-ms-text-overflow: ellipsis;
|
||
|
|
-o-text-overflow: ellipsis;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
}
|
||
|
|
gui-statusbar-label {
|
||
|
|
display : inline-block;
|
||
|
|
vertical-align : middle;
|
||
|
|
}
|
||
|
|
gui-file-view {
|
||
|
|
position : relative;
|
||
|
|
display : inline-block;
|
||
|
|
}
|
||
|
|
gui-file-view > * {
|
||
|
|
display : block;
|
||
|
|
width : 100%;
|
||
|
|
height : 100%;
|
||
|
|
}
|
||
|
|
gui-icon-view {
|
||
|
|
position : relative;
|
||
|
|
display : inline-block;
|
||
|
|
overflow : auto;
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-icon-view-body {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
z-index : 2;
|
||
|
|
}
|
||
|
|
gui-icon-view-entry {
|
||
|
|
float : left;
|
||
|
|
width : 34px;
|
||
|
|
width : 54px;
|
||
|
|
}
|
||
|
|
gui-icon-view-entry > div {
|
||
|
|
pointer-events: none;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-icon-view-entry > div > img {
|
||
|
|
pointer-events: none;
|
||
|
|
width : 32px;
|
||
|
|
height : 32px;
|
||
|
|
}
|
||
|
|
gui-icon-view-entry > div > span {
|
||
|
|
pointer-events: none;
|
||
|
|
position : absolute;
|
||
|
|
display : block;
|
||
|
|
left : -2px;
|
||
|
|
right : -2px;
|
||
|
|
top : 0;
|
||
|
|
padding : 2px;
|
||
|
|
z-index : 9999;
|
||
|
|
white-space : nowrap;
|
||
|
|
overflow: hidden;
|
||
|
|
-webkit-text-overflow: ellipsis;
|
||
|
|
-moz-text-overflow: ellipsis;
|
||
|
|
-ms-text-overflow: ellipsis;
|
||
|
|
-o-text-overflow: ellipsis;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
}
|
||
|
|
gui-icon-view-entry.gui-active > div > span {
|
||
|
|
pointer-events: none;
|
||
|
|
overflow: visible;
|
||
|
|
white-space : pre-wrap;
|
||
|
|
word-wrap : break-word;
|
||
|
|
text-overflow: inherit;
|
||
|
|
-o-text-overflow: inherit;
|
||
|
|
}
|
||
|
|
gui-list-view {
|
||
|
|
position : relative;
|
||
|
|
display : inline-block;
|
||
|
|
overflow : auto;
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-list-view-inner {
|
||
|
|
display : table;
|
||
|
|
width : 100%;
|
||
|
|
z-index : 2;
|
||
|
|
position : relative;
|
||
|
|
table-layout : fixed;
|
||
|
|
border-collapse : collapse;
|
||
|
|
}
|
||
|
|
gui-list-view-body {
|
||
|
|
position : relative;
|
||
|
|
z-index : 2;
|
||
|
|
display : table-row-group;
|
||
|
|
width : 100%;
|
||
|
|
}
|
||
|
|
gui-list-view-head {
|
||
|
|
display : table-header-group;
|
||
|
|
width : 100%;
|
||
|
|
visibility : hidden;
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
gui-list-view-row {
|
||
|
|
position : relative;
|
||
|
|
display : table-row;
|
||
|
|
width : 100%;
|
||
|
|
}
|
||
|
|
gui-list-view-column {
|
||
|
|
position : relative;
|
||
|
|
display : table-cell;
|
||
|
|
background-repeat : no-repeat;
|
||
|
|
background-position : left center;
|
||
|
|
background-size : 16px;
|
||
|
|
line-height : 16px;
|
||
|
|
}
|
||
|
|
gui-list-view[data-icon-size="32"] gui-list-view-column {
|
||
|
|
line-height : 32px;
|
||
|
|
background-size : 32px;
|
||
|
|
}
|
||
|
|
gui-list-view-column > span {
|
||
|
|
pointer-events: none;
|
||
|
|
white-space: nowrap;
|
||
|
|
display : block;
|
||
|
|
overflow : hidden;
|
||
|
|
-webkit-text-overflow: ellipsis;
|
||
|
|
-moz-text-overflow: ellipsis;
|
||
|
|
-ms-text-overflow: ellipsis;
|
||
|
|
-o-text-overflow: ellipsis;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
}
|
||
|
|
gui-list-view-fake-head {
|
||
|
|
position : absolute;
|
||
|
|
display : block;
|
||
|
|
top : 0;
|
||
|
|
}
|
||
|
|
gui-list-view-fake-head gui-list-view-head {
|
||
|
|
visibility : visible;
|
||
|
|
}
|
||
|
|
gui-list-view-column-resizer {
|
||
|
|
width : 1px;
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
bottom : 0;
|
||
|
|
left : 0;
|
||
|
|
z-index : 999999999;
|
||
|
|
pointer-events: all;
|
||
|
|
}
|
||
|
|
gui-list-view-column-resizer:after {
|
||
|
|
content : '';
|
||
|
|
background : #b2b2b2;
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 1px;
|
||
|
|
width : 1px;
|
||
|
|
bottom : 0;
|
||
|
|
}
|
||
|
|
gui-tree-view {
|
||
|
|
position : relative;
|
||
|
|
display : inline-block;
|
||
|
|
overflow : auto;
|
||
|
|
min-width : 16px;
|
||
|
|
min-height : 16px;
|
||
|
|
}
|
||
|
|
gui-tree-view-body {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
right : 0;
|
||
|
|
bottom : 0;
|
||
|
|
z-index : 2;
|
||
|
|
}
|
||
|
|
gui-tree-view-entry {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
}
|
||
|
|
gui-tree-view-entry > div {
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
gui-tree-view-entry > div > span {
|
||
|
|
pointer-events: none;
|
||
|
|
background-repeat : no-repeat;
|
||
|
|
background-position : left center;
|
||
|
|
display : inline-block;
|
||
|
|
vertical-align : middle;
|
||
|
|
-webkit-text-overflow: ellipsis;
|
||
|
|
-moz-text-overflow: ellipsis;
|
||
|
|
-ms-text-overflow: ellipsis;
|
||
|
|
-o-text-overflow: ellipsis;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
}
|
||
|
|
gui-tree-view-entry.gui-expandable {
|
||
|
|
padding-left : 16px;
|
||
|
|
}
|
||
|
|
gui-tree-view-entry.gui-expandable gui-tree-view-expander {
|
||
|
|
display : block;
|
||
|
|
position : absolute;
|
||
|
|
left : 0;
|
||
|
|
top : 0;
|
||
|
|
width : 16px;
|
||
|
|
height : 16px;
|
||
|
|
overflow : visible;
|
||
|
|
}
|
||
|
|
gui-toolbar > .gui-element {
|
||
|
|
vertical-align : middle;
|
||
|
|
}
|