99 lines
2.7 KiB
CSS
99 lines
2.7 KiB
CSS
/* This Source Code Form is subject to the terms of the Mozilla Public
|
|
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
|
|
|
%include ../../shared/syncedtabs/sidebar.inc.css
|
|
|
|
/* These styles are intended to mimic XUL trees and the XUL search box. */
|
|
|
|
html {
|
|
}
|
|
|
|
.item {
|
|
color: -moz-DialogText;
|
|
}
|
|
|
|
.item.selected > .item-title-container {
|
|
color: HighlightText;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.item.selected > .item-title-container {
|
|
background: linear-gradient(to bottom, rgba(156,172,204,1) 0%, rgba(116,135,172,1) 100%);
|
|
}
|
|
|
|
.item.selected:focus > .item-title-container {
|
|
background: linear-gradient(to bottom, rgba(95,144,209,1) 0%, rgba(39,90,173,1) 100%);
|
|
}
|
|
|
|
/* Using '-moz-appearance: twistytree[open];' seems to force the twisty to
|
|
be 20px high and max-height etc doesn't adjust it. So we set the max-height
|
|
on the container and a negative margin-top on the twisty itself to keep things
|
|
aligned.
|
|
*/
|
|
.item-title-container {
|
|
max-height: 16px;
|
|
}
|
|
|
|
.item.client .item-twisty-container {
|
|
margin-top: -2px;
|
|
-moz-appearance: treetwistyopen;
|
|
}
|
|
|
|
.item.client.closed .item-twisty-container {
|
|
-moz-appearance: treetwisty;
|
|
}
|
|
|
|
.sidebar-search-container {
|
|
border-bottom: 1px solid #bdbdbd;
|
|
}
|
|
|
|
.search-box {
|
|
-moz-appearance: searchfield;
|
|
padding: 1px;
|
|
font-size: 12px;
|
|
cursor: text;
|
|
margin: 4px 8px 10px;
|
|
border-width: 3px;
|
|
border-style: solid;
|
|
border-color: -moz-use-text-color;
|
|
border-image: none;
|
|
-moz-border-top-colors: transparent #888 #000;
|
|
-moz-border-right-colors: transparent #FFF #000;
|
|
-moz-border-bottom-colors: transparent #FFF #000;
|
|
-moz-border-left-colors: transparent #888 #000;
|
|
border-top-right-radius: 2px;
|
|
border-bottom-left-radius: 2px;
|
|
background-color: #FFF;
|
|
color: #000;
|
|
-moz-user-select: text;
|
|
text-shadow: none;
|
|
}
|
|
|
|
.search-box.compact > .textbox-input-box > .textbox-search-icons > .textbox-search-clear {
|
|
background-image: url(chrome://global/skin/icons/searchfield-cancel.svg);
|
|
background-repeat: no-repeat;
|
|
background-size: 11px 11px;
|
|
}
|
|
|
|
.search-box.compact > .textbox-input-box > .textbox-search-icons > .textbox-search-icon {
|
|
display: none;
|
|
}
|
|
|
|
.search-box[focused="true"] {
|
|
-moz-border-top-colors: -moz-mac-focusring -moz-mac-focusring #000000;
|
|
-moz-border-right-colors: -moz-mac-focusring -moz-mac-focusring #000000;
|
|
-moz-border-bottom-colors: -moz-mac-focusring -moz-mac-focusring #000000;
|
|
-moz-border-left-colors: -moz-mac-focusring -moz-mac-focusring #000000;
|
|
}
|
|
|
|
.search-box.compact {
|
|
padding: 0px;
|
|
/* font size is in px because the XUL it was copied from uses px */
|
|
font-size: 11px;
|
|
}
|
|
|
|
.textbox-search-clear,
|
|
.textbox-search-icon {
|
|
margin-top: 1px;
|
|
}
|