ayanova/src/views/home-search.vue

@@ -32,6 +32,7 @@
               >
                 <v-icon>fa-search</v-icon>
               </v-btn>
+              {{ $vuetify.breakpoint.name }}
             </v-col>
 
             <v-col cols="12">
@@ -57,9 +58,9 @@
                           @click="openItem(item)"
                           v-text="item.name"
                         ></v-list-item-title>
-                        <v-list-item-subtitle>{{
-                          item.info
-                        }}</v-list-item-subtitle>
+                        <v-list-item-subtitle
+                          v-html="item.info"
+                        ></v-list-item-subtitle>
                       </v-list-item-content>
                       <v-list-item-action>
                         <v-btn icon @click="getExcerpt(item)">
@@ -173,6 +174,28 @@ export default {
       if (item.info || item.id == 0) {
         return;
       }
+
+      let max = 40;
+      switch (vm.$vuetify.breakpoint.name) {
+        case "xs":
+          max = 30;
+          break;
+        case "sm":
+          max = 67;
+          break;
+        case "md":
+          max = 78;
+          break;
+        case "lg":
+          max = 120;
+          break;
+        case "xl":
+          max = 120;
+          break;
+        default:
+          max = 40;
+      }
+
       window.$gz.api
         .get(
           API_BASE_URL +
@@ -181,7 +204,9 @@ export default {
             "/" +
             item.id +
             "?phrase=" +
-            vm.searchPhrase
+            vm.searchPhrase +
+            "&max=" +
+            max
         )
         .then(res => {
           if (res.error != undefined) {
@@ -191,12 +216,19 @@ export default {
             //Aya<span class="v-list-item__mask">Nov</span>
             // <v-list-item-subtitle v-html="item.subtitle"></v-list-item-subtitle>
             //subtitle: "<span class='text--primary'>to Alex, Scott, Jennifer</span> &mdash; Wish I could come, but I'm out of town this weekend.",
+            let showInfo = res.data;
             let searchTerms = vm.searchPhrase
               .toLocaleLowerCase()
               .replace(/[*]/gi, "")
               .split(" ");
-            console.log("SearchTerms", searchTerms);
-            item.info = res.data;
+            for (let i = 0; i < searchTerms.length; i++) {
+              showInfo = showInfo.replace(
+                searchTerms[i],
+                "<span class='v-list-item__mask'>" + searchTerms[i] + "</span>"
+              );
+            }
+
+            item.info = showInfo;
           }
         })
         .catch(function handleGetDataFromAPIError(error) {