chore: improving

static/components/customer-market/customer-market.html

@@ -2,17 +2,6 @@
   <div v-if="searchNostr" class="row q-col-gutter-md">
     <div class="col-12 q-gutter-y-md">
       <q-card>
-        <!-- <q-card-section class="row items-center q-pb-none">
-          <div class="text-h6">Search Globally</div>
-          <q-space />
-          <q-btn
-            icon="close"
-            flat
-            round
-            dense
-            @click="searchNostr = !searchNostr"
-          />
-        </q-card-section> -->
         <q-card-section>
           <div class="row items-center no-wrap q-mb-md">
             <div class="col">

static/js/market.js

@@ -48,7 +48,7 @@ const market = async () => {
           }
         },
         searchNostr: false,
-        drawer: false,
+        drawer: true,
         pubkeys: new Set(),
         relays: new Set(),
         events: [],

templates/nostrmarket/market.html

@@ -1,5 +1,12 @@
 {% extends "public.html" %} {% block page %}
 <q-layout view="hHh Lpr lff">
+  <q-header reveal bordered class="bg-marginal-bg">
+    <q-toolbar>
+      <q-btn flat @click="drawerLeft = !drawerLeft" round dense icon="menu" />
+      <q-toolbar-title>Header</q-toolbar-title>
+      <q-btn flat @click="drawerRight = !drawerRight" round dense icon="menu" />
+    </q-toolbar>
+  </q-header>
   <q-drawer v-model="drawer" side="left">
     <q-toolbar class="bg-primary text-white shadow-2">
       <q-toolbar-title>Settings</q-toolbar-title>
@@ -145,27 +152,32 @@
       </q-list>
     </div>
   </q-drawer>
+  <q-drawer v-model="drawer" side="right"></q-drawer>
   <q-page-container>
     <div class="row q-mb-md">
-      <div class="col-12 q-gutter-y-md">
+      <!-- <q-toolbar class="col-2">
-        <q-toolbar>
+        <q-btn flat round dense icon="menu" @click="drawer = !drawer"></q-btn>
-          <q-btn flat round dense icon="menu" @click="drawer = !drawer"></q-btn>
+      </q-toolbar> -->
-          {%raw%}
+      <q-toolbar class="col-lg-9 col-md-8 col-sm-6 auto-width">
-          <q-toolbar-title style="text-transform: capitalize">
+        <q-input class="rounded-pill" style="width:100%;" rounded outlined clearable v-model.trim="searchText"
-            {{ activePage }}
+          label="Filter products">
-          </q-toolbar-title>
+          <template v-slot:append>
-          {%endraw%}
+            <q-icon v-if="!searchText" name="search" />
-          <q-space></q-space>
+          </template>
-          <q-btn v-if="!activeStall" color="primary" label="Search" icon="travel_explore"
+        </q-input>
-            @click="searchNostr = !searchNostr"><q-tooltip>Search for products on Nostr</q-tooltip></q-btn>
+      </q-toolbar>
-          <q-input class="q-ml-md" standout square dense outlined clearable v-model.trim="searchText"
+      <q-toolbar class="col-lg-3 col-md-4 col-sm-6">
-            label="Filter products">
+        <div class="float-right">
-            <template v-slot:append>
+          <q-btn color="gray" icon="travel_explore" flat size="lg" @click="searchNostr = !searchNostr"><q-tooltip>Search
-              <q-icon v-if="!searchText" name="search" />
+              for products on Nostr</q-tooltip></q-btn>
-            </template>
+          <q-btn color="gray" icon="perm_identity" flat size="lg" @click="searchNostr = !searchNostr"><q-tooltip>User
-          </q-input>
+              Config</q-tooltip></q-btn>
-        </q-toolbar>
+          <q-btn color="gray" icon="shopping_cart" flat size="lg"
-      </div>
+            @click="searchNostr = !searchNostr"><q-tooltip>Shopping
+              Cart</q-tooltip></q-btn>
+        </div>
+      </q-toolbar>
+
     </div>
     <customer-stall v-if="!isLoading && activeStall" :stall="stalls.find(stall => stall.id == activeStall)"
       :products="filterProducts" :stall-products="products.filter(p => p.stall_id == activeStall)"