first part of syncing LCARStrek with Firefox 52 browser windows theme changes

[themes.git] / LCARStrek / browser / pageInfo.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/. */

@import "chrome://global/skin/";

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml"); /* namespace for HTML elements */

/* View buttons */
#viewGroup {
  padding-inline-start: 10px;
}

#viewGroup > radio {
  list-style-image: url("chrome://browser/skin/pageInfo.png");
  -moz-box-orient: vertical;
  -moz-box-align: center;
  -moz-appearance: none;
  padding: 5px 3px 1px 3px;
  margin: 0 1px;
  min-width: 4.5em;
  border-radius: 3px;
}

#viewGroup > radio:hover {
  background-color: #FFCF00;
  color: #000000;
}

#viewGroup > radio[selected="true"] {
  background-color: #008484;
  color: #FFCF00;
}

#topBar {
  border-bottom: 2px solid #9C9CFF;
  padding-inline-start: 10px;
  background-color: #000000;
  color: #FF9F00;
}

#generalTab {
  -moz-image-region: rect(0px, 32px, 32px, 0px)
}

#generalTab:hover, #generalTab[selected="true"] {
  -moz-image-region: rect(32px, 32px, 64px, 0px)
}

#mediaTab {
  -moz-image-region: rect(0px, 64px, 32px, 32px)
}

#mediaTab:hover, #mediaTab[selected="true"] {
  -moz-image-region: rect(32px, 64px, 64px, 32px)
}

#feedTab {
  -moz-image-region: rect(0px, 96px, 32px, 64px)
}

#feedTab:hover, #feedTab[selected="true"] {
  -moz-image-region: rect(32px, 96px, 64px, 64px)
}

#permTab {
  -moz-image-region: rect(0px, 128px, 32px, 96px)
}

#permTab:hover, #permTab[selected="true"] {
  -moz-image-region: rect(32px, 128px, 64px, 96px)
}

#securityTab {
  -moz-image-region: rect(0px, 160px, 32px, 128px)
}

#securityTab:hover, #securityTab[selected="true"] {
  -moz-image-region: rect(32px, 160px, 64px, 128px)
}

deck {
  padding: 10px 10px 10px 10px;
}

/* Misc */
tree {
  margin: .5em;
}

.gridSeparator {
  width: .5em;
}

row > label {
  padding: 0;
  margin-top: 0;
  margin-bottom: 0;
  min-height: 19px; /* match textbox */
}

textbox {
  background: transparent !important;
  border: none;
  padding: 0px;
  margin-top: 0px;
  -moz-appearance: none;
}

/* This would be ideal but doesn't work */
/*
html|*.textbox-input > .anonymous-div,
html|*.textbox-input::placeholder {
  line-height: 1em !important;
}
*/

textbox[readonly="true"] html|*.textbox-input {
  max-height: 1em; /* work around the above rule that does not work */
}

textbox.header {
  margin-inline-start: 0;
}

.iframe {
  margin: .5em;
  background: white;
  overflow: auto;
}

.fixedsize {
  height: 8.5em;
}

textbox[disabled] {
  font-style: italic;
}

/* General Tab */
groupbox.collapsable caption .caption-icon {
  width: 9px;
  height: 9px;
  background-repeat: no-repeat;
  background-position: center;
  margin-inline-start: 2px;
  margin-inline-end: 2px;
  background-image: url("chrome://global/skin/tree/twisty.svg#open-hover");
}

groupbox.collapsable[closed="true"] {
  border: none;
  margin-bottom: 9px;
  -moz-appearance: none;
}

groupbox.collapsable[closed="true"] > caption > .caption-icon {
  background-image: url("chrome://global/skin/tree/twisty.svg#clsd-hover");
}

groupbox.collapsable > caption:hover { 
  background-color: #FFCF00;
}

groupbox.treebox {
  padding: 0;
}

groupbox.treebox > tree {
  margin: 2px;
  margin-top: 0;
  border: none;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}

groupbox.treebox > tree > treecols > treecol {
  border: none;
  border-bottom: 1px solid #FF9F00;
  background-color: #A09090;
  border-radius: 0;
}

groupbox.treebox > tree > treechildren::-moz-tree-cell {
  padding: 0 3px;
}

#securityBox description {
  margin-inline-start: 10px;
}

#general-security-identity {
  white-space: pre-wrap;
  line-height: 2em;
}

/* Media Tab */
#imagetree {
  min-height: 10em;
  margin-bottom: 0;
}

#mediaSplitter {
  border-style: none;
  background: none;
  height: .8em;
}

#mediaGrid {
  min-height: 9em;
}

#mediaLabelColumn {
  min-width: 10em;
}

#thepreviewimage {
  margin: 1em;
}

treechildren::-moz-tree-cell-text(broken) {
  font-style: italic;
  color: #8050B0;
}

/* Feeds Tab */
#feedtree {
  margin-bottom: 0px;
}

#feedListbox richlistitem {
  padding-top: 6px;
  padding-bottom: 6px;
  padding-inline-start: 7px;
  padding-inline-end: 7px;
  min-height: 25px;
  border-bottom: 1px dotted #9C9CFF;
}
/*
#feedListbox richlistitem[selected="true"] {
  background-color: -moz-Dialog;
  color: -moz-DialogText;
}

#feedListbox {
  border: 2px solid;
  -moz-border-top-colors: ThreeDShadow ThreeDDarkShadow;
  -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow;
  -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow;
  -moz-border-left-colors: ThreeDShadow ThreeDDarkShadow;
}
*/
.feedTitle {
  font-weight: bold;
}

/* Permissions Tab */
#permList {
  margin-top: .5em;
  overflow: auto;
  border: 2px solid;
/*  -moz-border-top-colors: ThreeDShadow ThreeDDarkShadow;
  -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow;
  -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow;
  -moz-border-left-colors: ThreeDShadow ThreeDDarkShadow;
  background-color: -moz-field; */
}

.permission {
  padding-top: 6px;
  padding-bottom: 6px;
  padding-inline-start: 7px;
  padding-inline-end: 7px;
  min-height: 25px;
  border-bottom: 1px dotted #9C9CFF;
}

.permissionLabel {
  font-weight: bold;
}
/*
.permission:hover {
  background-color: -moz-dialog;
}
*/
/* Security Tab */
#securityPanel .caption-icon {
  display: none;
}

#securityPanel .header {
  font-size: 120%;
}
 
#securityPanel .fieldLabel {
  margin: 0px 10px;
}

#securityPanel .fieldValue {
  font-weight: bold;
  margin: 0px 10px;
}

#securityPanel row {
  -moz-box-align: center;
}

#security-technical-box > .fieldValue,
#security-technical-box > .fieldLabel {
  margin-bottom: .5em;
}