html { -moz-box-sizing: border-box; box-sizing: border-box; } *, *:before, *:after { -moz-box-sizing: inherit; box-sizing: inherit; } .resource-icon { width: 32px; height: 32px; } .resource-icon-css { background-image: url(../images/chrome-devtools/resourceCSSIcon.png); } .resource-icon-document { background-image: url(../images/chrome-devtools/resourceDocumentIcon.png); } .resource-icon-js { background-image: url(../images/chrome-devtools/resourceJSIcon.png); } .resource-icon-plain { background-image: url(../images/chrome-devtools/resourcePlainIcon.png); } .resource-icon-executable { background-image: url(../images/resourceExecutableIcon.png); } .resource-icon-flash { background-image: url(../images/resourceFlashIcon.png); } .resource-icon-image { background-image: url(../images/resourceImageIcon.png); } .resource-icon-java { background-image: url(../images/resourceJavaIcon.png); } .resource-icon-not-modified { background-image: url(../images/resourceNotModifiedIcon.png); } .resource-icon-redirect { background-image: url(../images/resourceRedirectIcon.png); } html, body, #container { height: 100%; margin: 0; overflow: hidden; } #container { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } #container > header, #container > footer, #container > .eventlog { -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; } .main-view { -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } .main-view.vertical { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .main-view .flow-detail, .main-view .flow-table { -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; } .nav-tabs { border-bottom: solid #a6a6a6 1px; } .nav-tabs a { display: inline-block; border: solid transparent 1px; text-decoration: none; } .nav-tabs a.active { background-color: white; border-color: #a6a6a6; border-bottom-color: white; } .nav-tabs a.special { color: white; background-color: #396cad; border-bottom-color: #396cad; } .nav-tabs a.special:hover { background-color: #5386c6; } .nav-tabs-lg a { padding: 3px 14px; margin: 0 2px -1px; } .nav-tabs-sm a { padding: 0px 7px; margin: 2px 2px -1px; } header { background-color: white; /* nav { border-bottom: solid @separator-color 1px; a { display: inline-block; padding: 3px 14px; margin: 0 2px -1px; border: solid transparent 1px; //text-transform: uppercase; //font-family: Lato; &.active { border-color: @separator-color; border-bottom-color: white; } &.active, &:hover { text-decoration: none; } &.special { @special-color: #396cad; color: white; background-color: @special-color; border-bottom-color: @special-color; &:hover { background-color: lighten(@special-color, 10%); } } } } */ } header .title-bar { line-height: 25px; text-align: center; } header .menu { padding: 10px; border-bottom: solid #a6a6a6 1px; } .flow-table { width: 100%; overflow: auto; } .flow-table table { width: 100%; table-layout: fixed; } .flow-table thead { background-color: #F2F2F2; line-height: 23px; } .flow-table th { font-weight: normal; box-shadow: 0 1px 0 #a6a6a6; } .flow-table tbody { outline: 0; } .flow-table tr { cursor: pointer; } .flow-table tr.selected { background-color: rgba(193, 215, 235, 0.5) !important; } .flow-table td { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .flow-table tr:nth-child(even) { background-color: rgba(0, 0, 0, 0.05); } .flow-table .col-tls { width: 10px; } .flow-table .col-tls-https { background-color: rgba(0, 185, 0, 0.5); } .flow-table .col-icon { width: 32px; } .flow-table .col-method { width: 60px; } .flow-table .col-status { width: 50px; } .flow-table .col-time { width: 50px; } .flow-table td.col-time { text-align: right; } .flow-detail { overflow: auto; } .flow-detail nav { background-color: #F2F2F2; } .eventlog { -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; margin: 0; border-radius: 0; height: 200px; overflow: auto; overflow-y: scroll; } footer { box-shadow: 0 -1px 3px #d3d3d3; padding: 0px 10px 3px; }