Bug 1341045 - Remove broken CSS overrides from responsive.html. r=jryans
MozReview-Commit-ID: KCb8G3agjE4
--- a/devtools/client/responsive.html/index.css
+++ b/devtools/client/responsive.html/index.css
@@ -67,27 +67,30 @@ body,
*/
.container {
background-color: var(--theme-toolbar-background);
border: 1px solid var(--theme-splitter-color);
}
.toolbar-button {
- margin: 1px 3px;
- width: 16px;
- height: 16px;
- /* Reset styles from .devtools-button */
- min-width: initial;
- min-height: initial;
- align-self: center;
+ margin: 0;
+ padding: 0;
+ border: none;
}
-.toolbar-button:active::before {
- filter: url("chrome://devtools/skin/images/filters.svg#checked-icon-state");
+.toolbar-button:empty:hover:not(:disabled),
+.toolbar-button:empty:-moz-any(:hover:active, .checked):not(:disabled) {
+ /* Reset background from .devtools-button */
+ background: none;
+}
+
+.toolbar-button:active::before,
+.toolbar-button.active::before {
+ filter: var(--checked-icon-filter);
}
select {
-moz-appearance: none;
background-color: var(--theme-toolbar-background);
background-image: var(--viewport-selection-arrow);
background-position: 100% 50%;
background-repeat: no-repeat;
@@ -150,48 +153,35 @@ select > option.divider {
-moz-user-select: none;
}
#global-toolbar > .title {
border-right: 1px solid var(--theme-splitter-color);
padding: 1px 6px 0 2px;
}
-#global-toolbar .toolbar-button {
- margin: 0 0 0 5px;
- padding: 0;
-}
-
-#global-toolbar .toolbar-button,
-#global-toolbar .toolbar-button::before {
+#global-toolbar > .toolbar-button::before {
width: 12px;
height: 12px;
}
#global-touch-simulation-button::before {
background-image: url("./images/touch-events.svg");
- margin: -6px 0 0 -6px;
-}
-
-#global-touch-simulation-button.active::before {
- filter: url("chrome://devtools/skin/images/filters.svg#checked-icon-state");
}
#global-screenshot-button::before {
background-image: url("./images/screenshot.svg");
- margin: -6px 0 0 -6px;
}
#global-exit-button::before {
background-image: url("./images/close.svg");
- margin: -6px 0 0 -6px;
}
#global-screenshot-button:disabled {
- filter: url("chrome://devtools/skin/images/filters.svg#checked-icon-state");
+ filter: var(--checked-icon-filter);
opacity: 1 !important;
}
#global-network-throttling-selector {
height: 15px;
padding-left: 0;
width: 103px;
}
@@ -264,17 +254,17 @@ select > option.divider {
*/
.viewport-toolbar {
border-width: 0;
border-bottom-width: 1px;
display: flex;
flex-direction: row;
justify-content: center;
- height: 18px;
+ height: 16px;
}
.viewport-rotate-button {
position: absolute;
right: 0;
}
.viewport-rotate-button::before {
@@ -507,22 +497,22 @@ select > option.divider {
margin-right: 5px;
}
.device-name {
flex: 1;
}
.device-remove-button,
-.device-remove-button::before {
+.device-remove-button:empty::before {
width: 12px;
height: 12px;
}
-.device-remove-button::before {
+.device-remove-button:empty::before {
background-image: url("./images/close.svg");
margin: -6px 0 0 -6px;
}
#device-submit-button {
background-color: var(--theme-tab-toolbar-background);
border-width: 1px 0 0 0;
border-top-width: 1px;