@actuate-media/cms-admin 0.9.0 → 0.11.0

package/src/views/ResetPassword.tsx

@@ -19,29 +19,29 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
 
   if (!token) {
     return (
-      <div className="min-h-screen flex items-center justify-center bg-gray-50 px-4">
+      <div className="flex min-h-screen items-center justify-center bg-gray-50 px-4">
         <div className="w-full max-w-md">
-          <div className="text-center mb-8">
-            <div className="mx-auto mb-4 w-14 h-14 bg-red-100 rounded-xl flex items-center justify-center">
-              <XCircle className="w-7 h-7 text-red-600" />
+          <div className="mb-8 text-center">
+            <div className="mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-xl bg-red-100">
+              <XCircle className="h-7 w-7 text-red-600" />
             </div>
             <h1 className="text-2xl font-bold text-gray-900">Invalid Reset Link</h1>
-            <p className="text-gray-600 mt-2">
+            <p className="mt-2 text-gray-600">
               This password reset link is invalid or has expired.
             </p>
           </div>
-          <div className="bg-white rounded-xl border border-gray-200 p-6 shadow-sm text-center space-y-4">
+          <div className="space-y-4 rounded-xl border border-gray-200 bg-white p-6 text-center shadow-sm">
             <button
               type="button"
               onClick={() => onNavigate('/forgot-password')}
-              className="w-full py-2.5 bg-blue-600 text-white rounded-lg font-medium hover:bg-blue-700 transition-colors"
+              className="w-full rounded-lg bg-blue-600 py-2.5 font-medium text-white transition-colors hover:bg-blue-700"
             >
               Request New Reset Link
             </button>
             <button
               type="button"
               onClick={() => onNavigate('/login')}
-              className="w-full text-sm text-gray-600 hover:text-gray-800 transition-colors"
+              className="w-full text-sm text-gray-600 transition-colors hover:text-gray-800"
             >
               Back to Sign In
             </button>
@@ -81,25 +81,25 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
   }
 
   return (
-    <div className="min-h-screen flex items-center justify-center bg-gray-50 px-4">
+    <div className="flex min-h-screen items-center justify-center bg-gray-50 px-4">
       <div className="w-full max-w-md">
-        <div className="text-center mb-8">
-          <div className="mx-auto mb-4 w-14 h-14 bg-blue-600 rounded-xl flex items-center justify-center">
-            <Shield className="w-7 h-7 text-white" />
+        <div className="mb-8 text-center">
+          <div className="mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-xl bg-blue-600">
+            <Shield className="h-7 w-7 text-white" />
           </div>
           <h1 className="text-2xl font-bold text-gray-900">
             {success ? 'Password Reset' : 'Choose New Password'}
           </h1>
-          <p className="text-gray-600 mt-2">
+          <p className="mt-2 text-gray-600">
             {success ? 'Your password has been updated' : 'Enter your new password below'}
           </p>
         </div>
 
-        <div className="bg-white rounded-xl border border-gray-200 p-6 shadow-sm space-y-5">
+        <div className="space-y-5 rounded-xl border border-gray-200 bg-white p-6 shadow-sm">
           {success ? (
-            <div className="text-center space-y-4">
-              <div className="mx-auto w-12 h-12 bg-green-100 rounded-full flex items-center justify-center">
-                <CheckCircle2 className="w-6 h-6 text-green-600" />
+            <div className="space-y-4 text-center">
+              <div className="mx-auto flex h-12 w-12 items-center justify-center rounded-full bg-green-100">
+                <CheckCircle2 className="h-6 w-6 text-green-600" />
               </div>
               <p className="text-sm text-gray-600">
                 Your password has been successfully reset. All existing sessions have been revoked
@@ -108,7 +108,7 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
               <button
                 type="button"
                 onClick={() => onNavigate('/login')}
-                className="w-full py-2.5 bg-blue-600 text-white rounded-lg font-medium hover:bg-blue-700 transition-colors"
+                className="w-full rounded-lg bg-blue-600 py-2.5 font-medium text-white transition-colors hover:bg-blue-700"
               >
                 Sign In with New Password
               </button>
@@ -116,8 +116,8 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
           ) : (
             <form onSubmit={handleSubmit} className="space-y-5">
               {error && (
-                <div className="flex items-start gap-3 p-3 bg-red-50 border border-red-200 rounded-lg">
-                  <AlertTriangle className="w-5 h-5 text-red-600 mt-0.5 shrink-0" />
+                <div className="flex items-start gap-3 rounded-lg border border-red-200 bg-red-50 p-3">
+                  <AlertTriangle className="mt-0.5 h-5 w-5 shrink-0 text-red-600" />
                   <p className="text-sm text-red-800">{error}</p>
                 </div>
               )}
@@ -125,7 +125,7 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
               <div>
                 <label
                   htmlFor="reset-password"
-                  className="block text-sm font-medium text-gray-700 mb-1.5"
+                  className="mb-1.5 block text-sm font-medium text-gray-700"
                 >
                   New Password
                 </label>
@@ -136,7 +136,7 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
                     value={password}
                     onChange={(e) => setPassword(e.target.value)}
                     placeholder="Enter new password"
-                    className="w-full px-3 py-2.5 pr-10 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+                    className="w-full rounded-lg border border-gray-300 px-3 py-2.5 pr-10 text-sm focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none"
                     required
                     autoFocus
                     autoComplete="new-password"
@@ -145,10 +145,10 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
                   <button
                     type="button"
                     onClick={() => setShowPassword(!showPassword)}
-                    className="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600"
+                    className="absolute top-1/2 right-3 -translate-y-1/2 text-gray-400 hover:text-gray-600"
                     tabIndex={-1}
                   >
-                    {showPassword ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
+                    {showPassword ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
                   </button>
                 </div>
                 {password && !meetsLength && (
@@ -161,7 +161,7 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
               <div>
                 <label
                   htmlFor="reset-confirm"
-                  className="block text-sm font-medium text-gray-700 mb-1.5"
+                  className="mb-1.5 block text-sm font-medium text-gray-700"
                 >
                   Confirm Password
                 </label>
@@ -171,7 +171,7 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
                   value={confirmPassword}
                   onChange={(e) => setConfirmPassword(e.target.value)}
                   placeholder="Confirm new password"
-                  className="w-full px-3 py-2.5 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+                  className="w-full rounded-lg border border-gray-300 px-3 py-2.5 text-sm focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none"
                   required
                   autoComplete="new-password"
                 />
@@ -183,11 +183,11 @@ export function ResetPassword({ onNavigate, token }: ResetPasswordProps) {
               <button
                 type="submit"
                 disabled={!canSubmit}
-                className="w-full py-2.5 bg-blue-600 text-white rounded-lg font-medium hover:bg-blue-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2"
+                className="flex w-full items-center justify-center gap-2 rounded-lg bg-blue-600 py-2.5 font-medium text-white transition-colors hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-50"
               >
                 {submitting ? (
                   <>
-                    <Loader2 className="w-4 h-4 animate-spin" />
+                    <Loader2 className="h-4 w-4 animate-spin" />
                     Resetting...
                   </>
                 ) : (