pnx/httpcb
Archived
1
0
Fork 0
Code Releases Activity

app/assets/sass/components/_request-list.scss: rewritten to extend card component

Browse source
This commit is contained in:
Henrik Hautakoski 2018-09-04 23:48:01 +02:00
parent 1e77c2650d
commit fba2c1fa35
2 changed files with 4 additions and 58 deletions
Download patch file Download diff file Expand all files Collapse all files

9
app/assets/sass/_variables.scss
View file

@ -217,14 +217,5 @@ $callback-list-arrow-color: $callback-list-border-color;
// Request list // Request list
// ---------------------------------- // ----------------------------------
$request-item-color: $text-color;
$request-item-secondary-color: $text-secondary-color; $request-item-secondary-color: $text-secondary-color;
$request-item-background: transparent;
$request-item-border-color: $gray-light;
$request-item-active-color: $request-item-color;
$request-item-active-background: $gray-lightest;
$request-item-active-border-color: $request-item-border-color;
$request-item-hover-background: $request-item-active-background;
$request-detail-background: lighten($brand-color, 45%); $request-detail-background: lighten($brand-color, 45%);

53
app/assets/sass/components/_request-list.scss
View file

@ -1,39 +1,14 @@
.request-list { .request-list {
@extend .card-accordion;
&-item { &-item {
@extend .card;
// Header Section // Header Section
// -------------- // --------------
&-header { &-header {
display: block; @extend .card-header, .card-header-link;
padding: .5em 1em;
color: $request-item-active-color;
background-color: $request-item-active-background;
border: 1px solid $request-item-active-border-color;
&:hover,
&:active,
&:focus {
color: $request-item-active-color;
text-decoration: none;
}
&.collapsed {
background-color: $request-item-background;
&:hover {
background-color: $request-item-hover-background;
}
&:hover,
&:active,
&:focus {
color: $request-item-color;
}
}
&-row { &-row {
display: block; display: block;
@ -80,10 +55,8 @@
// Detail section // Detail section
// -------------- // --------------
&-detail { &-detail {
@extend .card-body;
background-color: $request-detail-background; background-color: $request-detail-background;
border: 1px solid $request-item-border-color;
padding: 1em;
&-headers { &-headers {
@extend .table, .table-bordered; @extend .table, .table-bordered;
@ -104,23 +77,5 @@
margin-bottom: 1em; margin-bottom: 1em;
} }
} }
// Border overrides
// ----------------
// Remove bottom border from header for all but last request-item.
&:not(:last-child) &-header {
border-bottom: 0;
}
// Remove top border from detail element for last request-item.
&:last-child &-detail {
border-top: 0;
}
// Remove bottom border from detail element for all but last request-item.
&:not(:last-child) &-detail {
border-bottom: 0;
}
} }
} }