pgadmin4/web/pgadmin/static/css/wcDocker/wcDocker.css
Ashesh Vashi 18d767b107 Updated the wcDocker to make use of wcSplitter (new functionalities),
which will be used by the debugger tool.

Updating the wcDocker from the repository -
'https://github.com/WebCabin/wcDocker' up to commit-id:
0f5690318ce0bf457fdd374dcec7418d22b72e22
2016-02-29 19:36:51 +05:30

647 lines
12 KiB
CSS

/*!
* Web Cabin Docker - Docking Layout Interface.
*
* Dependancies:
* JQuery 1.11.1
*
* Version: git-master
*
* Author: Jeff Houde (lochemage@webcabin.org)
* Web: http://docker.webcabin.org/
*
* Licensed under
* MIT License http://www.opensource.org/licenses/mit-license
* GPL v3 http://opensource.org/licenses/GPL-3.0
*
*/
html, body {
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
margin: 0px;
}
.wcDisableSelection {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: -moz-none;
-ms-user-select: none;
user-select: none;
}
.wcModalBlocker {
position: fixed;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
z-index: -30;
}
.wcWide {
width: 100%;
left: 0px;
}
.wcTall {
height: 100%;
top: 0px;
}
.wcDocker {
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;
}
.wcDockerTransition {
opacity: 0;
}
.wcFrame {
position: relative;
/*overflow: hidden;*/
}
.wcFrameFlasher, .wcFrameShadower {
border: 0px;
margin: 0px;
padding: 0px;
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
opacity: 0;
}
.wcFrameTitleBar {
width: 100%;
cursor: move;
overflow: hidden;
position: absolute;
text-align: left;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: -moz-none;
-ms-user-select: none;
user-select: none;
}
.wcFrameTitle {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
}
.wcFrameTitleBar.wcNotMoveable {
cursor: default;
}
.wcCustomTabTitle {
cursor: default !important;
}
.wcCustomTabMoveable {
cursor: move !important;
}
.wcCustomTab {
position: relative;
}
.wcTabScroller {
height: 100%;
width: 10000px;
position: relative;
}
.wcFrameButtonBar {
position: absolute;
top: 0px;
right: 0px;
width: auto !important;
}
.wcFrameButton {
position: relative;
float: right;
cursor: pointer;
text-align: center;
overflow: hidden;
z-index: 1;
box-sizing: content-box;
}
.wcFrameButton > div {
width: 100%;
}
.wcButton {
box-sizing: content-box;
}
.wcFrameCenter {
overflow: hidden;
position: absolute;
top: 15px;
left: 0px;
right: 0px;
bottom: 0px;
}
.wcFloating {
position: fixed;
}
.wcFloatingFocus {
}
.wcModal {
}
.wcLayout, .wcLayout tr, .wcLayout td {
border: 0px;
margin: 0px;
padding: 0px;
border-spacing: 0px;
}
.wcLayout {
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
position: absolute;
}
.wcFrameEdge {
position: absolute;
z-index: 2;
border: 2px outset #444;
background-color: #222;
}
.wcFrameEdgeV {
width: 2px;
cursor: ew-resize;
border-top: 0px;
border-bottom: 0px;
}
.wcFrameEdgeH {
height: 2px;
cursor: ns-resize;
border-left: 0px;
border-right: 0px;
}
.wcFrameCornerNW {
height: 2px;
width: 2px;
cursor: nwse-resize;
}
.wcFrameCornerNE {
height: 2px;
width: 2px;
cursor: nesw-resize;
}
.wcSplitterBar {
z-index: 2;
position: absolute;
border: 1px outset darkgray;
}
.wcSplitterBarV {
width: 2px;
height: 100%;
cursor: ew-resize;
}
.wcSplitterBarH {
height: 2px;
width: 100%;
cursor: ns-resize;
}
.wcSplitterHidden {
width: 0px !important;
border: 0px !important;
display: none !important;
}
.wcSplitterBarV.wcSplitterBarStatic {
cursor: default !important;
}
.wcSplitterBarH.wcSplitterBarStatic {
cursor: default !important;
}
.wcLayoutPane {
border: 0px;
margin: 0px;
padding: 0px;
display: inline-block;
position: absolute;
}
.wcPanelTab {
vertical-align: top;
position: relative;
display: inline-block;
cursor: move;
top: 0px;
}
.wcPanelTab.wcNotMoveable {
cursor: default;
}
.wcTabLeft {
-webkit-transform: rotate(-90deg) scaleX(-1);
-ms-transform: rotate(-90deg) scaleX(-1);
-moz-transform: rotate(-90deg) scaleX(-1);
-o-transform: rotate(-90deg) scaleX(-1);
transform: rotate(-90deg) scaleX(-1);
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
-moz-transform-origin: left top;
-o-transform-origin: left top;
transform-origin: left top;
top: 0%;
left: 0%;
}
.wcTabLeft .wcFrameButton {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
-moz-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
.wcTabLeft .wcFrameButton span {
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
-moz-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
.wcTabLeft .wcPanelTab > div {
-webkit-transform: scaleX(-1);
-ms-transform: scaleX(-1);
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
transform: scaleX(-1);
}
.wcTabRight {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
-moz-transform-origin: left top;
-o-transform-origin: left top;
transform-origin: left top;
top: 0px;
left: 100%;
}
.wcTabRight .wcFrameButton {
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
-moz-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
.wcTabRight .wcFrameButton span {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
-moz-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
.wcTabBottom {
-webkit-transform: rotate(180deg) scaleX(-1);
-ms-transform: rotate(180deg) scaleX(-1);
-moz-transform: rotate(180deg) scaleX(-1);
-o-transform: rotate(180deg) scaleX(-1);
transform: rotate(180deg) scaleX(-1);
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
-moz-transform-origin: left top;
-o-transform-origin: left top;
transform-origin: left top;
top: 100%;
left: 0px;
}
.wcTabBottom .wcFrameButton {
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
-moz-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
.wcTabBottom .wcFrameButton span {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
-moz-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
.wcTabBottom .wcPanelTab > div {
-webkit-transform: scaleY(-1);
-ms-transform: scaleY(-1);
-moz-transform: scaleY(-1);
-o-transform: scaleY(-1);
transform: scaleY(-1);
}
.wcCollapseLeft.wcCollapsible,
.wcCollapseRight.wcCollapsed {
-webkit-transform: scaleX(-1);
-ms-transform: scaleX(-1);
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
transform: scaleX(-1);
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
-moz-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
.wcCollapseBottom.wcCollapsible {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
-moz-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
.wcCollapseBottom.wcCollapsed {
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
-moz-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
.wcPanelTabContent {
width: 100%;
height: 100%;
}
.wcPanelTabContent.wcPanelTabContentHidden {
display: none;
}
.wcResizing .wcHideOnResize .wcPanelTabContent {
display: none;
}
.wcGhost {
opacity: 0.0;
position: fixed;
z-index: 100;
cursor: move;
}
.wcScrollableX {
overflow-x: auto;
}
.wcScrollableY {
overflow-y: auto;
}
.wcOverflowVisible {
overflow: visible;
}
.wcTabIcon {
display: inline-block;
text-align: center;
}
.wcMenuIcon {
display: inline-block;
text-align: center;
}
.fa-menu {
margin-left: -24px;
width: 24px;
}
.context-menu-submenu:after {
content: '' !important;
}
.wcMenuSubMenu {
position: absolute;
right: 3px;
top: 3px;
}
.wcIFrame, .wcIFrame iframe {
position: absolute;
overflow: auto;
z-index: 1;
width: 100%;
height: 100%;
border: 0px;
margin: 0px;
padding: 0px;
}
.wcIFrameFocus {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
z-index: 2;
display: none;
}
.wcDisableSelection .wcIFrameFocus {
display: block;
}
.wcDisableSelection .wcIFrameFocus {
display: block;
}
.wcIFrame.wcDrawer {
z-index: 6;
}
.wcIFrameFloating {
/*z-index: 11;*/
}
.wcIFrameFloatingFocus {
/*z-index: 21;*/
}
.wcIFrameHidden, .wcIFramePanelHidden {
display: none;
}
.wcIFrameMoving {
pointer-events: none;
}
.wcCollapserFrame {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
overflow: hidden;
}
.wcDrawer {
z-index: 5;
}
.wcCreatePanel {
cursor: move;
}
.wcLoadingContainer, .wcLoadingBackground {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
}
.wcLoadingContainer {
z-index: 10;
}
.wcLoadingIconContainer {
position: absolute;
width: 100%;
height: 100%;
text-align: center;
vertical-align: middle;
}
.wcLoadingIcon {
position: absolute;
font-size: 200px;
left: calc(50% - 100px);
top: calc(50% - 100px);
height: 195px;
}
.wcLoadingLabel {
position: absolute;
width: 100%;
font-size: 100px;
top: calc(50% + 100px);
text-align: center;
}
.wcFullSized {
width: 100% !important;
height: 100% !important;
}
.fa-pulse {
-webkit-animation: fa-spin 1s infinite steps(8);
animation: fa-spin 1s infinite steps(8);
}
.wcAttributeLabel {
white-space: nowrap;
padding-right: 10px;
text-align: right;
}
.wcAttributeControl {
width: 100%;
}
.wcAttributeSpacer, .wcAttributeSpacerSolid {
width: 100%;
height: 22px;
text-align: center;
margin-top: 3px;
margin-bottom: 3px;
}
.wcAttributeSpacerSolid {
background-color: rgba(0, 0, 0, 0.25);
border-radius: 20px;
}