archive/httpcb
Archived
1
0
Fork 0
Code Releases Activity

Merge branch '7-cleanup-css' into 'master'

Browse source 
Resolve "Cleanup css"

Closes #7

See merge request pnx/httpcb!5
This commit is contained in:
Henrik Hautakoski 2018-03-30 11:37:45 +00:00
commit 567c113031
7 changed files with 53 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

1
app/assets/less/base/typography.less
View file

@ -2,7 +2,6 @@
// Section header (part of .section)
.hdr-center {
//&:extend(.text-center);
display: inline-block;
padding: 20px 80px;
margin: 30px auto;

8
app/assets/less/components/badge.less
View file

@ -10,9 +10,9 @@
&:empty {
display:none;
}
}
.badge-primary {
color: white;
background-color: @brand-color;
&-primary {
color: white;
background-color: @brand-color;
}
}

4
app/assets/less/components/callback-list.less
View file

@ -7,7 +7,7 @@
padding: .6em 1em;
&:hover {
background: @lightest-gray;
background: @gray-lightest;
}
// Borders.
@ -67,7 +67,7 @@
}
&-arrow {
color: #bcbcbc;
color: @callback-list-arrow-color;
position: absolute;
right: .8em;
top: 50%;

2
app/assets/less/components/pagination.less
View file

@ -20,10 +20,12 @@
&:hover {
color: @pagination-color;
background-color: @pagination-hover;
}
}
&.active a {
color: @pagination-active-color;
background: @pagination-active-bg;
border-color: @pagination-active-border;
}

2
app/assets/less/components/request-item.less
View file

@ -58,7 +58,7 @@
&-timestamp,
&-size,
&-ip {
color: @request-item-light-color;
color: @request-item-secondary-color;
font-size: @font-size-small;
}

2
app/assets/less/components/section.less
View file

@ -9,7 +9,7 @@
padding: @section-padding;
margin-bottom: 60px;
border-radius: 2px;
.box-shadow(@block-shadow-third);
.box-shadow(@block-shadow-3);
&-header {
text-align: center;

80
app/assets/less/variables.less
View file

@ -6,32 +6,29 @@
@image-path: '@{base-path}/img';
// ----------------------------------
// General colors.
// Colors
// ----------------------------------
@blue: #0000ff;
@lightest-gray: #f9f9f9;
@light-grey: #dcdcdc;
@dark-grey: #444;
@darker-grey: #202020;
@gray-lightest: #f9f9f9;
@gray-light: #dcdcdc;
@gray-dark: #444;
@gray-darker: #202020;
@black: #000;
@white: #fff;
// ----------------------------------
// Global colors.
// ----------------------------------
@brand-color: #03a9f4;
@brand-info: hsl(210, 70%, 50%);
@foreground-color: white;
//@body-bg: #f3f6fc;
@body-bg: #f5f5f6;
@border-color: @light-grey;
@text-color: #353535;
@text-secondary-color: #757575;
// Text
@text-color: #333;
@text-secondary-color: #666;
@text-light-color: #f1f1f1;
// Branding colors
// Layout
@foreground-color: @white;
@body-bg: #f5f5f8;
@hover-color: @gray-lightest;
@border-color: @gray-light;
// Brand
@brand-color: #03a9f4;
@brand-info: hsl(210, 70%, 50%);
@google-color: #db4437;
@github-color: #4183c4;
@ -81,8 +78,8 @@
@footer-height: 80px;
@footer-border-color: @border-color;
@footer-text-color: @text-secondary-color;
@footer-link-color: @text-secondary-color;
@footer-link-hover-color: darken(@text-secondary-color, 10%);
@footer-link-color: @footer-text-color;
@footer-link-hover-color: darken(@footer-link-color, 10%);
// ----------------------------------
// Buttons
@ -115,17 +112,17 @@
// Shadows
// ----------------------------------
@block-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
@block-shadow-raised: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12);
@block-shadow-third: 0 3px 3px 0 rgba(0, 0, 0, 0.16);
@block-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
@block-shadow-2: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12);
@block-shadow-3: 0 3px 3px 0 rgba(0, 0, 0, 0.16);
// ----------------------------------
// Blankslate
// ----------------------------------
@blankslate-bg: @well-bg;
@blankslate-bg: @gray-lightest;
@blankslate-color: @text-secondary-color;
@blankslate-border: @well-border;
@blankslate-border: @border-color;
@blankslate-spacing: 25px 10px;
@blankslate-spacing-sm: 15px 5px;
@ -135,7 +132,9 @@
@pagination-color: @text-color;
@pagination-border: @border-color;
@pagination-hover-color: lighten(@text-color, 25%);
@pagination-hover: @hover-color;
@pagination-active-color: @white;
@pagination-active-bg: @brand-color;
@pagination-active-border: darken(@brand-color, 5%);
@ -143,7 +142,7 @@
// Section
// ----------------------------------
@section-bg: white;
@section-bg: @foreground-color;
@section-border: rgb(200, 200, 200);
@section-padding: 20px;
@ -151,24 +150,31 @@
// Callback list
// ----------------------------------
@callback-list-hover-color: @gray-lightest;
@callback-list-info-color: @text-secondary-color;
@callback-list-border-size: 1px;
@callback-list-border-color: @light-grey;
@callback-list-border-color: @gray-light;
@callback-list-border-radius: 3px;
@callback-list-name-text-size: @font-size-h4;
@callback-list-name-color: @text-color;
@callback-list-name-hover-color: @link-color;
@callback-list-info-color: @text-secondary-color;
@callback-list-arrow-color: @callback-list-border-color;
// ----------------------------------
// Request list
// ----------------------------------
@request-item-color: @dark-grey;
@request-item-light-color: #666;
@request-item-color: @text-color;
@request-item-secondary-color: @text-secondary-color;
@request-item-background: transparent;
@request-item-border-color: @light-grey;
@request-item-active-color: @dark-grey;
@request-item-active-background: @lightest-gray;
@request-item-active-border-color: darken(@request-item-active-background, 10%);
@request-item-border-color: @gray-light;
@request-item-hover-background: @request-item-active-background;
@request-item-active-color: @request-item-color;
@request-item-active-background: @gray-lightest;
@request-item-active-border-color: @request-item-border-color;
@request-detail-background: lighten(@brand-color, 45%);