password strength report change, added meter to account page

src/components/Bars.tsx

@@ -540,7 +540,7 @@ export function LeftBar() {
           {/* Navigation Links */}
           <div class="mt-auto">
             <Typewriter keepAlive={false}>
-              <ul class="flex flex-col gap-4 py-6">
+              <ul class="flex flex-col gap-4 pt-6">
                 <li class="hover:text-subtext0 w-fit transition-transform duration-200 ease-in-out hover:-translate-y-0.5 hover:scale-110 hover:font-bold">
                   <a href="/" onClick={handleLinkClick}>
                     Home
@@ -592,7 +592,7 @@ export function LeftBar() {
             </Typewriter>
 
             {/* Get Lost button - outside Typewriter to allow glitch effect */}
-            <ul class="flex flex-col gap-4 pb-6">
+            <ul class="pt-4 pb-6">
               <li
                 class="hover:text-subtext0 w-fit transition-all duration-500 ease-in-out hover:-translate-y-0.5 hover:scale-110 hover:font-bold"
                 classList={{

src/components/PasswordStrengthMeter.tsx

@@ -1,5 +1,5 @@
 import { createMemo, For, Show } from "solid-js";
-import { validatePassword, type PasswordStrength } from "~/lib/validation";
+import { validatePassword } from "~/lib/validation";
 import { VALIDATION_CONFIG } from "~/config";
 import CheckCircle from "./icons/CheckCircle";
 
@@ -86,7 +86,7 @@ export default function PasswordStrengthMeter(
       {/* Strength bar */}
       <Show when={props.password.length > 0}>
         <div class="space-y-1">
-          <div class="bg-surface h-2 w-full overflow-hidden rounded-full">
+          <div class="bg-surface border-yellow h-2 w-full overflow-hidden rounded-full border">
             <div
               class={`${config().color} h-full transition-all duration-300 ease-out`}
               style={{ width: config().width }}