feat: basic chat

templates/nostrmarket/index.html

@@ -101,7 +101,6 @@
   </div>
 
   <div class="col-12 col-md-5 q-gutter-y-md">
-    <!-- <div class="row q-col-gutter-md"> -->
     <div class="col-12">
       <q-card>
         <q-card-section>
@@ -115,7 +114,13 @@
         </q-card-section>
       </q-card>
     </div>
-    <div class="col-12">x111</div>
+    <div class="col-12">
+      <direct-messages
+        :inkey="g.user.wallets[0].inkey"
+        :adminkey="g.user.wallets[0].adminkey"
+      >
+      </direct-messages>
+    </div>
   </div>
 
   <div>
@@ -146,6 +151,43 @@
   </div>
 </div>
 {% endblock%}{% block scripts %} {{ window_vars(user) }}
+
+
+<style scoped>
+  .q-field__native span {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+  .chat-container {
+    position: relative;
+    display: grid;
+    grid-template-rows: 1fr auto;
+    /*height: calc(100vh - 200px);*/
+    height: 50vh;
+  }
+
+  .chat-box {
+    display: flex;
+    flex-direction: column-reverse;
+    padding: 1rem;
+    overflow-y: auto;
+    margin-left: auto;
+    width: 50%;
+  }
+
+  .chat-messages {
+    width: auto;
+  }
+
+  .chat-input {
+    position: relative;
+    display: flex;
+    align-items: end;
+    margin-top: 1rem;
+  }
+</style>
+
 <!-- todo: serve locally -->
 <script src="https://unpkg.com/nostr-tools/lib/nostr.bundle.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/pica@6.1.1/dist/pica.min.js"></script>
@@ -159,4 +201,5 @@
 <script src="{{ url_for('nostrmarket_static', path='components/direct-messages/direct-messages.js') }}"></script>
 <script src="{{ url_for('nostrmarket_static', path='js/index.js') }}"></script>
 
+
 {% endblock %}