Bug 1308441 - Small refactorings r?honza
MozReview-Commit-ID: BM0RoiuRaPh
--- a/devtools/client/themes/netmonitor.css
+++ b/devtools/client/themes/netmonitor.css
@@ -139,17 +139,16 @@
overflow-x: hidden;
overflow-y: auto;
--timings-scale: 1;
--timings-rev-scale: 1;
}
.requests-list-subitem {
display: flex;
- flex: none;
box-sizing: border-box;
align-items: center;
padding: 3px;
cursor: default;
}
.subitem-label {
white-space: nowrap;
@@ -200,31 +199,32 @@
background-color: rgba(0, 0, 0, 0.1);
}
.requests-list-header-button > .button-text {
flex: auto;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
+ cursor: default;
}
.requests-list-header-button > .button-icon {
flex: none;
height: 4px;
margin-inline-start: 3px;
margin-inline-end: 6px;
width: 7px;
}
-.requests-list-header-button[data-sorted=ascending] > .button-icon {
+.requests-list-header-button.ascending > .button-icon {
background-image: var(--sort-ascending-image);
}
-.requests-list-header-button[data-sorted=descending] > .button-icon {
+.requests-list-header-button.descending > .button-icon {
background-image: var(--sort-descending-image);
}
.requests-list-waterfall-label-wrapper {
display: flex;
}
.requests-list-header-button[data-sorted],
@@ -268,56 +268,32 @@
.theme-firebug .requests-list-header:hover:active {
background-image: linear-gradient(rgba(0, 0, 0, 0.1),
transparent);
}
/* Network requests table: specific column dimensions */
-.requests-list-status {
- max-width: 6em;
- text-align: center;
- width: 10vw;
-}
-
-.requests-list-method,
-.requests-list-method-box {
- max-width: 7em;
- text-align: center;
- width: 10vw;
-}
-
-.requests-list-icon-and-file {
- width: 22vw;
-}
-
.requests-list-icon {
background: transparent;
width: 15px;
height: 15px;
margin-inline-end: 4px;
-}
-
-.requests-list-icon {
outline: 1px solid var(--table-splitter-color);
}
-.requests-list-security-and-domain {
- width: 14vw;
-}
-
-.requests-security-state-icon {
- flex: none;
+.request-list-item .requests-domain {
width: 16px;
height: 16px;
margin-inline-end: 4px;
+ background-repeat: no-repeat;
}
-.request-list-item.selected .requests-security-state-icon {
+.request-list-item.selected .requests-domain {
filter: brightness(1.3);
}
.security-state-insecure {
background-image: url(chrome://devtools/skin/images/security-state-insecure.svg);
}
.security-state-secure {
@@ -331,32 +307,18 @@
.security-state-broken {
background-image: url(chrome://devtools/skin/images/security-state-broken.svg);
}
.security-state-local {
background-image: url(chrome://devtools/skin/images/globe.svg);
}
-.requests-list-type,
-.requests-list-size {
- max-width: 6em;
- width: 8vw;
- justify-content: center;
-}
-
-.requests-list-transferred {
- max-width: 8em;
- width: 8vw;
- justify-content: center;
-}
-
.requests-list-cause {
- max-width: 8em;
- width: 8vw;
+ width: 90px;
}
.requests-list-cause-stack {
background-color: var(--theme-body-color-alt);
color: var(--theme-body-background);
font-size: 8px;
font-weight: bold;
line-height: 10px;
@@ -378,18 +340,17 @@
width: 3em;
margin-inline-end: -3em !important;
}
.requests-list-status-icon {
background: #fff;
height: 10px;
width: 10px;
- margin-inline-start: 5px;
- margin-inline-end: 5px;
+ margin-inline-end: 10px;
border-radius: 10px;
transition: box-shadow 0.5s ease-in-out;
box-sizing: border-box;
}
.request-list-item.selected .requests-list-status-icon {
filter: brightness(1.3);
}
@@ -434,16 +395,17 @@
transform: rotate(45deg);
}
/* Network requests table: waterfall header */
.requests-list-waterfall {
flex: auto;
padding-inline-start: 0;
+ overflow: hidden;
}
.requests-list-waterfall-label-wrapper:not(.requests-list-waterfall-visible) {
padding-inline-start: 16px;
}
.requests-list-timings-division {
padding-top: 2px;
@@ -568,19 +530,20 @@
/* SideMenuWidget */
#network-table .request-list-empty-notice,
#network-table .request-list-container {
background-color: var(--theme-body-background);
}
.request-list-item {
display: flex;
+ align-content: center;
border-top-color: transparent;
border-bottom-color: transparent;
- padding: 0;
+ padding: 0 3px;
}
.request-list-item.selected {
background-color: var(--theme-selection-background);
color: var(--theme-selection-color);
}
.request-list-item:not(.selected).odd {
@@ -1025,54 +988,28 @@
/* Responsive sidebar */
@media (max-width: 700px) {
#toolbar-spacer,
.network-details-panel-toggle,
.requests-list-network-summary-button > .summary-info-text {
display: none;
}
- .requests-list-toolbar {
- height: 22px;
- }
-
.requests-list-header-button {
min-height: 22px;
padding-left: 8px;
}
- .requests-list-status {
- max-width: none;
- width: 10vw;
- }
-
.requests-list-status-code {
width: auto;
}
.requests-list-method,
.requests-list-method-box {
max-width: none;
- width: 12vw;
- }
-
- .requests-list-icon-and-file {
- width: 22vw;
- }
-
- .requests-list-security-and-domain {
- width: 16vw;
- }
-
- .requests-list-cause,
- .requests-list-type,
- .requests-list-transferred,
- .requests-list-size {
- max-width: none;
- width: 10vw;
}
.requests-list-waterfall {
display: none;
}
.statistics-panel .charts-container {
flex-direction: column;