browser/themes/shared/pageInfo.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 @import url("chrome://global/skin/global.css");
   6 @namespace html url("http://www.w3.org/1999/xhtml");
   7
   8 @media (-moz-platform: macos) {
   9   #topBar {
  10     appearance: auto;
  11     -moz-default-appearance: toolbar;
  12     -moz-window-dragging: drag;
  13     align-items: center;
  14     justify-content: center;
  15   }
  16 }
  17
  18 @media not (-moz-platform: macos) {
  19   #topBar {
  20     border-bottom: 1px solid ThreeDShadow;
  21     padding-inline-start: 10px;
  22     background-color: Field;
  23     color: FieldText;
  24   }
  25 }
  26
  27 /* View buttons */
  28 @media not (-moz-platform: macos) {
  29   #viewGroup > radio {
  30     appearance: none;
  31     list-style-image: none;
  32     min-width: 4.5em;
  33     margin: 0;
  34     padding: 3px;
  35   }
  36
  37   #viewGroup > radio > .radio-label-box {
  38     margin: 0;
  39     padding: 0 6px;
  40   }
  41
  42   #viewGroup:focus-visible > radio[focused="true"] > .radio-label-box {
  43     outline: var(--default-focusring);
  44   }
  45
  46   #viewGroup .radio-icon {
  47     background-image: url("chrome://browser/skin/pageInfo.png");
  48     width: 32px;
  49     height: 32px;
  50     /* Avoid anti-aliasing seams in HiDPI */
  51     image-rendering: crisp-edges;
  52   }
  53
  54   #generalTab .radio-icon {
  55     background-position-x: 0;
  56   }
  57
  58   #mediaTab .radio-icon {
  59     background-position-x: -32px;
  60   }
  61
  62   #permTab .radio-icon {
  63     background-position-x: -96px;
  64   }
  65
  66   #securityTab .radio-icon {
  67     background-position-x: -128px;
  68   }
  69 }
  70
  71 @media (-moz-platform: linux) {
  72   #viewGroup > radio {
  73     color: FieldText;
  74   }
  75
  76   #viewGroup > radio[selected="true"] {
  77     background-color: SelectedItem;
  78     color: SelectedItemText;
  79   }
  80 }
  81
  82 @media (-moz-platform: windows) {
  83   #viewGroup {
  84     padding-inline-start: 10px;
  85   }
  86
  87   #viewGroup > radio:hover {
  88     background-color: #E0E8F6;
  89     color: black;
  90   }
  91
  92   #viewGroup > radio[selected="true"] {
  93     background-color: #C1D2EE;
  94     color: black;
  95   }
  96
  97   #viewGroup > radio:is(:hover, [selected="true"]) .radio-icon {
  98     background-position-y: -32px;
  99   }
 100 }
 101
 102 @media (-moz-platform: macos) {
 103   #viewGroup {
 104     margin: 4px 0 9px;
 105   }
 106
 107   #viewGroup > radio,
 108   #viewGroup > toolbarbutton {
 109     flex-direction: column;
 110     align-items: center;
 111     appearance: auto;
 112     -moz-default-appearance: toolbarbutton;
 113     font: menu;
 114     margin: 0;
 115     padding: 0 6px;
 116     height: 22px;
 117   }
 118
 119   @media (-moz-mac-big-sur-theme: 0) {
 120     #viewGroup > radio[selected=true],
 121     #viewGroup > toolbarbutton[checked=true] {
 122       color: #FFF !important;
 123       text-shadow: rgba(0, 0, 0, 0.4) 0 1px;
 124     }
 125   }
 126 }
 127
 128 /* Misc */
 129 tree {
 130   margin: .5em;
 131 }
 132
 133 html|input {
 134   background: transparent;
 135   border: none;
 136   padding: 0;
 137 }
 138
 139 html|input.header {
 140   margin-inline-start: 0;
 141 }
 142
 143 #imagecontainerbox {
 144   margin: .5em;
 145   background: white;
 146   overflow: auto;
 147   border: 1px solid ThreeDLightShadow;
 148 }
 149
 150 html|input:disabled {
 151   font-style: italic;
 152 }
 153
 154 @media (-moz-platform: macos) {
 155   .help-button {
 156     appearance: auto;
 157     -moz-default-appearance: -moz-mac-help-button;
 158   }
 159 }
 160
 161 /* General Tab */
 162
 163 @media (-moz-platform: linux) {
 164   #generalPanel > #titletext {
 165     margin-inline-start: 5px;
 166   }
 167 }
 168
 169 #securityBox description {
 170   margin-inline-start: 10px;
 171 }
 172
 173 #general-security-identity {
 174   white-space: pre-wrap;
 175   line-height: 2em;
 176 }
 177
 178 /* Media Tab */
 179 #imagetree {
 180   min-height: 10em;
 181   margin-block: 2px 0;
 182 }
 183
 184 #mediaSplitter {
 185   background: none;
 186   appearance: none;
 187   border-style: none;
 188 }
 189
 190 @media not (-moz-platform: macos) {
 191   #mediaSplitter {
 192     height: .8em;
 193   }
 194 }
 195
 196 #mediaTable {
 197   margin-bottom: 2em;
 198 }
 199
 200 #mediaLabelColumn {
 201   min-width: 10em;
 202 }
 203
 204 treechildren::-moz-tree-cell-text(broken) {
 205   font-style: italic;
 206   color: graytext;
 207 }
 208
 209 /* Permissions Tab */
 210
 211 #permList {
 212   appearance: auto;
 213   -moz-default-appearance: listbox;
 214   margin: .5em;
 215   overflow: auto;
 216   color: FieldText;
 217 }
 218
 219 .permission {
 220   padding: 6px 7px;
 221   border-bottom: 1px dotted ThreeDShadow;
 222 }
 223
 224 .permissionLabel {
 225   font-weight: bold;
 226 }
 227
 228 .permission:hover {
 229   background-color: -moz-dialog;
 230   color: -moz-DialogText;
 231 }
 232
 233 /* Security Tab */
 234
 235 #securityPanel table {
 236   margin-bottom: 1em;
 237 }