icons everywhere, also finalized checkout form

1 files changed, 10 insertions, 4 deletions

diff --git a/iridescence/src/components/ProductSearch.vue b/iridescence/src/components/ProductSearch.vue
index 0cf8cf2..2a7a2e3 100644
--- a/iridescence/src/components/ProductSearch.vue
+++ b/iridescence/src/components/ProductSearch.vue
@@ -1,24 +1,30 @@
 <template>
   <div id="productSearch">
     <div class="field is-grouped is-grouped-multiline">
-      <div class="control is-expanded">
+      <div class="control is-expanded has-icons-left">
         <input
-          class="input is-primary is-medium"
+          class="input is-medium is-primary is-rounded"
           type="text"
           placeholder="Find something in particular..."
           v-model.trim="term"
           @input="updateSearch"
           autofocus
         />
+        <span class="icon is-left">
+          <span class="iconify-inline" data-icon="mdi-magnify"></span>
+        </span>
       </div>
-      <div class="control">
-        <div class="select is-primary is-medium">
+      <div class="control has-icons-left">
+        <div class="select is-medium is-primary is-rounded">
           <select v-model="sortOptionName" @change="updateSort">
             <option v-for="name in sortOptionNames" :key="name" :value="name">
               {{ name }}
             </option>
           </select>
         </div>
+        <span class="icon is-left">
+          <span class="iconify-inline" data-icon="mdi-sort"></span>
+        </span>
       </div>
     </div>
     <content class="has-text-centered" v-if="noResults">