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
div.filters-inner
h1
a.title(href="", title="back to categories") filters
span.title filters
form
fieldset

View File

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

View File

@ -1,14 +1,14 @@
section.filters
div.filters-inner
h1
a.title filters
span.title filters
form
fieldset
input(type="text", placeholder="Search by subject...", ng-model="filtersSubject")
a.icon.icon-search(href="", title="search")
div.filters-step-cat
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
a.back(href="", title="back to categories") Filters
span.icon-arrow-right
@ -44,9 +44,9 @@ section.filters
a(href="", title="Created by", data-type="createdBy")
span.title Created by
span.icon.icon-arrow-right
li(ng-if="filters.myFilters.length")
a(href="", title="My filters", data-type="myFilters")
span.title My filters
li.custom-filters(ng-if="filters.myFilters.length")
a(href="", title="Custom filters", data-type="myFilters")
span.title Custom filters
span.icon.icon-arrow-right
div.filter-list.hidden

View File

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