diff options
author | Lorry Tar Creator <lorry-tar-importer@lorry> | 2017-06-27 06:07:23 +0000 |
---|---|---|
committer | Lorry Tar Creator <lorry-tar-importer@lorry> | 2017-06-27 06:07:23 +0000 |
commit | 1bf1084f2b10c3b47fd1a588d85d21ed0eb41d0c (patch) | |
tree | 46dcd36c86e7fbc6e5df36deb463b33e9967a6f7 /Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css | |
parent | 32761a6cee1d0dee366b885b7b9c777e67885688 (diff) | |
download | WebKitGtk-tarball-master.tar.gz |
webkitgtk-2.16.5HEADwebkitgtk-2.16.5master
Diffstat (limited to 'Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css')
-rw-r--r-- | Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css | 200 |
1 files changed, 200 insertions, 0 deletions
diff --git a/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css b/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css new file mode 100644 index 000000000..019d9b3dd --- /dev/null +++ b/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css @@ -0,0 +1,200 @@ +/* + * Copyright (C) 2013 Apple Inc. All rights reserved. + * + * Redistribution and use in source and binary forms, with or without + * modification, are permitted provided that the following conditions + * are met: + * 1. Redistributions of source code must retain the above copyright + * notice, this list of conditions and the following disclaimer. + * 2. Redistributions in binary form must reproduce the above copyright + * notice, this list of conditions and the following disclaimer in the + * documentation and/or other materials provided with the distribution. + * + * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS'' + * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, + * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR + * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS + * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR + * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF + * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS + * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN + * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) + * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF + * THE POSSIBILITY OF SUCH DAMAGE. + */ + +.sidebar > .panel.details.css-style > .content { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + + overflow-y: auto; + overflow-x: hidden; +} + +.sidebar > .panel.details.css-style > .content.has-filter-bar { + bottom: calc(var(--navigation-bar-height) - 1px); +} + +.sidebar > .panel.details.css-style > .content > .pseudo-classes { + padding: 6px 10px; + border-bottom: 1px solid var(--border-color); + + display: flex; + flex-flow: row wrap; + justify-content: space-around; +} + +.sidebar > .panel.details.css-style > .content > .pseudo-classes > .group { + display: inline-flex; + flex-flow: row wrap; + justify-content: space-around; + flex: 1; +} + +.sidebar > .panel.details.css-style > .content > .pseudo-classes > .group > label { + color: hsl(0, 0%, 37%); + text-shadow: white 0 1px 0; + + margin: 0 5px; + min-width: 55px; + + display: inline-block; + white-space: nowrap; +} + +.sidebar > .panel.details.css-style > .content ~ :matches(.options-container, .class-list-container) { + display: flex; + align-items: center; + position: absolute; + z-index: 1; + width: 100%; + background-color: white; + border-top: 1px solid var(--border-color); +} + +.sidebar > .panel.details.css-style > .content ~ .options-container { + bottom: 0; + height: var(--console-prompt-min-height); +} + +.sidebar > .panel.details.css-style > .content:not(.supports-new-rule, .has-filter-bar) ~ :matches(.options-container, .class-list-container) { + display: none; +} + +.sidebar > .panel.details.css-style > .content ~ .options-container > .new-rule { + width: 15px; + min-width: 15px; + height: 15px; + margin-left: 6px; + content: url(../Images/Plus15.svg); + opacity: 0.7; +} + +.sidebar > .panel.details.css-style > .content ~ .options-container > .filter-bar { + width: -webkit-fill-available; + background-color: transparent; +} + +.sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle { + margin: 0 5px 1px 0; + padding: 2px 4px 3px; + background: none; + border: none; + border-radius: 3px; + white-space: nowrap; + -webkit-appearance: none; +} + +.sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle.selected { + color: var(--selected-foreground-color); + background-color: var(--selected-background-color); +} + +.sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle:not(.selected):hover { + color: var(--selected-foreground-color); + background-color: var(--selected-background-color-hover); +} + +.sidebar > .panel.details.css-style > .content:not(.supports-new-rule) ~ .options-container > .new-rule, +.sidebar > .panel.details.css-style > .content:not(.has-filter-bar) ~ .options-container > .filter-bar { + display: none; +} + +.sidebar > .panel.details.css-style > .content ~ .class-list-container { + flex-wrap: wrap; + bottom: var(--console-prompt-min-height); + max-height: 75px; + padding: 3px 2px; + overflow-y: scroll; +} + +/* FIXME: <https://webkit.org/b/152674> Elements with the "hidden" attribute still show up if "display: flex;" */ +.sidebar > .panel.details.css-style > .content ~ .class-list-container[hidden] { + display: none; +} + +.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class { + display: flex; + align-items: center; +} + +.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > input[type="checkbox"] { + pointer-events: none; +} + +.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > .add-class-icon { + width: 12px; + height: 12px; +} + +.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > .class-name-input { + width: 100px; + height: 18px; + margin: 0 0 0 2px; +} + +.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class.active > .add-class-icon, +.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class:not(.active) > .class-name-input { + display: none; +} + +.sidebar > .panel.details.css-style > .content ~ .class-list-container > *:matches(.new-class, .class-toggle) { + margin: 1px 3px; +} + +.sidebar > .panel.details.css-style > .content.filter-in-progress .filter-matching { + display: inline; + background-color: hsla(53, 83%, 53%, 0.5); + border-bottom: 1px solid hsl(47, 82%, 60%); + opacity: 1; +} + +.sidebar > .panel.details.css-style > .content.filter-in-progress .style-declaration-section { + margin-bottom: 0; +} + +.sidebar > .panel.details.css-style > .content.filter-in-progress .style-declaration-section.last-in-group.filter-section-non-matching + .style-declaration-section.filter-section-has-label { + margin-top: 0; + border-top: none; +} + +.sidebar > .panel.details.css-style > .content.filter-in-progress .style-declaration-section:not(.filter-section-has-label) { + margin-top: 0; + border-top: none; + border-bottom: 1px solid var(--border-color); +} + +.sidebar > .panel.details.css-style > .content.filter-in-progress .style-declaration-section > .header > .selector > .filter-matching { + color: black; +} + +.sidebar > .panel.details.css-style > .content.filter-in-progress .filter-section-non-matching { + display: none; +} + +.sidebar > .panel.details.css-style > .content.filter-in-progress .filter-property-non-matching { + opacity: 0.5; +} |