From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001 From: "Matt A. Tobin" Date: Fri, 2 Feb 2018 04:16:08 -0500 Subject: Add m-esr52 at 52.6.0 --- devtools/client/shared/widgets/spectrum.css | 155 ++++++++++++++++++++++++++++ 1 file changed, 155 insertions(+) create mode 100644 devtools/client/shared/widgets/spectrum.css (limited to 'devtools/client/shared/widgets/spectrum.css') diff --git a/devtools/client/shared/widgets/spectrum.css b/devtools/client/shared/widgets/spectrum.css new file mode 100644 index 000000000..46826f2e1 --- /dev/null +++ b/devtools/client/shared/widgets/spectrum.css @@ -0,0 +1,155 @@ +/* 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/. */ + +#eyedropper-button { + margin-inline-start: 5px; + display: block; +} + +#eyedropper-button::before { + background-image: url(chrome://devtools/skin/images/command-eyedropper.svg); +} + +/* Mix-in classes */ + +.spectrum-checker { + background-color: #eee; + background-image: linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc), + linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc); + background-size: 12px 12px; + background-position: 0 0, 6px 6px; +} + +.spectrum-slider-control { + cursor: pointer; + box-shadow: 0 0 2px rgba(0,0,0,.6); + background: #fff; + border-radius: 10px; + opacity: .8; +} + +.spectrum-box { + border: 1px solid rgba(0,0,0,0.2); + border-radius: 2px; + background-clip: content-box; +} + +/* Elements */ + +#spectrum-tooltip { + padding: 4px; +} + +.spectrum-container { + position: relative; + display: none; + top: 0; + left: 0; + border-radius: 0; + width: 200px; + padding: 5px; +} + +.spectrum-show { + display: inline-block; +} + +/* Keep aspect ratio: +http://www.briangrinstead.com/blog/keep-aspect-ratio-with-html-and-css */ +.spectrum-top { + position: relative; + width: 100%; + display: inline-block; +} + +.spectrum-top-inner { + position: absolute; + top:0; + left:0; + bottom:0; + right:0; +} + +.spectrum-color { + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 20%; +} + +.spectrum-hue { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 83%; +} + +.spectrum-fill { + /* Same as spectrum-color width */ + margin-top: 85%; +} + +.spectrum-sat, .spectrum-val { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; +} + +.spectrum-dragger, .spectrum-slider { + -moz-user-select: none; +} + +.spectrum-alpha { + position: relative; + height: 8px; + margin-top: 3px; +} + +.spectrum-alpha-inner { + height: 100%; +} + +.spectrum-alpha-handle { + position: absolute; + top: -3px; + bottom: -3px; + width: 5px; + left: 50%; +} + +.spectrum-sat { + background-image: linear-gradient(to right, #FFF, rgba(204, 154, 129, 0)); +} + +.spectrum-val { + background-image: linear-gradient(to top, #000000, rgba(204, 154, 129, 0)); +} + +.spectrum-hue { + background: linear-gradient(to bottom, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%); +} + +.spectrum-dragger { + position: absolute; + top: 0px; + left: 0px; + cursor: pointer; + border-radius: 50%; + height: 8px; + width: 8px; + border: 1px solid white; + box-shadow: 0 0 2px rgba(0,0,0,.6); +} + +.spectrum-slider { + position: absolute; + top: 0; + height: 5px; + left: -3px; + right: -3px; +} -- cgit v1.2.3