Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-19 00:05:36 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1467572 - Part 8: Add proper separators to the global toolbar. r=jryans

Browse Source
This commit is contained in:
Gabriel Luong 2018-08-15 17:27:39 -04:00
parent d280f20fc3
commit 0cf08baeef
2 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
devtools/client/responsive.html/components/Toolbar.js
View File

@ -95,6 +95,7 @@ class Toolbar extends PureComponent {
onClick: () => onRotateViewport(viewport.id),
title: getStr("responsive.rotate"),
}),
dom.div({ className: "devtools-separator" }),
DevicePixelRatioSelector({
devices,
displayPixelRatio,
@ -102,10 +103,12 @@ class Toolbar extends PureComponent {
selectedPixelRatio,
onChangePixelRatio,
}),
dom.div({ className: "devtools-separator" }),
NetworkThrottlingSelector({
networkThrottling,
onChangeNetworkThrottling,
}),
dom.div({ className: "devtools-separator" }),
dom.button({
id: "touch-simulation-button",
className: touchButtonClass,
@ -127,6 +130,7 @@ class Toolbar extends PureComponent {
reloadConditions,
onChangeReloadCondition,
}),
dom.div({ className: "devtools-separator" }),
dom.button({
id: "exit-button",
className: "toolbar-button devtools-button",

10
devtools/client/responsive.html/index.css
View File

@ -57,6 +57,11 @@ body,
border: 1px solid var(--theme-splitter-color);
}
.devtools-separator {
height: 100%;
margin: 0 1px;
}
.toolbar-button {
margin: 0;
padding: 0;
@ -176,7 +181,6 @@ select > option.divider {
.toolbar-dropdown {
background-position-x: right 5px;
border-right: 1px solid var(--theme-splitter-color);
padding-right: 15px;
}
@ -204,10 +208,6 @@ select > option.divider {
background-size: cover;
}
#device-selector {
border-right: none;
}
#toolbar-center-controls,
#toolbar-end-controls {
display: flex;