ui(extension): Use shadcn and better dark mode support

1 files changed, 6 insertions, 3 deletions

diff --git a/apps/browser-extension/src/OptionsPage.tsx b/apps/browser-extension/src/OptionsPage.tsx
index 24785857..41b72178 100644
--- a/apps/browser-extension/src/OptionsPage.tsx
+++ b/apps/browser-extension/src/OptionsPage.tsx
@@ -1,6 +1,7 @@
 import React, { useEffect } from "react";
 import { useNavigate } from "react-router-dom";
 
+import { Button } from "./components/ui/button";
 import Logo from "./Logo";
 import Spinner from "./Spinner";
 import usePluginSettings from "./utils/settings";
@@ -55,12 +56,14 @@ export default function OptionsPage() {
       <span className="text-lg">Settings</span>
       <hr />
       <div className="flex gap-2">
+        <span className="my-auto">Server Address:</span>
+        {settings.address}
+      </div>
+      <div className="flex gap-2">
         <span className="my-auto">Logged in as:</span>
         {loggedInMessage}
       </div>
-      <button className="rounded-lg border border-gray-200" onClick={onLogout}>
-        Logout
-      </button>
+      <Button onClick={onLogout}>Logout</Button>
     </div>
   );
 }