ericduran/chromeHAR

View on GitHub
css/style.css

Summary

Maintainability
Test Coverage
* {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.tabbed-pane-content a {
  border-bottom: 1px solid #def;
  color: #0074d9;
  padding-bottom: 1px;
  text-decoration: none;
  transition: border-bottom-color .2s ease-in-out, color .2s ease-in-out;
}

.tabbed-pane-content a:visited {
  border-bottom-color: #fde;
  color: #b10dc9;
}

.tabbed-pane-content a:visited:hover {
  border-bottom-color: #f9c;
  color: #870a99;
}

.tabbed-pane-content a:hover {
  border-bottom-color: #9cf;
  color: #005095;
}

.tabbed-pane-content a:active,
.tabbed-pane-content a:visited:active {
  border-bottom-color: #fc9;
  color: #ff851b;
}

.fork-banner img {
  border: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 11;
}

.toolbar-controls {
  float: right;
  display:-moz-box;
  display: -webkit-box;
  -ms-flex-pack:center;
  -moz-box-align:center;
  -webkit-box-align: center;
  box-align:center;
  height: 100%;
  padding-right: 120px;
}

.toolbar-item.pagespeed-panel .toolbar-icon {
  background-image: url(../img/pagespeed-devtools-icon.png);
}

#search {
  position: relative;
  z-index: 12;
  width: 200px;
}

.support {
  display: block;
}

.no-support {
  display: none;
}

.disabled .support {
  display: none;
}
.disabled .no-support {
  display: block;
}

#dropArea.visible {
  width: 100%;
  height: 100%;
  padding: 40px 20px;
  margin: 88px auto 0;
  position: absolute;
  display: block;
  background: rgba(255, 255, 255, 0.8);
  background-image: -webkit-linear-gradient(bottom, transparent 80%, rgba(0, 0, 0, 0.1) 100%);
  background-image: -moz-linear-gradient(bottom, transparent 80%, rgba(0, 0, 0, 0.1) 100%);
  background-image: -ms-linear-gradient(bottom, transparent 80%, rgba(0, 0, 0, 0.1) 100%);
  background-image: -o-linear-gradient(bottom, transparent 80%, rgba(0, 0, 0, 0.1) 100%);
  background-image: linear-gradient(bottom, transparent 80%, rgba(0, 0, 0, 0.1) 100%);
  text-align: center;
  box-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.1), 0 -2px 0 rgba(255, 255, 255, 0.5);
  text-shadow: 0 1px 0 white;
  z-index: 10;
  font-size: 20px;
}

.network-timeline-grid {
  left: 55.0701262272089770%; /* Horribly broken see issue #15 */
}

.split-view-network-views,
.split-view-resizer {
  left: 313px;
  right: 0px;
}

.split-view-sidebar-left.maximized {
  left: 0px;
  right: 0;
}

.split-view-sidebar-left.minimized {
  left: 0px;
  width: 313px;
}

#network-close-button {
  display: block;
}

.resource-status-image {
  vertical-align: middle;
}

/* Use class instead of styles */
.split-view-sidebar-left.maximized colgroup .first {
  width: 20.05610098176718%;
}
.split-view-sidebar-left.maximized colgroup .sec,
.split-view-sidebar-left.maximized colgroup .third,
.split-view-sidebar-left.maximized colgroup .fourth {
  width: 7.03085553997195%;
}
.split-view-sidebar-left.maximized colgroup .five,
.split-view-sidebar-left.maximized colgroup .six {
  width: 6.9607293127629735%;
}
.split-view-sidebar-left.maximized colgroup .sev {
  width: 45.90182328190743%;
}

.split-view-sidebar-left.minimized colgroup .first {
  width: 100%%;
}
.split-view-sidebar-left.minimized colgroup .sec,
.split-view-sidebar-left.minimized colgroup .third,
.split-view-sidebar-left.minimized colgroup .fourth,
.split-view-sidebar-left.minimized colgroup .five,
.split-view-sidebar-left.minimized colgroup .six,
.split-view-sidebar-left.minimized colgroup .sev {
  width: 0px;
  display: none;
}

.fork,
.sample {
  padding: 0.5em 1em;
  border: 1px solid #d4d4d4;
  margin: 0 15px 0 0;
  text-decoration: none;
  text-align: center;
  text-shadow: 1px 1px 0 white;
  font: 11px/normal sans-serif;
  color: #333;
  white-space: nowrap;
  cursor: pointer;
  outline: none;
  background-color: #ECECEC;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f4f4), to(#ececec));
  background-image: -moz-linear-gradient(#f4f4f4, #ececec);
  background-image: -ms-linear-gradient(#f4f4f4, #ececec);
  background-image: -o-linear-gradient(#f4f4f4, #ececec);
  background-image: linear-gradient(#f4f4f4, #ececec);
  -moz-background-clip: padding;
  background-clip: padding-box;
  border-radius: 0.2em;
  zoom: 1;
}

.file-label {
  font-size: 1.3em;
  padding-right: 5px;
}

.network-log-grid.data-grid .page-summary-bar {
    left: 0;
    right: 0;
    bottom: 0;
    margin-right: -14px;
    background-color: rgb(101, 111, 130);
}

.network-log-grid.data-grid .page-summary-bar td {
    color: white;
    height: 20px !important;
    border: none;
    font-size: 11px;
    font-weight: bold;
    padding: 0 0 0 8px;
    white-space: pre;
    overflow : hidden;
    text-overflow : ellipsis;
}

.page-wrapper {
  bottom: 0;
  display: none;
  height: 100%;
  position: relative;
  top: 0;
}

/* Show the main table cells when the drag-and-drop area disappears */
#dropArea:not(.visible) ~ #main .page-wrapper {
  display: block;
}

.iframed #toolbar {
  height: 30px;
}

.iframed #main {
  top: 30px;
}

.iframed .fork-banner,
.iframed .toolbar-item.network,
.iframed #toolbar-sample-item * {
  display: none;
}

.iframed .toolbar-controls {
  padding-right: 0;
}