padding: 0 2px;
}
-.searchbar-engine-button,
.search-go-container {
padding: 2px;
}
#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button {
-moz-appearance: none;
- -moz-user-focus: ignore;
min-width: 80px;
border-radius: 3px;
padding: 4px 16px;
-moz-image-region: rect(0px 32px 16px 16px);
}
-#bookmarks-menu-button.bookmark-item > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
- -moz-margin-start: 5px;
-}
-
-#bookmarks-menu-button[cui-areatype="toolbar"]:not(.bookmark-item):not([overflowedItem=true]) > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
+#nav-bar #bookmarks-menu-button[cui-areatype="toolbar"]:not([overflowedItem=true]) > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
padding-top: 2px;
padding-bottom: 2px;
}
/* padding-left: 7px; */
}
+/* This changes the direction of the main notification box on the url bar. */
#notification-popup-box:-moz-locale-dir(rtl),
+/* This adds a second flip for the notification anchors, as they don't switch direction
+ for RTL mode. */
.notification-anchor-icon:-moz-locale-dir(rtl) {
transform: scaleX(-1);
}
+/* For the anchor icons in the chat window, we don't have the notification popup box,
+ so we need to cancel the RTL transform. */
+.notification-anchor-icon.chat-toolbarbutton:-moz-locale-dir(rtl) {
+ transform: none;
+}
+
.notification-anchor-icon {
list-style-image: url("chrome://global/skin/icons/information-16.png");
margin: 3px 0 4px;
font-size: 150%;
}
+
.identity-popup-warning-gray {
-moz-padding-start: 24px;
background: url(chrome://browser/skin/controlcenter/warning-gray.svg) no-repeat 0 50%;
--even-animation-timeline-background-color: rgba(160,144,144,0.03);
}
+:root {
+ /* How high should toolbars be */
+ --toolbar-height: 20px;
+ /* How wide should the sidebar be */
+ --timeline-sidebar-width: 150px;
+ /* How high should animations displayed in the timeline be */
+ --timeline-animation-height: 20px;
+}
+
html {
height: 100%;
}
flex-direction: row;
align-items: center;
justify-content: flex-end;
- height: 20px;
+ height: var(--toolbar-height);
}
#toolbar .label {
#toggle-all {
border-width: 0 0 0 1px;
- min-height: 20px;
+ min-height: var(--toolbar-height);
}
/* The main animations container */
#players {
- height: calc(100% - 20px);
+ height: calc(100% - var(--toolbar-height));
overflow: auto;
}
background-repeat: repeat-y;
/* The animations are drawn 150px from the left edge so that animated nodes
can be displayed in a sidebar */
- background-position: 150px 0;
+ background-position: var(--timeline-sidebar-width) 0;
display: flex;
flex-direction: column;
}
+.animation-timeline .scrubber {
+ position: absolute;
+ height: 100%;
+ width: var(--timeline-sidebar-width);
+ border-right: 1px solid #FF0000;
+ box-sizing: border-box;
+ z-index: 1;
+ pointer-events: none;
+}
+
+.animation-timeline .scrubber::before {
+ content: "";
+ position: absolute;
+ top: 0;
+ width: 1px;
+ right: -6px;
+ border-top: 5px solid #FF0000;
+ border-left: 5px solid transparent;
+ border-right: 5px solid transparent;
+}
+
.animation-timeline .time-header {
- margin-left: 150px;
- height: 20px;
+ margin-left: var(--timeline-sidebar-width);
+ height: var(--toolbar-height);
overflow: hidden;
position: relative;
+ /* This is the same color as the time graduations in
+ browser/devtools/animationinspector/utils.js */
border-bottom: 1px solid var(--theme-splitter-color);
+ cursor: col-resize;
+ -moz-user-select: none;
}
.animation-timeline .time-header .time-tick {
.animation-timeline .animation {
margin: 4px 0;
- height: 20px;
+ height: var(--timeline-animation-height);
position: relative;
}
}
.animation-timeline .animation .target {
- width: 150px;
+ width: var(--timeline-sidebar-width);
overflow: hidden;
height: 100%;
}
.animation-timeline .animation .time-block {
position: absolute;
top: 0;
- left: 150px;
+ left: var(--timeline-sidebar-width);
right: 0;
height: 100%;
}
.animation-timeline .animation .iterations {
position: relative;
height: 100%;
- border: 1px solid var(--theme-highlight-lightorange);
box-sizing: border-box;
- background: var(--theme-contrast-background);
- /* Iterations are displayed with a repeating linear-gradient which size is
- dynamically changed from JS */
+ --timelime-border-color: var(--theme-body-color);
+ --timeline-background-color: var(--theme-splitter-color);
+
+ /* Iterations of the animation are displayed with a repeating linear-gradient
+ which size is dynamically changed from JS. The gradient only draws 1px
+ borders between each iteration. These borders must have the same color as
+ the border of this element */
background-image:
linear-gradient(to right,
- var(--theme-highlight-lightorange) 0,
- var(--theme-highlight-lightorange) 1px,
+ var(--timelime-border-color) 0,
+ var(--timelime-border-color) 1px,
transparent 1px,
transparent 2px);
background-repeat: repeat-x;
background-position: -1px 0;
+ border: 1px solid var(--timelime-border-color);
+
+ /* The background color is set independently */
+ background-color: var(--timeline-background-color);
+}
+
+.animation-timeline .animation .cssanimation {
+ --timelime-border-color: var(--theme-highlight-lightorange);
+ --timeline-background-color: var(--theme-contrast-background);
+}
+
+.animation-timeline .animation .csstransition {
+ --timelime-border-color: var(--theme-highlight-bluegrey);
+ --timeline-background-color: var(--theme-highlight-blue);
}
.animation-timeline .animation .iterations.infinite {
top: unset;
}
-.animation-timeline .animation .animation-title {
- height: 1.5em;
+.animation-timeline .animation .name {
+ color: var(--theme-selection-color);
+ height: 100%;
width: 100%;
- box-sizing: border-box;
overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ line-height: 150%;
+ padding: 0 2px;
}
.animation-timeline .animation .delay {
position: absolute;
top: 0;
- height: 100%;
- background-image: linear-gradient(to bottom,
- transparent,
- transparent 9px,
- var(--theme-highlight-lightorange) 9px,
- var(--theme-highlight-lightorange) 11px,
- transparent 11px,
- transparent);
+ /* Make sure the delay covers up the animation border */
+ transform: translate(-1px, -1px);
+ box-sizing: border-box;
+ height: calc(100% + 2px);
+
+ border: 1px solid var(--timelime-border-color);
+ border-width: 1px 0 1px 1px;
+ background-image: repeating-linear-gradient(45deg,
+ transparent,
+ transparent 1px,
+ var(--theme-selection-color) 1px,
+ var(--theme-selection-color) 4px);
+ background-color: var(--timelime-border-color);
+}
+
+.animation-timeline .animation .delay.negative {
+ /* Negative delays are displayed on top of the animation, so they need a
+ right border. Whereas normal delays are displayed just before the
+ animation, so there's already the animation's left border that serves as
+ a separation. */
+ border-width: 1px;
}
.animation-timeline .animation .delay::before {
height: 8px;
top: 50%;
margin-top: -4px;
- background: var(--theme-highlight-lightorange);
-}
-
-.animation-timeline .animation .name {
- position: absolute;
- z-index: 1;
- padding: 2px;
- white-space: nowrap;
+ background: var(--timelime-border-color);
}
/* Animation target node gutter, contains a preview of the dom node */
/* Timeline wiget */
.timeline {
- height: 20px;
+ height: var(--timeline-animation-height);
width: 100%;
display: flex;
flex-direction: row;
/* Colors used in Graphs, like performance tools. Mostly similar to some "highlight-*" colors. */
--theme-graphs-green: #008484;
--theme-graphs-blue: #9C9CFF;
+ --theme-graphs-bluegrey: #C09070;
--theme-graphs-purple: #C09070;
--theme-graphs-yellow: #FFCF00;
--theme-graphs-red: #FF0000;
}
#debugger-controls toolbarbutton[disabled] {
-/* opacity: 0.5; */
+/* opacity: 0.5;
+ transition: none; */
+}
+
+#resume[break-on-next] {
+ background: var(--theme-highlight-lightorange);
}
#step-over {
--- /dev/null
+<!-- 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/. -->
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="#FFCF00">
+ <path d="M6 3h3V2c0-.003-3 0-3 0-.002 0 0 1 0 1zm-5 .5c0-.276.226-.5.494-.5h12.012c.273 0 .494.232.494.5 0 .276-.226.5-.494.5H1.494C1.22 4 1 3.768 1 3.5zM5 3V2c0-.553.444-1 1-1h3c.552 0 1 .443 1 1v1H5z"/>
+ <path d="M5 13h1V7H5v6zm4 0h1V7H9v6zm3-8v8.998c-.046.553-.45 1.002-1 1.002H4c-.55 0-.954-.456-1-1.002V5h9zm-5 8h1V7H7v6z"/>
+</svg>
--- /dev/null
+<!-- 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/. -->
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="#FFCF00">
+ <path d="M13.6 5H11V3.5C11 2.7 10 2 9.2 2H6.8C6 2 5 2.7 5 3.5V5H2.4C1.6 5 1 5.6 1 6.4v6.5c0 .8.6 1.1 1.4 1.1h11.2c.8 0 1.4-.3 1.4-1.1V6.4c0-.8-.6-1.4-1.4-1.4zm.4 8H2V6h4V3h4v3h3.9l.1 7z"/>
+ <path d="M8 6.8c-1.3 0-2.4 1.1-2.4 2.4s1.1 2.4 2.4 2.4 2.4-1.1 2.4-2.4c0-1.3-1.1-2.4-2.4-2.4zm0 3.5c-.7 0-1.2-.5-1.2-1.1S7.3 8.1 8 8.1s1.2.5 1.2 1.1-.5 1.1-1.2 1.1z"/>
+</svg>
--- /dev/null
+<!-- 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/. -->
+<svg height="16" width="16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="#FFCF00">
+ <path d="M10.2 4.1c-.6 0-1.2.2-1.8.4-.6-.4-1.4-.6-2.2-.6-2.5 0-4.6 2.1-4.6 4.6s2.1 4.6 4.6 4.6c.9 0 1.6-.2 2.3-.7.5.2 1.1.4 1.7.4 2.4 0 4.3-1.9 4.3-4.3.1-2.4-1.9-4.4-4.3-4.4zm-4 7.9c-1.9 0-3.5-1.6-3.5-3.5S4.2 5 6.2 5c.3 0 .7 0 1 .1-.8.9-1.4 2.1-1.4 3.4 0 1.3.6 2.5 1.5 3.3-.4.1-.8.2-1.1.2zm2.1-.7c-.9-.6-1.4-1.6-1.4-2.8 0-1.1.6-2.1 1.4-2.8.8.6 1.4 1.6 1.4 2.8 0 1.1-.6 2.1-1.4 2.8z"/>
+ <path d="M7.6 8c-.2 0-.3-.1-.4-.2-.1-.2 0-.4.2-.5l1.1-.6c.2-.1.4 0 .5.2.1.2 0 .4-.2.5l-1.1.5c0 .1-.1.1-.1.1zM7.6 9.1c-.1 0-.3-.1-.4-.2-.1-.2 0-.4.2-.5l1.1-.6c.3-.1.5 0 .6.2.1.2 0 .4-.2.5l-1.1.6h-.2zM7.8 10.3c-.1 0-.3-.1-.4-.2-.1-.2 0-.4.2-.5L8.8 9c.2-.1.4 0 .5.2.1.2 0 .4-.2.5l-1.1.6h-.2z"/>
+</svg>
--- /dev/null
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- 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/. -->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="72" height="60" viewBox="0 0 72 60">
+ <defs>
+ <rect id="glyphShape-colorSwatch" width="8" height="8" ry="2" rx="2"/>
+ <rect id="glyphShape-colorSwatch-border" width="10" height="10" ry="2" rx="2"/>
+ <polygon id="glyphShape-errorX" points="9.9,8.5 8.5,9.9 6,7.4 3.6,9.8 2.2,8.4 4.6,6 2.2,3.6 3.6,2.2 6,4.6 8.4,2.2 9.8,3.6 7.4,6"/>
+ <path id="glyphShape-warningTriangle" d="M9.9,8.6l-3.1-6C6.6,2.2,6.3,2,6,2C5.7,2,5.4,2.2,5.2,2.5l-3.1,6C2,8.9,2,9.3,2.1,9.6C2.3,9.8,2.6,10,2.9,10 h6.1c0.4,0,0.6-0.2,0.8-0.4C10,9.3,10,8.9,9.9,8.6z"/>
+ <path id="glyphShape-exclamationPoint" d="M6,7.7c-0.6,0-1,0.4-1,0.8C5,9,5.4,9.3,6,9.3c0.6,0,1-0.4,1-0.8 C7,8.1,6.6,7.7,6,7.7z M6,7c0.6,0,1-0.4,1-1V5c0-0.6-0.4-1-1-1S5,4.4,5,5v1C5,6.6,5.4,7,6,7z"/>
+ <circle id="glyphShape-infoCircle" cx="6" cy="6" r="4"/>
+ <path id="glyphShape-infoGlyph" d="M6,6C5.4,6,5,6.4,5,7v1c0,0.6,0.4,1,1,1s1-0.4,1-1V7C7,6.4,6.6,6,6,6z M6,5c0.6,0,1-0.4,1-1S6.6,3,6,3S5,3.4,5,4S5.4,5,6,5z"/>
+ <style>
+ .icon-colorSwatch-border {
+ fill: #fff;
+ fill-opacity: .7;
+ }
+ .icon-colorSwatch-network {
+ fill: #FFCF00;
+ }
+ .icon-colorSwatch-css {
+ fill: #9C9CFF;
+ }
+ .icon-colorSwatch-js {
+ fill: #FF9F00;
+ }
+ .icon-colorSwatch-logging {
+ fill: #A09090;
+ }
+ .icon-colorSwatch-security {
+ fill: #FF0000;
+ }
+ .icon-glyphOverlay {
+ fill: #fff;
+ }
+
+ #icon-indicator-input {
+ fill: #A09090;
+ }
+ #icon-indicator-output {
+ fill: #A09090;
+ }
+ #light-icons:target #icon-indicator-input {
+ fill: #A09090;
+ }
+ #light-icons:target #icon-indicator-output {
+ fill: #A09090;
+ }
+ </style>
+ </defs>
+ <g id="icon-colorSwatch-network">
+ <use xlink:href="#glyphShape-colorSwatch-border" class="icon-colorSwatch-border" x="1" y="1"/>
+ <use xlink:href="#glyphShape-colorSwatch" class="icon-colorSwatch-network" x="2" y="2"/>
+ </g>
+ <g id="icon-colorSwatch-css" transform="translate(0 12)">
+ <use xlink:href="#glyphShape-colorSwatch-border" class="icon-colorSwatch-border" x="1" y="1"/>
+ <use xlink:href="#glyphShape-colorSwatch" class="icon-colorSwatch-css" x="2" y="2"/>
+ </g>
+ <g id="icon-colorSwatch-js" transform="translate(0 24)">
+ <use xlink:href="#glyphShape-colorSwatch-border" class="icon-colorSwatch-border" x="1" y="1"/>
+ <use xlink:href="#glyphShape-colorSwatch" class="icon-colorSwatch-js" x="2" y="2"/>
+ </g>
+ <g id="icon-colorSwatch-logging" transform="translate(0 36)">
+ <use xlink:href="#glyphShape-colorSwatch-border" class="icon-colorSwatch-border" x="1" y="1"/>
+ <use xlink:href="#glyphShape-colorSwatch" class="icon-colorSwatch-logging" x="2" y="2"/>
+ </g>
+ <g id="icon-colorSwatch-security" transform="translate(0 48)">
+ <use xlink:href="#glyphShape-colorSwatch-border" class="icon-colorSwatch-border" x="1" y="1"/>
+ <use xlink:href="#glyphShape-colorSwatch" class="icon-colorSwatch-security" x="2" y="2"/>
+ </g>
+ <use xlink:href="#glyphShape-errorX" id="icon-errorX-network" class="icon-colorSwatch-network" transform="translate(12)"/>
+ <use xlink:href="#glyphShape-errorX" id="icon-errorX-css" class="icon-colorSwatch-css" transform="translate(12 12)"/>
+ <use xlink:href="#glyphShape-errorX" id="icon-errorX-js" class="icon-colorSwatch-js" transform="translate(12 24)"/>
+ <use xlink:href="#glyphShape-errorX" id="icon-errorX-logging" class="icon-colorSwatch-logging" transform="translate(12 36)"/>
+ <use xlink:href="#glyphShape-errorX" id="icon-errorX-security" class="icon-colorSwatch-security" transform="translate(12 48)"/>
+ <g id="icon-warningTriangle-css" transform="translate(24 12)">
+ <use xlink:href="#glyphShape-warningTriangle" class="icon-colorSwatch-css"/>
+ <use xlink:href="#glyphShape-exclamationPoint" class="icon-glyphOverlay"/>
+ </g>
+ <g id="icon-warningTriangle-js" transform="translate(24 24)">
+ <use xlink:href="#glyphShape-warningTriangle" class="icon-colorSwatch-js"/>
+ <use xlink:href="#glyphShape-exclamationPoint" class="icon-glyphOverlay"/>
+ </g>
+ <g id="icon-warningTriangle-logging" transform="translate(24 36)">
+ <use xlink:href="#glyphShape-warningTriangle" class="icon-colorSwatch-logging"/>
+ <use xlink:href="#glyphShape-exclamationPoint" class="icon-glyphOverlay"/>
+ </g>
+ <g id="icon-warningTriangle-security" transform="translate(24 48)">
+ <use xlink:href="#glyphShape-warningTriangle" class="icon-colorSwatch-security"/>
+ <use xlink:href="#glyphShape-exclamationPoint" class="icon-glyphOverlay"/>
+ </g>
+ <g id="icon-infoCircle-logging" transform="translate(36 36)">
+ <use xlink:href="#glyphShape-infoCircle" class="icon-colorSwatch-logging"/>
+ <use xlink:href="#glyphShape-infoGlyph" class="icon-glyphOverlay"/>
+ </g>
+ <g id="light-icons">
+ <path id="icon-indicator-input" d="M6.5,1.2L5.4,2.3L9,6L5.3,9.7l1.1,1.1L11,6L6.5,1.2z M1.5,1.2 L0.4,2.3L4,6L0.3,9.7l1.1,1.1L6,6L1.5,1.2z" transform="translate(48 36)"/>
+ <polygon id="icon-indicator-output" points="10,5 4.3,5 6.8,2.4 5.5,1.2 1,6 5.5,10.8 6.9,9.6 4.3,7 10,7" transform="translate(60 36)"/>
+ </g>
+</svg>
\ No newline at end of file
border: 1px solid #9C9CFF;
}
+/* Draw a circle next to nodes that have a pseudo class lock.
+ Center vertically with the 1.4em line height on .tag-line */
+.child.pseudoclass-locked::before {
+ content: "";
+ background: var(--theme-highlight-lightorange);
+ border-radius: 50%;
+ width: .8em;
+ height: .8em;
+ margin-top: .3em;
+ left: 1px;
+ position: absolute;
+}
/* Selected nodes in the tree should have light selected text.
theme-selected doesn't work in this case since the text is a
--- /dev/null
+/* 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/. */
+
+/* CSS Variables specific to this panel that aren't defined by the themes */
+.theme-dark,
+.theme-light {
+ --cell-border-color: #9C9CFF;
+ --cell-border-color-light: #A09090;
+ --focus-cell-border-color: #9C9CFF;
+ --row-alt-background-color: #402000;
+ --row-hover-background-color: #603000;
+}
+
+html, body, #app, #memory-tool {
+ height: 100%;
+}
+
+#memory-tool {
+ /**
+ * Flex: contains two children: .devtools-toolbar and #memory-tool-container,
+ * which need to be laid out vertically. The toolbar has a fixed height and
+ * the container needs to flex to fill out all remaining vertical space.
+ */
+ display: flex;
+ flex-direction: column;
+ --sidebar-width: 185px;
+ /**
+ * If --heap-tree-row-height changes, be sure to change HEAP_TREE_ROW_HEIGHT
+ * in `devtools/client/memory/components/heap.js`.
+ */
+ --heap-tree-row-height: 14px;
+ --heap-tree-header-height: 17px;
+}
+
+/**
+ * Toolbar
+ */
+
+.devtools-toolbar {
+ /**
+ * Flex: contains several children, which need to be laid out horizontally,
+ * and aligned vertically in the middle of the container.
+ */
+ display: flex;
+ align-items: center;
+}
+
+.devtools-toolbar > .toolbar-group:nth-of-type(1) {
+ /**
+ * We want this to be exactly at a `--sidebar-width` distance from the
+ * toolbar's start boundary. A `.devtools-toolbar` has a 3px start padding.
+ */
+ flex: 0 0 calc(var(--sidebar-width) - 4px);
+ border-inline-end: 1px solid var(--theme-splitter-color);
+ margin-inline-end: 5px;
+ padding-right: 1px;
+}
+
+.devtools-toolbar > .toolbar-group {
+ /**
+ * Flex: contains several children, which need to be laid out horizontally,
+ * and aligned vertically in the middle of the container.
+ */
+ display: flex;
+ align-items: center;
+ flex: 1;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.devtools-toolbar > .toolbar-group > label {
+ /**
+ * Flex: contains form controls and text, which need to be laid out
+ * horizontally, vertically aligned in the middle of the container.
+ */
+ display: flex;
+ align-items: center;
+ margin-inline-end: 5px;
+}
+
+.devtools-toolbar > .toolbar-group > label.display-by > span {
+ margin-inline-end: 5px;
+}
+
+.devtools-toolbar > .toolbar-group > label.label-by > span {
+ margin-inline-end: 5px;
+}
+
+.devtools-toolbar > label {
+ margin-inline-end: 5px;
+}
+
+#select-view {
+ margin-inline-start: 5px;
+}
+
+#take-snapshot::before {
+ background-image: url(images/command-screenshot.svg);
+}
+
+#clear-snapshots::before {
+ background-image: url(chrome://devtools/skin/images/clear.svg);
+}
+
+#diff-snapshots::before {
+ background-image: url(chrome://devtools/skin/images/diff.svg);
+}
+
+/**
+ * Due to toolbar styles of `.devtools-toolbarbutton:not([label])` which overrides
+ * .devtools-toolbarbutton's min-width of 78px, reset the min-width.
+ */
+#import-snapshot,
+#clear-snapshots {
+ -moz-box-align: center;
+ flex-grow: 1;
+ padding: 1px;
+ margin: 2px 1px;
+ min-width: unset;
+}
+
+.spacer {
+ flex: 1;
+}
+
+#filter {
+ align-self: stretch;
+ margin: 2px;
+}
+
+/**
+ * Container (sidebar + main panel)
+ */
+
+#memory-tool-container {
+ /**
+ * Flex: contains two children: .list (sidebar) and #heap-view (main panel),
+ * which need to be laid out horizontally. The sidebar has a fixed width and
+ * the main panel needs to flex to fill out all remaining horizontal space.
+ */
+ display: flex;
+ /**
+ * Flexing to fill out remaining vertical space. The preceeding sibling is
+ * the toolbar. @see #memory-tool.
+ */
+ flex: 1;
+ overflow: hidden;
+}
+
+/**
+ * Sidebar
+ */
+
+.list {
+ width: var(--sidebar-width);
+ min-width: var(--sidebar-width);
+ overflow-y: auto;
+ margin: 0;
+ padding: 0;
+ background-color: var(--theme-sidebar-background);
+ border-inline-end: 1px solid var(--theme-splitter-color);
+}
+
+.snapshot-list-item {
+ /**
+ * Flex: contains several children, which need to be laid out vertically.
+ */
+ display: flex;
+ flex-direction: column;
+ color: var(--theme-body-color);
+ border-bottom: 1px solid #A09090;
+ padding: 8px;
+ cursor: default;
+}
+
+.snapshot-list-item.selected {
+ background-color: var(--theme-selection-background);
+ color: var(--theme-selection-color);
+}
+
+.snapshot-list-item.selected ::-moz-selection {
+ background-color: var(--theme-selection-color);
+ color: var(--theme-selection-background);
+}
+
+.snapshot-list-item .snapshot-info {
+ display: flex;
+ justify-content: space-between;
+ font-size: 90%;
+}
+
+.snapshot-list-item .save {
+ text-decoration: underline;
+ cursor: pointer;
+}
+
+.snapshot-list-item > .snapshot-title {
+ margin-bottom: 14px;
+}
+
+.snapshot-list-item > .snapshot-title > input[type=checkbox] {
+ margin: 0;
+ margin-inline-end: 5px;
+}
+
+.snapshot-list-item > .snapshot-state,
+.snapshot-list-item > .snapshot-totals {
+ font-size: 90%;
+ color: var(--theme-body-color-alt);
+}
+
+.snapshot-list-item.selected > .snapshot-state,
+.snapshot-list-item.selected > .snapshot-totals {
+ /* Text inside a selected item should not be custom colored. */
+ color: inherit !important;
+}
+
+/**
+ * Main panel
+ */
+
+.vbox {
+ display: flex;
+ flex-direction: column;
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ padding: 0;
+ margin: 0;
+}
+
+.vbox > * {
+ flex: 1;
+
+ /**
+ * By default, flex items have min-width: auto;
+ * (https://drafts.csswg.org/css-flexbox/#min-size-auto)
+ */
+ min-width: 0;
+}
+
+#heap-view {
+ /**
+ * Flex: contains a .heap-view-panel which needs to fill out all the
+ * available space, horizontally and vertically.
+ */;
+ display: flex;
+ /**
+ * Flexing to fill out remaining horizontal space. The preceeding sibling
+ * is the sidebar. @see #memory-tool-container.
+ */
+ flex: 1;
+ background-color: var(--theme-body-background);
+
+ /**
+ * By default, flex items have min-width: auto;
+ * (https://drafts.csswg.org/css-flexbox/#min-size-auto)
+ */
+ min-width: 0;
+ font-size: 90%;
+}
+
+#heap-view > .heap-view-panel {
+ /**
+ * Flex: can contain several children, including a tree with a header and
+ * multiple rows, all of which need to be laid out vertically. When the
+ * tree is visible, the header has a fixed height and tree body needs to flex
+ * to fill out all remaining vertical space.
+ */
+ display: flex;
+ flex-direction: column;
+ /**
+ * Flexing to fill out remaining horizontal space. @see #heap-view.
+ */
+ flex: 1;
+
+ /**
+ * By default, flex items have min-width: auto;
+ * (https://drafts.csswg.org/css-flexbox/#min-size-auto)
+ */
+ min-width: 0;
+}
+
+#heap-view > .heap-view-panel > .snapshot-status,
+#heap-view > .heap-view-panel > .take-snapshot,
+#heap-view .empty,
+#shortest-paths-select-node-msg {
+ margin: auto;
+ margin-top: 65px;
+ font-size: 120%;
+}
+
+#heap-view > .heap-view-panel > .take-snapshot {
+ padding: 5px;
+}
+
+#heap-view > .heap-view-panel[data-state="snapshot-state-error"] pre {
+ background-color: var(--theme-body-background);
+ margin: 20px;
+ padding: 20px;
+}
+
+/**
+ * Heap tree view header
+ */
+
+.header {
+ /**
+ * Flex: contains several span columns, all of which need to be laid out
+ * horizontally. All columns except the last one have percentage widths, and
+ * the last one needs to flex to fill out all remaining horizontal space.
+ */
+ display: flex;
+ color: var(--theme-body-color);
+ background-color: var(--theme-tab-toolbar-background);
+ border-bottom: 1px solid var(--cell-border-color);
+ flex: 0;
+}
+
+.header > span,
+#shortest-paths-header {
+ text-overflow: ellipsis;
+ line-height: var(--heap-tree-header-height);
+ justify-content: center;
+ justify-self: center;
+ white-space: nowrap;
+}
+
+.header > span {
+ overflow: hidden;
+}
+
+.header > .heap-tree-item-name {
+ justify-content: flex-start;
+}
+
+#shortest-paths {
+ background-color: var(--theme-body-background);
+ overflow: hidden;
+ height: 100%;
+ width: 100%;
+}
+
+#shortest-paths-select-node-msg {
+ justify-self: center;
+}
+
+/**
+ * Heap tree view body
+ */
+
+.tree {
+ /**
+ * Flexing to fill out remaining vertical space. @see .heap-view-panel
+ */
+ flex: 1;
+ overflow-y: auto;
+ background-color: var(--theme-body-background);
+}
+
+.tree-node {
+ height: var(--heap-tree-row-height);
+ line-height: var(--heap-tree-row-height);
+ cursor: default;
+}
+
+.children-pointer {
+ padding-inline-end: 5px;
+}
+
+/**
+ * Heap tree view columns
+ */
+
+.heap-tree-item {
+ /**
+ * Flex: contains several span columns, all of which need to be laid out
+ * horizontally. All columns except the last one have percentage widths, and
+ * the last one needs to flex to fill out all remaining horizontal space.
+ */
+ display: flex;
+}
+
+.tree-node-odd {
+ background-color: var(--row-alt-background-color);
+}
+
+.tree-node:hover {
+ background-color: var(--row-hover-background-color);
+}
+
+.heap-tree-item.focused {
+ background-color: var(--theme-selection-background);
+ color: var(--theme-selection-color);
+}
+
+.heap-tree-item.focused ::-moz-selection {
+ background-color: var(--theme-selection-color);
+ color: var(--theme-selection-background);
+}
+
+.heap-tree-item-bytes,
+.heap-tree-item-count,
+.heap-tree-item-total-bytes,
+.heap-tree-item-total-count {
+ /**
+ * Flex: contains several subcolumns, which need to be laid out horizontally.
+ * These subcolumns may have specific widths or need to flex.
+ */
+ display: flex;
+ text-align: end;
+ border-inline-end: var(--cell-border-color) 1px solid;
+}
+
+.heap-tree-item-count,
+.heap-tree-item-total-count,
+.heap-tree-item-bytes,
+.heap-tree-item-total-bytes {
+ width: 10%;
+ /*
+ * Provision for up to 19 characters:
+ *
+ * GG_MMM_KKK_BBB_100%
+ * | ||| |
+ * '------------'|'--'
+ * 14 ch for 10s | 4 ch for the largest % we will
+ * of GB and | normally see: "100%"
+ * spaces every |
+ * 3 digits |
+ * |
+ * A space between the number and percent
+ */
+ min-width: 19ch;
+}
+
+.heap-tree-item-name {
+ /**
+ * Flex: contains an .arrow and some text, which need to be laid out
+ * horizontally, vertically aligned in the middle of the container.
+ */
+ display: flex;
+ align-items: center;
+ /**
+ * Flexing to fill out remaining vertical space.
+ * @see .header and .heap-tree-item */
+ flex: 1;
+ padding-inline-start: 5px;
+}
+
+/**
+ * Heap tree view subcolumns
+ */
+
+.heap-tree-number,
+.heap-tree-percent,
+.heap-tree-item-name {
+ white-space: nowrap;
+}
+
+.heap-tree-number {
+ padding-inline-start: 3px;
+}
+
+.heap-tree-percent {
+ padding-inline-start: 3px;
+ padding-inline-end: 3px;
+}
+
+.heap-tree-number,
+.heap-tree-percent {
+ font-family: var(--monospace-font-family);
+}
+
+.heap-tree-number {
+ flex: 1;
+ color: var(--theme-content-color3);
+}
+
+.heap-tree-percent {
+ width: 4ch;
+}
+
+.heap-tree-item.focused .heap-tree-number,
+.heap-tree-item.focused .heap-tree-percent {
+ color: inherit;
+}
+
+/**
+ * Heap tree errors.
+ */
+
+.error::before {
+ content: "";
+ display: inline-block;
+ width: 12px;
+ height: 12px;
+ max-height: 12px;
+ background-image: url(chrome://devtools/skin/images/webconsole.svg);
+ background-size: 72px 60px;
+ background-position: -24px -24px;
+ background-repeat: no-repeat;
+ margin: 0px;
+ margin-top: 2px;
+ margin-inline-end: 5px;
+}
+
+.theme-light .error::before {
+ background-image: url(chrome://devtools/skin/images/webconsole.svg#light-icons);
+}
+
+/**
+ * Frame View components
+ */
+
+.separator,
+.not-available,
+.heap-tree-item-address {
+ opacity: .5;
+ margin-left: .5em;
+ margin-right: .5em;
+}
+
+.no-allocation-stacks {
+ border-color: var(--theme-splitter-color);
+ border-style: solid;
+ border-width: 0px 0px 1px 0px;
+ text-align: center;
+ padding: 5px;
+}
+
+/**
+ * Dagre-D3 graphs
+ */
+
+.edgePath path {
+ stroke-width: 1px;
+ fill: none;
+}
+
+.theme-dark .edgePath path {
+ stroke: var(--theme-body-color-alt);
+}
+.theme-light .edgePath path {
+ stroke: var(--theme-splitter-color);
+}
+
+g.edgeLabel rect {
+ fill: var(--theme-body-background);
+}
+g.edgeLabel tspan {
+ fill: var(--theme-body-color-alt);
+}
+
+.nodes rect {
+ stroke-width: 1px;
+}
+
+.nodes rect {
+ stroke: var(--theme-tab-toolbar-background);
+}
+.theme-light rect {
+ fill: var(--theme-tab-toolbar-background);
+}
+.theme-dark rect {
+ fill: var(--theme-toolbar-background);
+}
+
+text {
+ font-weight: 300;
+ font-family: "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
+ font-size: 14px;
+}
+
+text {
+ fill: var(--theme-body-color-alt);
+}
width: 16px;
height: 16px;
-moz-margin-end: 4px;
+ cursor: pointer;
}
.security-state-insecure {
- list-style-image: url("chrome://browser/skin/identity-not-secure.svg");
+ list-style-image: url("chrome://browser/skin/identity-mixed-active-loaded.svg");
}
.security-state-secure {
- cursor: pointer;
list-style-image: url("chrome://browser/skin/identity-secure.svg");
}
.security-state-weak {
- cursor: pointer;
list-style-image: url("chrome://browser/skin/identity-mixed-passive-loaded.svg");
}
.security-state-broken {
- cursor: pointer;
- list-style-image: url("chrome://browser/skin/identity-mixed-active-loaded.svg");
+ list-style-image: url("chrome://browser/skin/controlcenter/warning-gray.svg");
+}
+
+.security-state-local {
+ list-style-image: url("chrome://browser/skin/identity-not-secure.svg");
}
.requests-menu-type {
}
box.requests-menu-status:not([code]) {
- background-color: var(--theme-content-color2);
+ background-color: var(--theme-highlight-red);
+ border-radius: 0; /* squares */
}
box.requests-menu-status[code="cached"] {
--row-hover-background-color: #544400;
}
+/**
+ * A generic class to hide elements, replacing the `element.hidden` attribute
+ * that we use to hide elements that can later be active
+ */
+.hidden {
+ display: none;
+ width: 0px;
+ height: 0px;
+}
+
/* Toolbar */
#performance-toolbar-control-other {
.call-tree-header[type="count"],
.call-tree-cell[type="count"],
.call-tree-header[type="self-count"],
-.call-tree-cell[type="self-count"] {
- width: 9vw;
+.call-tree-cell[type="self-count"],
+.call-tree-header[type="size"],
+.call-tree-cell[type="size"],
+.call-tree-header[type="self-size"],
+.call-tree-cell[type="self-size"],
+.call-tree-header[type="count-percentage"],
+.call-tree-cell[type="count-percentage"],
+.call-tree-header[type="self-count-percentage"],
+.call-tree-cell[type="self-count-percentage"],
+.call-tree-header[type="size-percentage"],
+.call-tree-cell[type="size-percentage"],
+.call-tree-header[type="self-size-percentage"],
+.call-tree-cell[type="self-size-percentage"] {
+ width: 6vw;
}
.call-tree-header[type="function"],
font-weight: bold;
}
+.marker-details-customcontainer .custom-button {
+ padding: 2px 5px;
+ border-width: 1px;
+}
+
/**
* Marker colors
*/
-menuitem.marker-color-graphs-purple:before,
-.marker-color-graphs-purple {
- background-color: var(--theme-graphs-purple);
+menuitem.marker-color-graphs-green:before,
+.marker-color-graphs-green {
+ background-color: var(--theme-graphs-green);
}
-menuitem.marker-color-graphs-grey:before,
-.marker-color-graphs-grey{
- background-color: var(--theme-graphs-grey);
+menuitem.marker-color-graphs-blue:before,
+.marker-color-graphs-blue {
+ background-color: var(--theme-graphs-blue);
}
-menuitem.marker-color-graphs-green:before,
-.marker-color-graphs-green {
- background-color: var(--theme-graphs-green);
+menuitem.marker-color-graphs-bluegrey:before,
+.marker-color-graphs-bluegrey {
+ background-color: var(--theme-graphs-bluegrey);
+}
+
+menuitem.marker-color-graphs-purple:before,
+.marker-color-graphs-purple {
+ background-color: var(--theme-graphs-purple);
}
menuitem.marker-color-graphs-yellow:before,
background-color: var(--theme-graphs-red);
}
-menuitem.marker-color-graphs-blue:before,
-.marker-color-graphs-blue {
- background-color: var(--theme-graphs-blue);
+menuitem.marker-color-graphs-grey:before,
+.marker-color-graphs-grey{
+ background-color: var(--theme-graphs-grey);
}
/* Profile call tree */
.opt-icon[severity=warning]::before {
background-position: -24px -24px;
}
-.opt-icon[type=linkable]::before {
- cursor: pointer;
-}
-
ul.frames-list {
list-style-type: none;
.theme-light {
--rule-highlight-background-color: #402800;
+ --rule-filter-icon: url("magnifying-glass.png");
}
.ruleview {
background: url("alerticon-warning.png");
-moz-margin-start: 5px;
display: inline-block;
- vertical-align: top;
width: 13px;
height: 12px;
}
}
}
+.ruleview-overridden-rule-filter {
+ background-image: var(--rule-filter-icon);
+ background-size: 11px 11px;
+ -moz-margin-start: 5px;
+ display: inline-block;
+ width: 11px;
+ height: 11px;
+}
+
.ruleview-ruleopen {
-moz-padding-end: 5px;
}
*/
/*
#ruleview-add-rule-button,
-#pseudo-class-panel-toggle {
+#pseudo-class-panel-toggle,
+.ruleview-overridden-rule-filter {
opacity: 0.8;
}
#ruleview-add-rule-button:not([disabled]):hover,
#pseudo-class-panel-toggle:hover,
-#pseudo-class-panel-toggle[checked] {
+#pseudo-class-panel-toggle[checked],
+.ruleview-overridden-rule-filter:hover {
opacity: 1;
}
}
.message[category=console][severity=error] > .icon::before,
-.message[category=output][severity=error] > .icon::before {
+.message[category=output][severity=error] > .icon::before,
+.message[category=server][severity=error] > .icon::before {
background-position: -12px -36px;
}
-.message[category=console][severity=warn] > .icon::before {
+.message[category=console][severity=warn] > .icon::before,
+.message[category=server][severity=warn] > .icon::before {
background-position: -24px -36px;
}
-.message[category=console][severity=info] > .icon::before {
+.message[category=console][severity=info] > .icon::before,
+.message[category=server][severity=info] > .icon::before {
background-position: -36px -36px;
}
+/* Server Logging Styles */
+
+.webconsole-filter-button[category="server"] > .toolbarbutton-menubutton-button:before {
+ background-image: linear-gradient(#006363, #004242);
+ border-color: #008484;
+}
+
+.message[category=server] > .indent {
+ -moz-border-end: solid #8050B0 6px;
+}
+
/* Input and output styles */
.message[category=input] > .indent,
.message[category=output] > .indent {
+++ /dev/null
-/* 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/. */
-
-body {
- font-family: "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
- font-size: 11px;
- background: #000000;
- color: #FF9F00;
-}
-
-#header {
- padding: 5px;
- overflow-x:auto;
- display: block;
-}
-
-h1 {
- font-size: 13px;
- line-height: 15px;
- padding: 3px 10px;
- vertical-align: bottom;
- margin: 0px;
- border-bottom: 1px solid #9C9CFF;
-}
-
-h1 .info {
- font-size: 11px;
- line-height: 15px;
- vertical-align: bottom;
- float: right;
- color: #9C9CFF;
- padding-right: 3px;
- display: block;
-}
-
-.property-table {
- padding: 2px 5px;
- color: #9C9CFF;
- width: 100%;
- max-height: 330px;
- overflow: auto;
-}
-
-.property-table-header {
- font-size: 11px;
- font-weight: bold;
- padding-right: 4px;
- color: #FF9F00;
- white-space: nowrap;
- text-align: end;
- vertical-align: top;
- width: 10%;
-}
-
-.property-table-value {
- padding-right: 5px;
- font-size: 11px;
- word-wrap: break-word;
- width: 90%;
-}
-
-div.group {
- margin-top: 10px;
-}
-
-div.group,
-#header {
- background: #000000;
- border-color: #9C9CFF;
- border-style: solid;
- border-width: 1px;
- border-radius: 4px 4px 4px 4px;
-}
-
-img#responseImageNode {
- max-width: 100%;
-}
-
-#responseImageNodeDiv {
- padding: 5px;
-}
-
-#responseBodyFetchLink, #requestBodyFetchLink {
- padding: 5px;
- margin: 0;
- cursor: pointer;
- font-weight: bold;
- font-size: 1.1em;
- text-decoration: underline;
-}
-
-.longStringEllipsis {
- margin-left: 0.6em;
-}
+++ /dev/null
-/* 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/. */
-
-#engineList treechildren::-moz-tree-image(engineName) {
- -moz-margin-end: 4px;
- -moz-margin-start: 1px;
- width: 16px;
- height: 16px;
-}
-
-#engineList treechildren::-moz-tree-row {
- height: 20px;
-}
margin: 0 0 20px;
}
+#syncStatusMessageDescription {
+ font-size: 14px;
+ line-height: 158%;
+ margin: 0 !important;
+}
+
+#syncStatusMessageClose {
+ margin: 0px;
+}
+
+#syncStatusMessage {
+ visibility: collapse;
+ opacity: 0;
+ transition: opacity 1s linear;
+ padding: 14px 8px 14px 14px;
+ border-radius: 2px;
+}
+
+#syncStatusMessage[message-type] {
+ visibility: visible;
+ opacity: 1;
+}
+
+#syncStatusMessage[message-type="verify-success"] {
+ background-color: #008484;
+}
+
+#syncStatusMessage[message-type="verify-error"] {
+ background-color: #FF0000;
+}
+
+#syncStatusMessage[message-type="migration"] {
+ background-color: #FFCF00;
+}
+
+#sync-migration-buttons-deck {
+ visibility: collapse;
+}
+
+#learnMoreLink {
+ margin: 0;
+ color: #336699;
+ text-decoration: underline;
+}
+
+#syncStatusMessage[message-type="migration"] #sync-migration-buttons-deck {
+ visibility: visible;
+}
+
+#sync-migration-buttons-deck {
+ margin-top: 20px;
+}
+
+#sync-migration-buttons-deck button {
+ margin: 0 10px 0 0;
+ border: 0;
+ border-radius: 2px;
+}
+
+#sync-migrate-upgrade,
+#sync-migrate-resend {
+/* background-color: #0095DD;
+ color: #FBFBFB; */
+}
+
+#sync-migrate-upgrade:hover,
+#sync-migrate-resend:hover {
+/* background-color: #008ACB; */
+}
+
+#sync-migrate-upgrade:hover:active,
+#sync-migrate-resend:hover:active {
+/* background-color: #006B9D; */
+}
+
+#syncStatusMessageWrapper {
+ -moz-box-flex: 1;
+ padding-right: 5px;
+}
+
+#syncStatusMessageTitle, #syncStatusMessageDescription {
+ color: #A09090;
+}
+
+#syncStatusMessage[message-type="migration"] #syncStatusMessageTitle {
+ display: none;
+}
+
+#syncStatusMessageTitle {
+ font-weight: bold !important;
+ font-size: 16px;
+ line-height: 157%;
+ margin: 0 0 20px;
+}
+
+
#syncStatusMessageDescription {
font-size: 14px;
line-height: 158%;
-moz-margin-start: -25px;
}
-.searchbar-dropmarker-image {
- --searchbar-dropmarker-url: url("chrome://global/skin/arrow/arrow-down.gif");
- --searchbar-dropmarker-hover-url: url("chrome://global/skin/arrow/arrow-down-hover.gif");
-}
-
.autocomplete-textbox-container {
-moz-box-align: stretch;
}
height: 16px;
width: 16px;
list-style-image: url("chrome://global/skin/filepicker/file.gif");
+ -moz-margin-start: -1px;
}
-.searchbar-engine-button {
- min-width: 0;
- margin: 0;
- padding: 0;
- -moz-padding-end: 2px;
- -moz-box-align: center;
- background: none;
- border: none;
- border-radius: 3px 0px 0px 3px;
-}
-
-.searchbar-engine-button:-moz-locale-dir(rtl) {
- border-radius: 0px 3px 3px 0px;
-}
-
-.searchbar-engine-button:hover {
- background-color: #FFCF00;
-}
-
-.searchbar-engine-button[open="true"] {
- background-color: #FF9F00;
-}
-
-.searchbar-engine-button > .button-box {
- padding: 0;
- border: 0;
-}
-
-.searchbar-dropmarker-image {
- list-style-image: var(--searchbar-dropmarker-url);
-}
-
-.searchbar-engine-button:hover > .searchbar-dropmarker-image,
-.searchbar-engine-button[open="true"] > .searchbar-dropmarker-image {
- list-style-image: var(--searchbar-dropmarker-hover-url);
-}
-
-
/* ::::: search-go-button ::::: */
.search-go-container {
.search-go-button {
padding: 1px;
- list-style-image: url("chrome://global/skin/icons/search.png");
- -moz-image-region: rect(0, 16px, 16px, 0);
+ list-style-image: url("chrome://browser/skin/reload-stop-go.png");
+ -moz-image-region: rect(0, 42px, 14px, 28px);
+ width: 14px;
}
-.search-go-button:-moz-locale-dir(rtl) {
+.search-go-button:-moz-locale-dir(rtl),
+.search-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
transform: scaleX(-1);
}
.search-go-button:hover {
+ -moz-image-region: rect(14px, 42px, 28px, 28px);
}
.search-go-button:hover:active {
-}
-
-.searchbar-engine-menuitem[selected="true"] > .menu-iconic-text {
- font-weight: bold;
+ -moz-image-region: rect(14px, 42px, 28px, 28px);
}
.searchbar-search-button-container {
background-color: #FFCF00;
}
-searchbar[oneoffui] .search-go-button {
- list-style-image: url("chrome://browser/skin/reload-stop-goFx.png");
- -moz-image-region: rect(0, 42px, 14px, 28px);
- width: 14px;
-}
-
-searchbar[oneoffui] .search-go-button:hover {
- -moz-image-region: rect(14px, 42px, 28px, 28px);
-}
-
-searchbar[oneoffui] .search-go-button:hover:active {
- -moz-image-region: rect(28px, 42px, 42px, 28px);
-}
-
-searchbar[oneoffui] .search-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
- transform: scaleX(-1);
-}
-
@media (min-resolution: 1.1dppx) {
- searchbar[oneoffui] .search-go-button {
+ .search-go-button {
list-style-image: url("chrome://browser/skin/reload-stop-go@2x.png");
-moz-image-region: rect(0, 84px, 28px, 56px);
}
- searchbar[oneoffui] .search-go-button:hover {
+ .search-go-button:hover {
-moz-image-region: rect(28px, 84px, 56px, 56px);
}
- searchbar[oneoffui] .search-go-button:hover:active {
+ .search-go-button:hover:active {
-moz-image-region: rect(56px, 84px, 84px, 56px);
}
}
list-style-image: url("chrome://browser/skin/search-engine-placeholder.png");
}
-searchbar[oneoffui] .searchbar-engine-button {
- display: none;
-}
-
.search-panel-tree > .autocomplete-treebody::-moz-tree-cell {
-moz-padding-start: 15px;
border-top: none !important;
list-style-image: url("chrome://browser/skin/search-history-icon.svg#search-history-icon-active");
}
-searchbar[oneoffui] .searchbar-engine-image {
- -moz-margin-start: -1px;
-}
-
.search-setting-button {
border-bottom: none;
border-left: none;
projects / themes.git / commitdiff
