ui fixes

src/lib/components/LoginPopup.svelte

@@ -158,16 +158,31 @@ const output = await response.json();
   ></label>
 
   <div
-    class="modal-box w-full bg-table border border-gray-600 rounded-none sm:rounded {$screenWidth <
+    class="modal-box w-full bg-table sm:border sm:border-gray-600 rounded-none sm:rounded {$screenWidth <
     640
       ? 'min-h-screen'
       : ''}"
   >
     <label
       for="userLogin"
-      class="cursor-pointer absolute right-5 top-2 text-xl text-white"
+      class="cursor-pointer absolute right-3 top-2 text-xl text-white"
+    >
+      <svg
+        class="h-8 w-8"
+        viewBox="0 -0.5 25 25"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        ><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g
+          id="SVGRepo_tracerCarrier"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        ></g><g id="SVGRepo_iconCarrier">
+          <path
+            d="M6.96967 16.4697C6.67678 16.7626 6.67678 17.2374 6.96967 17.5303C7.26256 17.8232 7.73744 17.8232 8.03033 17.5303L6.96967 16.4697ZM13.0303 12.5303C13.3232 12.2374 13.3232 11.7626 13.0303 11.4697C12.7374 11.1768 12.2626 11.1768 11.9697 11.4697L13.0303 12.5303ZM11.9697 11.4697C11.6768 11.7626 11.6768 12.2374 11.9697 12.5303C12.2626 12.8232 12.7374 12.8232 13.0303 12.5303L11.9697 11.4697ZM18.0303 7.53033C18.3232 7.23744 18.3232 6.76256 18.0303 6.46967C17.7374 6.17678 17.2626 6.17678 16.9697 6.46967L18.0303 7.53033ZM13.0303 11.4697C12.7374 11.1768 12.2626 11.1768 11.9697 11.4697C11.6768 11.7626 11.6768 12.2374 11.9697 12.5303L13.0303 11.4697ZM16.9697 17.5303C17.2626 17.8232 17.7374 17.8232 18.0303 17.5303C18.3232 17.2374 18.3232 16.7626 18.0303 16.4697L16.9697 17.5303ZM11.9697 12.5303C12.2626 12.8232 12.7374 12.8232 13.0303 12.5303C13.3232 12.2374 13.3232 11.7626 13.0303 11.4697L11.9697 12.5303ZM8.03033 6.46967C7.73744 6.17678 7.26256 6.17678 6.96967 6.46967C6.67678 6.76256 6.67678 7.23744 6.96967 7.53033L8.03033 6.46967ZM8.03033 17.5303L13.0303 12.5303L11.9697 11.4697L6.96967 16.4697L8.03033 17.5303ZM13.0303 12.5303L18.0303 7.53033L16.9697 6.46967L11.9697 11.4697L13.0303 12.5303ZM11.9697 12.5303L16.9697 17.5303L18.0303 16.4697L13.0303 11.4697L11.9697 12.5303ZM13.0303 11.4697L8.03033 6.46967L6.96967 7.53033L11.9697 12.5303L13.0303 11.4697Z"
+            fill="#fff"
+          ></path>
+        </g></svg
       >
-      ✕
     </label>
 
     {#if displaySection === "login"}

src/routes/potus-tracker/+page.svelte

@@ -120,7 +120,8 @@
             <h2
               class="text-white text-[1rem] sm:text-xl font-semibold mb-2 mt-4"
             >
-              The President is in {(data?.getData?.city === "Washington"
+              The President is in {(data?.getData?.city === "Washington" ||
+              data?.getData?.city === null
                 ? "the White House"
                 : data?.getData?.city) ?? "n/a"}
             </h2>
@@ -132,33 +133,13 @@
               Map data © OpenStreetMap
             </span>
 
-            <nav
-              class=" border-b-[2px] whitespace-nowrap mt-10 sm:mt-6 overflow-hidden"
-            >
-              <ul
-                class="flex flex-row items-center w-full text-[1rem] text-white"
-              >
-                {#each tabs as item, i}
-                  <button
-                    on:click={() => (activeIdx = i)}
-                    class="p-2 px-5 cursor-pointer {activeIdx === i
-                      ? 'text-white bg-primary sm:hover:bg-opacity-[0.95] font-semibold'
-                      : 'text-gray-400 sm:hover:text-white sm:hover:bg-primary sm:hover:bg-opacity-[0.95]'}"
-                  >
-                    {item.title}
-                  </button>
-                {/each}
-              </ul>
-            </nav>
-
-            {#if activeIdx === 0}
             <h3
               class="text-white text-lg sm:text-xl font-semibold mb-2 mt-6 border-y border-gray-800 pt-2 pb-2"
             >
               Official Presidential Schedule
             </h3>
             <div
-                class="max-h-[600px] bg-[#1F1F1F] overflow-y-auto border border-gray-800 rounded-md p-4 no-scrollbar"
+              class="max-h-[600px] overflow-y-auto border border-gray-800 rounded-md p-4 no-scrollbar"
             >
               <div class="space-y-4">
                 {#each Object.entries(groupedByDate) as [date, items], indexA}
@@ -166,9 +147,7 @@
                     <div
                       class="border-b border-gray-200 pb-2 w-full flex flex-row items-center justify-between"
                     >
-                        <span
+                      <span class="text-[1rem] font-semibold text-white">
-                          class="text-[1rem] sm:text-lg font-semibold text-white"
-                        >
                         {date}</span
                       >
                       {#if items?.at(0)?.changesPercentage}
@@ -229,7 +208,7 @@
                             {/if}
                           </div>
 
-                            <span class="text-sm sm:text-[1rem] text-gray-400">
+                          <span class="text-sm text-gray-400">
                             {item.time_formatted}
                             {item.location !== null
                               ? `- ${item?.location}`
@@ -237,7 +216,7 @@
                           </span>
                         </div>
 
-                          <span class="text-sm sm:text-[1rem] ml-7">
+                        <span class="text-sm ml-7">
                           {item.details}
                         </span>
                       </div>
@@ -246,14 +225,16 @@
                 {/each}
               </div>
             </div>
-            {:else}
+          </div>
-              <h3
+
-                class="text-white text-lg sm:text-xl font-semibold mb-2 mt-6 border-y border-gray-800 pt-2 pb-2"
+          <div
+            class="order-4 flex-shrink-0 lg:float-right lg:w-[336px] no-scrollbar overflow-y-auto"
           >
-                AI Executive Orders Analysis
+            <h3 class="text-white text-lg sm:text-xl font-semibold mb-2 mt-6">
+              Executive Actions
             </h3>
             <div
-                class="max-h-[600px] bg-[#1F1F1F] overflow-y-auto border border-gray-800 rounded-md p-4 no-scrollbar"
+              class="max-h-[600px] overflow-y-auto border border-gray-800 rounded-md p-4 no-scrollbar"
             >
               <div class="space-y-4">
                 {#each Object.entries(groupedOrders) as [date, items], indexA}
@@ -446,66 +427,6 @@
                 {/each}
               </div>
             </div>
-            {/if}
-          </div>
-
-          <div class="order-4 flex-shrink-0 lg:float-right lg:w-[336px]">
-            <div
-              class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
-            >
-              <a
-                href={`/newsletter`}
-                class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
-              >
-                <div class="w-full flex justify-between items-center p-3 mt-3">
-                  <h2 class="text-start text-xl font-semibold text-white ml-3">
-                    Market Newsletter
-                  </h2>
-                  <ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
-                </div>
-                <span class="text-white p-3 ml-3 mr-3">
-                  Get a daily email with the top market news in bullet point
-                  format.
-                </span>
-              </a>
-            </div>
-
-            <div
-              class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
-            >
-              <a
-                href={"/stock-screener"}
-                class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
-              >
-                <div class="w-full flex justify-between items-center p-3 mt-3">
-                  <h2 class="text-start text-xl font-semibold text-white ml-3">
-                    Stock Screener
-                  </h2>
-                  <ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
-                </div>
-                <span class="text-white p-3 ml-3 mr-3">
-                  Build your Stock Screener to find profitable stocks.
-                </span>
-              </a>
-            </div>
-            <div
-              class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
-            >
-              <a
-                href={"/watchlist/stocks"}
-                class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
-              >
-                <div class="w-full flex justify-between items-center p-3 mt-3">
-                  <h2 class="text-start text-xl font-semibold text-white ml-3">
-                    Watchlist
-                  </h2>
-                  <ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
-                </div>
-                <span class="text-white p-3 ml-3 mr-3">
-                  Keep track of your favorite stocks in real-time.
-                </span>
-              </a>
-            </div>
           </div>
         </div>
       </div>