mirror of
https://github.com/Grasscutters/mitmproxy.git
synced 2025-01-30 14:58:38 +00:00
tweak css
This commit is contained in:
parent
1143552e16
commit
89d66360d6
@ -290,6 +290,9 @@ header .menu {
|
||||
max-height: 100px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.flow-detail hr {
|
||||
margin: 0 0 5px;
|
||||
}
|
||||
.view-selector {
|
||||
margin-top: 10px;
|
||||
}
|
||||
@ -309,6 +312,9 @@ header .menu {
|
||||
width: 50%;
|
||||
padding-right: 1em;
|
||||
}
|
||||
.header-table td {
|
||||
line-height: 1.3em;
|
||||
}
|
||||
.header-table .header-name {
|
||||
width: 33%;
|
||||
padding-right: 1em;
|
||||
|
@ -6,7 +6,6 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
|
||||
> div {
|
||||
background-color: #F2F2F2;
|
||||
padding: 0 5px;
|
||||
@ -23,7 +22,6 @@
|
||||
background-color: #fcfcfc;
|
||||
}
|
||||
|
||||
|
||||
.fa-close {
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
|
@ -1,13 +1,12 @@
|
||||
//TODO: Move into some utils
|
||||
.monospace(){
|
||||
.monospace() {
|
||||
font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
|
||||
}
|
||||
|
||||
|
||||
.flow-detail {
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
|
||||
|
||||
nav {
|
||||
background-color: #F2F2F2;
|
||||
}
|
||||
@ -27,10 +26,15 @@
|
||||
max-height: 100px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 0 0 5px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.view-selector {
|
||||
margin-top: 10px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.flow-detail table {
|
||||
@ -38,10 +42,10 @@
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
word-break: break-all;
|
||||
|
||||
|
||||
tr {
|
||||
&:not(:first-child){
|
||||
border-top: 1px solid #f7f7f7;
|
||||
&:not(:first-child) {
|
||||
border-top: 1px solid #f7f7f7;
|
||||
}
|
||||
}
|
||||
|
||||
@ -62,12 +66,15 @@
|
||||
}
|
||||
|
||||
.header-table {
|
||||
td {
|
||||
line-height: 1.3em;
|
||||
}
|
||||
.header-name {
|
||||
width: 33%;
|
||||
padding-right: 1em;
|
||||
}
|
||||
.header-value {
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1,127 +1,127 @@
|
||||
//TODO: move into utils
|
||||
.user-select (@val) {
|
||||
-webkit-touch-callout: @val;
|
||||
-webkit-user-select: @val;
|
||||
-khtml-user-select: @val;
|
||||
-moz-user-select: @val;
|
||||
-ms-user-select: @val;
|
||||
user-select: @val;
|
||||
-webkit-touch-callout: @val;
|
||||
-webkit-user-select: @val;
|
||||
-khtml-user-select: @val;
|
||||
-moz-user-select: @val;
|
||||
-ms-user-select: @val;
|
||||
user-select: @val;
|
||||
}
|
||||
|
||||
.flow-table {
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
}
|
||||
overflow: auto;
|
||||
|
||||
thead {
|
||||
background-color: #F2F2F2;
|
||||
line-height: 23px;
|
||||
}
|
||||
|
||||
th {
|
||||
font-weight: normal;
|
||||
box-shadow: 0 1px 0 #a6a6a6;
|
||||
position: relative !important;
|
||||
padding-left: 1px;
|
||||
.user-select(none);
|
||||
|
||||
&.sort-asc, &.sort-desc {
|
||||
background-color: lighten(#F2F2F2, 3%);
|
||||
}
|
||||
&.sort-asc:after, &.sort-desc:after {
|
||||
font: normal normal normal 14px/1 FontAwesome;
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
top: 3px;
|
||||
padding: 2px;
|
||||
background-color: fadeout(lighten(#F2F2F2, 3%), 20%);
|
||||
}
|
||||
&.sort-asc:after {
|
||||
content: "\f0de";
|
||||
}
|
||||
&.sort-desc:after {
|
||||
content: "\f0dd";
|
||||
table {
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
}
|
||||
thead {
|
||||
background-color: #F2F2F2;
|
||||
line-height: 23px;
|
||||
}
|
||||
|
||||
tr {
|
||||
cursor: pointer;
|
||||
th {
|
||||
font-weight: normal;
|
||||
box-shadow: 0 1px 0 #a6a6a6;
|
||||
position: relative !important;
|
||||
padding-left: 1px;
|
||||
.user-select(none);
|
||||
|
||||
&:nth-child(even) {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
&.selected {
|
||||
background-color: hsla(209, 52%, 84%, 0.5) !important;
|
||||
}
|
||||
&.highlighted {
|
||||
background-color: hsla(48, 100%, 50%, 0.4);
|
||||
}
|
||||
&.highlighted:nth-child(even) {
|
||||
background-color: hsla(48, 100%, 50%, 0.5);
|
||||
}
|
||||
}
|
||||
&.sort-asc, &.sort-desc {
|
||||
background-color: lighten(#F2F2F2, 3%);
|
||||
}
|
||||
&.sort-asc:after, &.sort-desc:after {
|
||||
font: normal normal normal 14px/1 FontAwesome;
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
top: 3px;
|
||||
padding: 2px;
|
||||
background-color: fadeout(lighten(#F2F2F2, 3%), 20%);
|
||||
}
|
||||
&.sort-asc:after {
|
||||
content: "\f0de";
|
||||
}
|
||||
&.sort-desc:after {
|
||||
content: "\f0dd";
|
||||
}
|
||||
|
||||
td {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
@interceptorange: hsl(30, 100%, 50%);
|
||||
tr {
|
||||
cursor: pointer;
|
||||
|
||||
tr.intercepted:not(.has-response) {
|
||||
.col-path, .col-method {
|
||||
color: @interceptorange;
|
||||
&:nth-child(even) {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
&.selected {
|
||||
background-color: hsla(209, 52%, 84%, 0.5) !important;
|
||||
}
|
||||
&.highlighted {
|
||||
background-color: hsla(48, 100%, 50%, 0.4);
|
||||
}
|
||||
&.highlighted:nth-child(even) {
|
||||
background-color: hsla(48, 100%, 50%, 0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
tr.intercepted.has-response {
|
||||
.col-status, .col-size, .col-time {
|
||||
color: @interceptorange;
|
||||
}
|
||||
}
|
||||
|
||||
.fa {
|
||||
line-height: inherit;
|
||||
&.pull-right {
|
||||
margin-left: 0;
|
||||
td {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.col-tls {
|
||||
width: 10px;
|
||||
}
|
||||
.col-tls-https {
|
||||
background-color: rgba(0, 185, 0, 0.5);
|
||||
}
|
||||
.col-icon {
|
||||
width: 32px;
|
||||
}
|
||||
.col-path {
|
||||
.fa-repeat {
|
||||
color: green;
|
||||
@interceptorange: hsl(30, 100%, 50%);
|
||||
|
||||
tr.intercepted:not(.has-response) {
|
||||
.col-path, .col-method {
|
||||
color: @interceptorange;
|
||||
}
|
||||
}
|
||||
.fa-pause {
|
||||
color: @interceptorange;
|
||||
tr.intercepted.has-response {
|
||||
.col-status, .col-size, .col-time {
|
||||
color: @interceptorange;
|
||||
}
|
||||
}
|
||||
|
||||
.fa {
|
||||
line-height: inherit;
|
||||
&.pull-right {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.col-tls {
|
||||
width: 10px;
|
||||
}
|
||||
.col-tls-https {
|
||||
background-color: rgba(0, 185, 0, 0.5);
|
||||
}
|
||||
.col-icon {
|
||||
width: 32px;
|
||||
}
|
||||
.col-path {
|
||||
.fa-repeat {
|
||||
color: green;
|
||||
}
|
||||
.fa-pause {
|
||||
color: @interceptorange;
|
||||
}
|
||||
}
|
||||
.col-method {
|
||||
width: 60px;
|
||||
}
|
||||
.col-status {
|
||||
width: 50px;
|
||||
}
|
||||
.col-size {
|
||||
width: 70px;
|
||||
}
|
||||
.col-time {
|
||||
width: 50px;
|
||||
}
|
||||
td.col-time, td.col-size {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
.col-method {
|
||||
width: 60px;
|
||||
}
|
||||
.col-status {
|
||||
width: 50px;
|
||||
}
|
||||
.col-size {
|
||||
width: 70px;
|
||||
}
|
||||
.col-time {
|
||||
width: 50px;
|
||||
}
|
||||
td.col-time, td.col-size {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
@ -1,9 +1,9 @@
|
||||
.flowview-image {
|
||||
|
||||
text-align: center;
|
||||
text-align: center;
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
}
|
@ -2,30 +2,30 @@
|
||||
@import (reference) '../../node_modules/bootstrap/less/mixins/grid.less';
|
||||
|
||||
header {
|
||||
padding-top: 0.5em;
|
||||
background-color: white;
|
||||
@separator-color: lighten(grey, 15%);
|
||||
.menu {
|
||||
padding: 10px;
|
||||
border-bottom: solid @separator-color 1px;
|
||||
}
|
||||
padding-top: 0.5em;
|
||||
background-color: white;
|
||||
@separator-color: lighten(grey, 15%);
|
||||
.menu {
|
||||
padding: 10px;
|
||||
border-bottom: solid @separator-color 1px;
|
||||
}
|
||||
}
|
||||
|
||||
@menu-row-gutter-width: 5px;
|
||||
.menu-row {
|
||||
.make-row(@menu-row-gutter-width);
|
||||
.make-row(@menu-row-gutter-width);
|
||||
}
|
||||
|
||||
.filter-input {
|
||||
.make-md-column(3, @menu-row-gutter-width);
|
||||
.make-md-column(3, @menu-row-gutter-width);
|
||||
}
|
||||
|
||||
.filter-input .popover {
|
||||
top: 27px;
|
||||
display: block;
|
||||
max-width: none;
|
||||
.popover-content {
|
||||
max-height: 500px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
top: 27px;
|
||||
display: block;
|
||||
max-width: none;
|
||||
.popover-content {
|
||||
max-height: 500px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
@ -15,7 +15,7 @@ html, body, #container {
|
||||
|
||||
.main-view {
|
||||
flex: 1 1 auto;
|
||||
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
|
@ -5,34 +5,42 @@
|
||||
|
||||
// From Chrome Dev Tools
|
||||
.resource-icon-css {
|
||||
background-image: url(images/chrome-devtools/resourceCSSIcon.png);
|
||||
background-image: url(images/chrome-devtools/resourceCSSIcon.png);
|
||||
}
|
||||
|
||||
.resource-icon-document {
|
||||
background-image: url(images/chrome-devtools/resourceDocumentIcon.png);
|
||||
background-image: url(images/chrome-devtools/resourceDocumentIcon.png);
|
||||
}
|
||||
|
||||
.resource-icon-js {
|
||||
background-image: url(images/chrome-devtools/resourceJSIcon.png);
|
||||
background-image: url(images/chrome-devtools/resourceJSIcon.png);
|
||||
}
|
||||
|
||||
.resource-icon-plain {
|
||||
background-image: url(images/chrome-devtools/resourcePlainIcon.png);
|
||||
background-image: url(images/chrome-devtools/resourcePlainIcon.png);
|
||||
}
|
||||
|
||||
// Own
|
||||
.resource-icon-executable {
|
||||
background-image: url(images/resourceExecutableIcon.png);
|
||||
background-image: url(images/resourceExecutableIcon.png);
|
||||
}
|
||||
|
||||
.resource-icon-flash {
|
||||
background-image: url(images/resourceFlashIcon.png);
|
||||
background-image: url(images/resourceFlashIcon.png);
|
||||
}
|
||||
|
||||
.resource-icon-image {
|
||||
background-image: url(images/resourceImageIcon.png);
|
||||
background-image: url(images/resourceImageIcon.png);
|
||||
}
|
||||
|
||||
.resource-icon-java {
|
||||
background-image: url(images/resourceJavaIcon.png);
|
||||
background-image: url(images/resourceJavaIcon.png);
|
||||
}
|
||||
|
||||
.resource-icon-not-modified {
|
||||
background-image: url(images/resourceNotModifiedIcon.png);
|
||||
background-image: url(images/resourceNotModifiedIcon.png);
|
||||
}
|
||||
|
||||
.resource-icon-redirect {
|
||||
background-image: url(images/resourceRedirectIcon.png);
|
||||
background-image: url(images/resourceRedirectIcon.png);
|
||||
}
|
@ -1,6 +1,5 @@
|
||||
|
||||
@navbar-height: 32px;
|
||||
@navbar-default-link-color: #303030;
|
||||
@navbar-default-color: #303030;
|
||||
@navbar-default-bg: #ffffff;
|
||||
@navbar-default-border: #e0e0e0;
|
||||
@navbar-height: 32px;
|
||||
@navbar-default-link-color: #303030;
|
||||
@navbar-default-color: #303030;
|
||||
@navbar-default-bg: #ffffff;
|
||||
@navbar-default-border: #e0e0e0;
|
||||
|
@ -2,12 +2,10 @@
|
||||
@import "../../node_modules/bootstrap/less/variables.less";
|
||||
@import "vendor-bootstrap-variables.less";
|
||||
@import "../../node_modules/bootstrap/less/mixins.less";
|
||||
|
||||
// Reset and dependencies
|
||||
@import "../../node_modules/bootstrap/less/normalize.less";
|
||||
@import "../../node_modules/bootstrap/less/print.less";
|
||||
@import "../../node_modules/bootstrap/less/glyphicons.less";
|
||||
|
||||
// Core CSS
|
||||
@import "../../node_modules/bootstrap/less/scaffolding.less";
|
||||
@import "../../node_modules/bootstrap/less/type.less";
|
||||
@ -16,7 +14,6 @@
|
||||
@import "../../node_modules/bootstrap/less/tables.less";
|
||||
@import "../../node_modules/bootstrap/less/forms.less";
|
||||
@import "../../node_modules/bootstrap/less/buttons.less";
|
||||
|
||||
// Components
|
||||
@import "../../node_modules/bootstrap/less/component-animations.less";
|
||||
@import "../../node_modules/bootstrap/less/dropdowns.less";
|
||||
@ -39,13 +36,11 @@
|
||||
@import "../../node_modules/bootstrap/less/responsive-embed.less";
|
||||
@import "../../node_modules/bootstrap/less/wells.less";
|
||||
@import "../../node_modules/bootstrap/less/close.less";
|
||||
|
||||
// Components w/ JavaScript
|
||||
@import "../../node_modules/bootstrap/less/modals.less";
|
||||
@import "../../node_modules/bootstrap/less/tooltip.less";
|
||||
@import "../../node_modules/bootstrap/less/popovers.less";
|
||||
@import "../../node_modules/bootstrap/less/carousel.less";
|
||||
|
||||
// Utility classes
|
||||
@import "../../node_modules/bootstrap/less/utilities.less";
|
||||
@import "../../node_modules/bootstrap/less/responsive-utilities.less";
|
||||
|
Loading…
Reference in New Issue
Block a user