From ecfcf0918467c2be4e692786a38518211d1b2964 Mon Sep 17 00:00:00 2001
From: Keith Holliday <krh121791@yahoo.com>
Date: Mon, 22 Jan 2018 08:20:34 -0700
Subject: [PATCH] Added more responsive styles to filters (#9820)

---
 .../group-plans/taskInformation.vue           | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/website/client/components/group-plans/taskInformation.vue b/website/client/components/group-plans/taskInformation.vue
index d3a1753a5c..6464bab0b5 100644
--- a/website/client/components/group-plans/taskInformation.vue
+++ b/website/client/components/group-plans/taskInformation.vue
@@ -1,29 +1,29 @@
 <template lang="pug">
 .standard-page
   .row.tasks-navigation
-    .col-4
+    .col-12.col-md-4
       h1 Group's Tasks
     // @TODO: Abstract to component!
-    .col-4
+    .col-12.col-md-4
       .input-group
         input.form-control.input-search(type="text", :placeholder="$t('search')", v-model="searchText")
         .filter-panel(v-if="isFilterPanelOpen")
-          .tags-category.d-flex(v-for="tagsType in tagsByType", v-if="tagsType.tags.length > 0", :key="tagsType.key")
-            .tags-header
+          .tags-category(v-for="tagsType in tagsByType", v-if="tagsType.tags.length > 0", :key="tagsType.key")
+            .tags-header.col-12
               strong(v-once) {{ $t(tagsType.key) }}
               a.d-block(v-if="tagsType.key === 'tags' && !editingTags", @click="editTags()") {{ $t('editTags2') }}
-            .tags-list.container
+            .tags-list.container.col-12
               .row(:class="{'no-gutters': !editingTags}")
                 template(v-if="editingTags && tagsType.key === 'tags'")
-                  .col-6(v-for="(tag, tagIndex) in tagsSnap")
+                  .col-12.col-md-6(v-for="(tag, tagIndex) in tagsSnap")
                     .inline-edit-input-group.tag-edit-item.input-group
                       input.tag-edit-input.inline-edit-input.form-control(type="text", :value="tag.name")
                       .input-group-append(@click="removeTag(tagIndex)")
                         .svg-icon.destroy-icon(v-html="icons.destroy")
-                  .col-6
+                  .col-12.col-md-6
                     input.new-tag-item.edit-tag-item.inline-edit-input.form-control(type="text", :placeholder="$t('newTag')", @keydown.enter="addTag($event)", v-model="newTag")
                 template(v-else)
-                  .col-6(v-for="(tag, tagIndex) in tagsType.tags")
+                  .col-12.col-md-6(v-for="(tag, tagIndex) in tagsType.tags")
                     .custom-control.custom-checkbox
                       input.custom-control-input(
                         type="checkbox",
@@ -53,7 +53,7 @@
             .d-flex.align-items-center
               span(v-once) {{ $t('filter') }}
               .svg-icon.filter-icon(v-html="icons.filter")
-    #create-dropdown.col-1.offset-3
+    #create-dropdown.col-12.col-md-1.offset-md-3
       b-dropdown(:right="true", :variant="'success'")
         div(slot="button-content")
           .svg-icon.positive(v-html="icons.positive")
@@ -138,6 +138,7 @@
     padding-left: 24px;
     padding-right: 24px;
     max-width: 40vw;
+    width: 100%;
     z-index: 9999;
     background: $white;
     border-radius: 2px;