michael@0: /* This Source Code Form is subject to the terms of the Mozilla Public
michael@0:  * License, v. 2.0. If a copy of the MPL was not distributed with this
michael@0:  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
michael@0: 
michael@0: /* Platform-independent structural styling for
michael@0:  * <strike>Tab Candy</strike> Panorama
michael@0: ----------------------------------*/
michael@0: 
michael@0: html {
michael@0:   overflow: hidden;
michael@0: /*   image-rendering: -moz-crisp-edges; */
michael@0: }
michael@0: 
michael@0: body {
michael@0:   padding: 0px;
michael@0:   margin: 0 auto;
michael@0: }
michael@0: 
michael@0: #content {
michael@0:   overflow: -moz-hidden-unscrollable;
michael@0:   position: absolute;
michael@0:   top: 0;
michael@0:   left: 0;
michael@0:   width: 100%;
michael@0:   height: 100%;
michael@0: }
michael@0: 
michael@0: #bg {
michael@0:   position: absolute;
michael@0:   top: 0;
michael@0:   left: 0;
michael@0:   width: 100%;
michael@0:   height: 100%;
michael@0:   z-index: -999999;
michael@0: }
michael@0: 
michael@0: /* Tabs
michael@0: ----------------------------------*/
michael@0: 
michael@0: .tab {
michael@0:   position: absolute;
michael@0:   overflow: visible !important;
michael@0: }
michael@0: 
michael@0: .tab canvas,
michael@0: .cached-thumb {
michael@0:   width: 100%;
michael@0:   height: 100%;
michael@0:   position: absolute;
michael@0:   top: 0px;
michael@0:   left: 0px;
michael@0: }
michael@0: 
michael@0: .tabHidden {
michael@0:   display: none;
michael@0: }
michael@0: 
michael@0: .thumb {
michael@0:   position: relative;
michael@0:   width: 100%;
michael@0:   height: 100%;
michael@0: }
michael@0: 
michael@0: .favicon {
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: .close {
michael@0:   position: absolute;
michael@0:   cursor: pointer;
michael@0: }
michael@0: 
michael@0: .expander {
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: .tab-title {
michael@0:   position: absolute;
michael@0:   overflow: hidden;
michael@0:   text-overflow: ellipsis;
michael@0:   white-space: nowrap;
michael@0: }
michael@0: 
michael@0: .stacked .tab-title {
michael@0:   display: none;
michael@0: }
michael@0: 
michael@0: .stack-trayed .tab-title {
michael@0:   display: block !important;
michael@0: }
michael@0: 
michael@0: /* Tab: Zooming
michael@0: ----------------------------------*/
michael@0: 
michael@0: .front {
michael@0:   z-index: 999999 !important;
michael@0:   image-rendering: -moz-crisp-edges;
michael@0: }
michael@0: 
michael@0: .front canvas {
michael@0:   border: none !important;
michael@0:   padding: 1px !important;
michael@0: }
michael@0: 
michael@0: /* Groups
michael@0: ----------------------------------*/
michael@0: 
michael@0: .groupItem {
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: .appTabTrayContainer {
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: .title-container {
michael@0:   /* We want the title container to leave out width, position of the .close
michael@0:      button and space between input and .close button. Keep an eye on LTR and
michael@0:      RTL differences in .close. */
michael@0:   width: calc(100% - 16px - 6px - 6px);
michael@0: }
michael@0: 
michael@0: input.name {
michael@0:   text-overflow: ellipsis;
michael@0:   width: -moz-available;
michael@0: }
michael@0: 
michael@0: input.name:focus {
michael@0:   text-overflow: clip;
michael@0: }
michael@0: 
michael@0: /* Other Items
michael@0: ----------------------------------*/
michael@0: 
michael@0: .undo {
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: /* Trenches
michael@0: ----------------------------------*/
michael@0: 
michael@0: .guideTrench, 
michael@0: .visibleTrench, 
michael@0: .activeVisibleTrench {
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: .guideTrench {
michael@0:   z-index: -101;
michael@0: }
michael@0: 
michael@0: .visibleTrench {
michael@0:   z-index: -103;
michael@0: }
michael@0: 
michael@0: .activeVisibleTrench {
michael@0:   z-index: -102;
michael@0: }
michael@0: 
michael@0: /* Other
michael@0: ----------------------------------*/
michael@0: 
michael@0: .titlebar {
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: .title-shield {
michael@0:   position: absolute;
michael@0:   left: 0;
michael@0:   top: 0;
michael@0:   width: 100%;
michael@0:   height: 100%;
michael@0:   z-index: 10;
michael@0: }
michael@0: 
michael@0: .transparentBorder {
michael@0:   border: 1px solid transparent !important;
michael@0: }
michael@0: 
michael@0: .stackExpander {
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: .shield {
michael@0:   left: 0;
michael@0:   top: 0;
michael@0:   width: 100%;
michael@0:   height: 100%;
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: .banner {
michael@0:   left: 0;
michael@0:   bottom: 0;
michael@0:   right: 0;
michael@0:   padding: 10px 0;
michael@0:   position: absolute;
michael@0:   z-index: 1000060;
michael@0:   background: #000;
michael@0:   color: #fff;
michael@0:   opacity: 0;
michael@0:   text-align: center;
michael@0:   font-weight: 700;
michael@0: }
michael@0: 
michael@0: /* Resizable
michael@0: ----------------------------------*/
michael@0: .resizer {
michael@0:   position: absolute;
michael@0: }
michael@0: 
michael@0: .iq-resizable-handle {
michael@0:   position: absolute;
michael@0:   z-index: 99999;
michael@0:   display: block;
michael@0: }
michael@0: 
michael@0: .iq-resizable-disabled .iq-resizable-handle, 
michael@0: .iq-resizable-autohide .iq-resizable-handle {
michael@0:   display: none;
michael@0: }
michael@0: 
michael@0: /* Search
michael@0: ----------------------------------*/
michael@0: #searchshade{
michael@0:   position: absolute;
michael@0:   top: 0px;
michael@0:   left: 0px;
michael@0:   z-index: 1000001;
michael@0: }
michael@0: 
michael@0: #search{
michael@0:   position: absolute;
michael@0:   top: 0px;
michael@0:   left: 0px;
michael@0:   pointer-events: none;
michael@0:   z-index: 1000050;
michael@0: }
michael@0: 
michael@0: html[dir=rtl] #search {
michael@0:   left: auto;
michael@0:   right: 0;
michael@0: }
michael@0: 
michael@0: #searchbox{
michael@0:   position: absolute;
michael@0:   right: 20px;
michael@0:   top: 20px;
michael@0:   pointer-events: auto;
michael@0: }
michael@0: 
michael@0: html[dir=rtl] #searchbox {
michael@0:   right: auto;
michael@0:   left: 20px;
michael@0: }
michael@0: 
michael@0: #actions{
michael@0:   position: absolute;
michael@0:   top: 0px;
michael@0:   right: -3px;
michael@0:   z-index: 1000000;
michael@0: }
michael@0: 
michael@0: html[dir=rtl] #actions {
michael@0:   right: auto;
michael@0:   left: -3px;
michael@0: }
michael@0: 
michael@0: #otherresults{
michael@0:   position: absolute;
michael@0:   opacity: 0;
michael@0:   overflow: hidden;
michael@0: }
michael@0: 
michael@0: .onTop{
michael@0:   z-index: 1000010 !important;
michael@0: }
michael@0: 
michael@0: .inlineMatch{
michael@0:   display: inline-block;
michael@0:   pointer-events: auto;
michael@0: }
michael@0: 
michael@0: .inlineMatch>span{
michael@0:   display: inline-block;
michael@0:   overflow: hidden;
michael@0: }