improve practice tags appearance

pages/structures/_id.vue

@@ -53,11 +53,19 @@
 
       <v-row>
         <v-col cols="12">
-          <v-chip-group v-if="structure.practices" :max="0" active-class="primary--text" class="justify-center">
-            <v-chip v-for="practice in structure.practices" :key="practice">
+          <div
+            v-if="structure.practices"
+            class="d-flex justify-center flex-wrap"
+          >
+            <v-chip
+              v-for="practice in structure.practices"
+              :key="practice"
+              class="ma-1"
+              label
+            >
               {{ $t(practice) }}
             </v-chip>
-          </v-chip-group>
+          </div>
         </v-col>
       </v-row>
 

pages/structures/index.vue

@@ -252,17 +252,21 @@
                       </v-card-text>
                     </div>
 
-                    <v-chip-group
+                    <div
                       v-if="structure.practices"
-                      column
-                      active-class="primary--text"
-                      class="d-flex flex-row align-start"
+                      class="d-grid flex-wrap"
                       :style="listview ? 'width: 25%;min-width: 25%;' : ''"
                     >
-                      <v-chip v-for="practice in structure.practices" :key="practice" outlined small pill>
+                      <v-chip
+                        v-for="practice in structure.practices"
+                        :key="practice"
+                        class="ma-1"
+                        label
+                        small
+                      >
                         {{ $t(practice) }}
                       </v-chip>
-                    </v-chip-group>
+                    </div>
 
                     <span v-if="mapview" class="flex-fill" />