diff options
author | Phil Hughes <me@iamphill.com> | 2017-01-31 10:53:20 +0000 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2017-02-03 18:03:40 +0000 |
commit | 9e4335363c9e7d2ea758c9c601314b88534dc9ae (patch) | |
tree | 56be48317cff75a267094cee6c60e95fc1d54708 /app | |
parent | 538a6875d3b53f909e9b5b6ef396a457cbcae760 (diff) | |
download | gitlab-ce-9e4335363c9e7d2ea758c9c601314b88534dc9ae.tar.gz |
Started adding filters to issues modal
Diffstat (limited to 'app')
-rw-r--r-- | app/assets/javascripts/boards/components/modal/filters.js.es6 | 47 | ||||
-rw-r--r-- | app/assets/javascripts/boards/components/modal/header.js.es6 | 2 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/boards.scss | 17 |
3 files changed, 66 insertions, 0 deletions
diff --git a/app/assets/javascripts/boards/components/modal/filters.js.es6 b/app/assets/javascripts/boards/components/modal/filters.js.es6 new file mode 100644 index 00000000000..f36d3c9ffe6 --- /dev/null +++ b/app/assets/javascripts/boards/components/modal/filters.js.es6 @@ -0,0 +1,47 @@ +/* global Vue */ +(() => { + const ModalStore = gl.issueBoards.ModalStore; + + gl.issueBoards.ModalFilters = Vue.extend({ + template: ` + <div class="modal-filters"> + <div class="dropdown"> + <button + class="dropdown-menu-toggle js-user-search js-author-search" + type="button" + data-toggle="dropdown"> + Author + <i class="fa fa-chevron-down"></i> + </button> + </div> + <div class="dropdown"> + <button + class="dropdown-menu-toggle js-user-search js-assignee-search" + type="button" + data-toggle="dropdown"> + Assignee + <i class="fa fa-chevron-down"></i> + </button> + </div> + <div class="dropdown"> + <button + class="dropdown-menu-toggle js-milestone-select" + type="button" + data-toggle="dropdown"> + Milestone + <i class="fa fa-chevron-down"></i> + </button> + </div> + <div class="dropdown"> + <button + class="dropdown-menu-toggle js-label-select js-multiselect" + type="button" + data-toggle="dropdown"> + Label + <i class="fa fa-chevron-down"></i> + </button> + </div> + </div> + `, + }); +})(); diff --git a/app/assets/javascripts/boards/components/modal/header.js.es6 b/app/assets/javascripts/boards/components/modal/header.js.es6 index dbbcd73f1fe..87c407f5fec 100644 --- a/app/assets/javascripts/boards/components/modal/header.js.es6 +++ b/app/assets/javascripts/boards/components/modal/header.js.es6 @@ -1,5 +1,6 @@ /* global Vue */ //= require ./tabs +//= require ./filters (() => { const ModalStore = gl.issueBoards.ModalStore; @@ -49,6 +50,7 @@ <div class="add-issues-search append-bottom-10" v-if="showSearch"> + <modal-filters></modal-filters> <input placeholder="Search issues..." class="form-control" diff --git a/app/assets/stylesheets/pages/boards.scss b/app/assets/stylesheets/pages/boards.scss index 9b413f3e61c..415eccf1764 100644 --- a/app/assets/stylesheets/pages/boards.scss +++ b/app/assets/stylesheets/pages/boards.scss @@ -416,6 +416,11 @@ .add-issues-search { display: -webkit-flex; display: flex; + + .form-control { + max-width: 200px; + margin-left: auto; + } } .add-issues-list-column { @@ -486,3 +491,15 @@ line-height: 15px; border-radius: 50%; } + +.modal-filters { + display: flex; + + > .dropdown { + margin-right: 10px; + } + + .dropdown-menu-toggle { + width: 140px; + } +} |