Improved filters styles. Fixes #711

stable
Xavier Julián 2014-08-27 14:36:49 +02:00
parent 1811f33daa
commit 1baf634d1f
4 changed files with 29 additions and 31 deletions

View File

@ -1,7 +1,7 @@
section.filters section.filters
div.filters-inner div.filters-inner
h1 h1
a.title(href="", title="back to categories") filters span.title filters
form form
fieldset fieldset

View File

@ -4,7 +4,7 @@
section.filters section.filters
div.filters-inner div.filters-inner
h1 h1
a.title(href="", title="back to categories") filters span.title filters
form form
fieldset fieldset

View File

@ -1,14 +1,14 @@
section.filters section.filters
div.filters-inner div.filters-inner
h1 h1
a.title filters span.title filters
form form
fieldset fieldset
input(type="text", placeholder="Search by subject...", ng-model="filtersSubject") input(type="text", placeholder="Search by subject...", ng-model="filtersSubject")
a.icon.icon-search(href="", title="search") a.icon.icon-search(href="", title="search")
div.filters-step-cat div.filters-step-cat
div.filters-applied div.filters-applied
a.hide.button.save-filters(href="", title="save", ng-class="{hide: filters.length}") save a.hide.button.button-gray.save-filters(href="", title="save", ng-class="{hide: filters.length}") save as custom filter
h2.hidden.breadcrumb h2.hidden.breadcrumb
a.back(href="", title="back to categories") Filters a.back(href="", title="back to categories") Filters
span.icon-arrow-right span.icon-arrow-right
@ -44,9 +44,9 @@ section.filters
a(href="", title="Created by", data-type="createdBy") a(href="", title="Created by", data-type="createdBy")
span.title Created by span.title Created by
span.icon.icon-arrow-right span.icon.icon-arrow-right
li(ng-if="filters.myFilters.length") li.custom-filters(ng-if="filters.myFilters.length")
a(href="", title="My filters", data-type="myFilters") a(href="", title="Custom filters", data-type="myFilters")
span.title My filters span.title Custom filters
span.icon.icon-arrow-right span.icon.icon-arrow-right
div.filter-list.hidden div.filter-list.hidden

View File

@ -27,26 +27,26 @@
} }
} }
h2 { h2 {
@extend %large;
margin-top: 1rem; margin-top: 1rem;
.subfilter { .icon-arrow-right {
@extend %large; @extend %medium;
vertical-align: middle;
} }
} }
form { input[type="text"] {
input { background: $grayer;
background: $grayer; color: $white;
color: $white; @include placeholder {
@include placeholder {
color: $gray-light;
}
}
.icon-search {
color: $gray-light; color: $gray-light;
position: absolute;
right: .7rem;
top: .7rem;
} }
} }
.icon-search {
color: $gray-light;
position: absolute;
right: .7rem;
top: .7rem;
}
} }
.filters-inner { .filters-inner {
@ -63,8 +63,9 @@
.filters-step-cat { .filters-step-cat {
.save-filters { .save-filters {
float: right; color: $white;
padding: 8 0; display: block;
text-align: center;
} }
.my-filter-name { .my-filter-name {
background: $grayer; background: $grayer;
@ -74,14 +75,6 @@
color: $gray-light; color: $gray-light;
} }
} }
.breadcrumb {
.back {
@extend %xlarge;
}
.icon-arrow-right {
@extend %large;
}
}
} }
.filters-cats { .filters-cats {
@ -90,6 +83,11 @@
border-bottom: 1px solid $gray-light; border-bottom: 1px solid $gray-light;
text-transform: uppercase; text-transform: uppercase;
} }
.custom-filters {
.title {
color: $green-taiga;
}
}
a { a {
@include transition (color .2s ease-in); @include transition (color .2s ease-in);
color: $grayer; color: $grayer;