The Tor Browser / file comparison
comparison: browser/themes/shared/devtools/splitview.css
browser/themes/shared/devtools/splitview.css
- changeset 0
- 6474c204b198
equal
deleted
inserted
replaced
| -1:000000000000 | 0:f9a56cc073a9 |
|---|---|
| 1 /* vim:set ts=2 sw=2 sts=2 et: */ | |
| 2 /* This Source Code Form is subject to the terms of the Mozilla Public | |
| 3 * License, v. 2.0. If a copy of the MPL was not distributed with this | |
| 4 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ | |
| 5 | |
| 6 %filter substitution | |
| 7 %define smw_marginDark #000 | |
| 8 %define smw_marginLight #aaa | |
| 9 %define smw_itemDarkTopBorder rgba(0,0,0,0.2) | |
| 10 %define smw_itemDarkBottomBorder rgba(128,128,128,0.15) | |
| 11 %define smw_itemLightTopBorder rgba(128,128,128,0.15) | |
| 12 %define smw_itemLightBottomBorder transparent | |
| 13 | |
| 14 .loading .splitview-nav-container { | |
| 15 background-image: url(chrome://global/skin/icons/loading_16.png); | |
| 16 background-repeat: no-repeat; | |
| 17 background-position: center center; | |
| 18 } | |
| 19 | |
| 20 .theme-dark .splitview-nav-container { | |
| 21 background: url(background-noise-toolbar.png), #343c45; | |
| 22 } | |
| 23 | |
| 24 .splitview-nav { | |
| 25 -moz-appearance: none; | |
| 26 list-style-image: none; | |
| 27 list-style: none; | |
| 28 padding: 0; | |
| 29 margin: 0; | |
| 30 } | |
| 31 | |
| 32 .theme-dark .splitview-nav { | |
| 33 box-shadow: inset -1px 0 0 @smw_marginDark@; | |
| 34 } | |
| 35 | |
| 36 .theme-dark .splitview-nav:-moz-locale-dir(rtl) { | |
| 37 box-shadow: inset 1px 0 0 @smw_marginDark@; | |
| 38 } | |
| 39 | |
| 40 .theme-light .splitview-nav { | |
| 41 box-shadow: inset -1px 0 0 @smw_marginLight@; | |
| 42 } | |
| 43 | |
| 44 .theme-light .splitview-nav:-moz-locale-dir(rtl) { | |
| 45 box-shadow: inset 1px 0 0 @smw_marginLight@; | |
| 46 } | |
| 47 | |
| 48 .splitview-nav > li { | |
| 49 /* To compensate for the top and bottom borders */ | |
| 50 margin-top: -1px; | |
| 51 margin-bottom: -1px; | |
| 52 -moz-padding-end: 8px; | |
| 53 -moz-box-align: center; | |
| 54 outline: 0; | |
| 55 vertical-align: bottom; | |
| 56 } | |
| 57 | |
| 58 .theme-dark .splitview-nav > li { | |
| 59 border-top: 1px solid @smw_itemDarkTopBorder@; | |
| 60 border-bottom: 1px solid @smw_itemDarkBottomBorder@; | |
| 61 } | |
| 62 | |
| 63 .theme-dark .splitview-nav > li:last-of-type { | |
| 64 box-shadow: inset 0 -1px 0 @smw_itemDarkTopBorder@; | |
| 65 } | |
| 66 | |
| 67 .theme-light .splitview-nav > li { | |
| 68 border-top: 1px solid @smw_itemLightTopBorder@; | |
| 69 border-bottom: 1px solid @smw_itemLightBottomBorder@; | |
| 70 } | |
| 71 | |
| 72 .theme-light .splitview-nav > li:last-of-type { | |
| 73 box-shadow: inset 0 -1px 0 @smw_itemLightTopBorder@; | |
| 74 } | |
| 75 | |
| 76 .placeholder { | |
| 77 -moz-box-flex: 1; | |
| 78 text-align: center; | |
| 79 } | |
| 80 | |
| 81 .splitview-nav > li.splitview-active { | |
| 82 background-repeat: no-repeat, no-repeat, repeat-x; | |
| 83 background-position: center right, center right, top left; | |
| 84 background-size: auto, 1px, auto; | |
| 85 } | |
| 86 | |
| 87 .splitview-nav > li.splitview-active:-moz-locale-dir(rtl) { | |
| 88 background-repeat: no-repeat, no-repeat, repeat-x; | |
| 89 background-position: center left, center left, top right; | |
| 90 } | |
| 91 | |
| 92 .theme-dark .splitview-nav > li.splitview-active { | |
| 93 background-image: url(itemArrow-dark-ltr.png), | |
| 94 linear-gradient(@smw_marginDark@, @smw_marginDark@), | |
| 95 linear-gradient(#1d4f73, #1d4f73); | |
| 96 } | |
| 97 | |
| 98 .theme-dark .splitview-nav > li.splitview-active:-moz-locale-dir(rtl) { | |
| 99 background-image: url(itemArrow-dark-rtl.png), | |
| 100 linear-gradient(@smw_marginDark@, @smw_marginDark@), | |
| 101 linear-gradient(#1d4f73, #1d4f73); | |
| 102 } | |
| 103 | |
| 104 .theme-light .splitview-nav > li.splitview-active { | |
| 105 background-image: url(itemArrow-ltr.svg), | |
| 106 linear-gradient(@smw_marginLight@, @smw_marginLight@), | |
| 107 linear-gradient(#4c9ed9, #4c9ed9); | |
| 108 } | |
| 109 | |
| 110 .theme-light .splitview-nav > li.splitview-active:-moz-locale-dir(rtl) { | |
| 111 background-image: url(itemArrow-rtl.svg), | |
| 112 linear-gradient(@smw_marginLight@, @smw_marginLight@), | |
| 113 linear-gradient(#4c9ed9, #4c9ed9); | |
| 114 } | |
| 115 | |
| 116 /* Toolbars */ | |
| 117 | |
| 118 .splitview-main > .devtools-toolbar { | |
| 119 background-origin: border-box; | |
| 120 background-clip: border-box; | |
| 121 } | |
| 122 | |
| 123 .theme-dark .splitview-main > toolbar, | |
| 124 .theme-dark .loading .splitview-nav-container { | |
| 125 -moz-border-end: 1px solid @smw_marginDark@; | |
| 126 } | |
| 127 | |
| 128 .theme-light .splitview-main > toolbar, | |
| 129 .theme-light .loading .splitview-nav-container { | |
| 130 -moz-border-end: 1px solid @smw_marginLight@; | |
| 131 } | |
| 132 | |
| 133 .splitview-main > .devtools-toolbarbutton { | |
| 134 font-size: 11px; | |
| 135 padding: 0 8px; | |
| 136 width: auto; | |
| 137 min-width: 48px; | |
| 138 min-height: 0; | |
| 139 } | |
| 140 | |
| 141 | |
| 142 /* Resizers */ | |
| 143 | |
| 144 .splitview-portrait-resizer { | |
| 145 -moz-appearance: none; | |
| 146 background: linear-gradient(black 1px, rgba(255,255,255,0.2) 1px), | |
| 147 linear-gradient(hsl(210,11%,36%), hsl(210,11%,18%)); | |
| 148 height: 12px; | |
| 149 background-size: 10px 2px, 100% 12px; | |
| 150 background-clip: content-box, border-box; | |
| 151 background-repeat: repeat-y, no-repeat; | |
| 152 background-position: center center; | |
| 153 padding: 2px 0; | |
| 154 border-top: 1px solid hsla(210,8%,5%,.5); | |
| 155 border-bottom: 1px solid hsla(210,8%,5%,.5); | |
| 156 } |
