UX: Improve layout of groups filter on groups page.

This commit is contained in:
Guo Xiang Tan 2018-03-21 14:22:34 +08:00
parent 6a3c8fe69c
commit dda78f2fd0
3 changed files with 18 additions and 10 deletions
app/assets
javascripts/discourse/templates
stylesheets
common/base
mobile

@ -1,16 +1,18 @@
{{#d-section pageClass="groups"}} {{#d-section pageClass="groups"}}
<h1>{{i18n "groups.index.title"}}</h1> <h1>{{i18n "groups.index.title"}}</h1>
{{text-field value=filterInput <div class="groups-filter">
placeholderKey="groups.filter_name"
class="groups-name-filter no-blur"}}
{{combo-box value=type {{combo-box value=type
content=types content=types
clearable=true clearable=true
none="groups.index.all_groups" none="groups.index.all_groups"
class="groups-type-filter"}} class="groups-type-filter"}}
{{text-field value=filterInput
placeholderKey="groups.filter_name"
class="groups-name-filter no-blur"}}
</div>
{{#if model}} {{#if model}}
{{#conditional-loading-spinner condition=model.loading}} {{#conditional-loading-spinner condition=model.loading}}
{{#load-more selector=".groups-table .groups-table-row" action="loadMore"}} {{#load-more selector=".groups-table .groups-table-row" action="loadMore"}}

@ -5,7 +5,8 @@
} }
} }
.groups-name-filter, .groups-type-filter { .groups-filter {
display: inline-block;
float: right; float: right;
} }

@ -3,7 +3,12 @@
margin-top: 20px; margin-top: 20px;
} }
.groups-filter {
display: block;
float: none;
}
.groups-name-filter { .groups-name-filter {
margin-top: 20px; margin-top: 10px;
} }
} }