g

static/index.html

@@ -138,6 +138,9 @@
 
       <div class="chat-input-wrapper">
         <form id="message-form" class="message-form">
+          <button type="button" id="gif-btn" class="input-action-btn" title="Open GIF Picker">
+            <i data-lucide="image"></i>
+          </button>
           <input id="message-body" autocomplete="off" placeholder="Message #channel" maxlength="4000" required />
           <button type="submit" class="hidden"></button>
         </form>
@@ -157,6 +160,24 @@
   <div id="overlay" class="overlay hidden"></div>
 
   <!-- Modals -->
+  <div id="gif-picker" class="modal-container hidden">
+    <div class="modal gif-modal">
+      <div class="modal-header">
+        <h2>Select GIF</h2>
+        <button type="button" class="close-btn" id="gif-picker-close">
+          <i data-lucide="x"></i>
+        </button>
+      </div>
+      <div class="gif-search-wrapper">
+        <input type="text" id="gif-search-input" placeholder="Search for GIFs..." autocomplete="off">
+        <i data-lucide="search" class="search-icon"></i>
+      </div>
+      <div id="gif-results" class="gif-results-grid">
+        <!-- GIF results will be injected here -->
+        <div class="gif-loading hidden">Loading...</div>
+      </div>
+    </div>
+  </div>
   <div id="modal-container" class="modal-container hidden">
     <div class="modal">
       <h2 id="modal-title">Create Server</h2>