/*! * 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; } .wcFrameButton > div { width: 100%; } .wcFrameCenter { overflow: hidden; position: absolute; top: 15px; left: 0px; right: 0px; bottom: 0px; } .wcFloating { position: fixed; z-index: 10; } .wcFloatingFocus { z-index: 20; } .wcModal { z-index: 40; } .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 { float: right; } .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; } .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; } .fa-pulse { -webkit-animation: fa-spin 1s infinite steps(8); animation: fa-spin 1s infinite steps(8); }