@q3assets/auth 0.2.1 → 0.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/src/admin-panel.tsx +8 -8
  3. package/src/login.tsx +14 -14
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@q3assets/auth",
3
- "version": "0.2.1",
3
+ "version": "0.2.3",
4
4
  "exports": {
5
5
  ".": "./src/index.ts",
6
6
  "./login": "./src/login.tsx",
package/src/admin-panel.tsx CHANGED
@@ -114,18 +114,18 @@ export function AdminPanel({ supabase, onClose, apiBase = "/api/admin/users" }:
114
114
 
115
115
  return (
116
116
  <div className="fixed inset-0 z-50 flex justify-end">
117
- <div className="absolute inset-0 bg-black/50" onClick={onClose} />
118
- <div className="relative w-full max-w-lg overflow-y-auto bg-[var(--bg)] border-l border-[var(--border)] shadow-2xl">
119
- <div className="sticky top-0 z-10 flex items-center justify-between border-b border-[var(--border)] bg-[var(--bg)] px-5 py-4">
120
- <h2 className="text-lg font-semibold">Admin</h2>
117
+ <div className="absolute inset-0 bg-black/30" onClick={onClose} />
118
+ <div className="relative w-80 sm:w-96 overflow-y-auto bg-[var(--bg)] border-l border-[var(--border)] shadow-xl">
119
+ <div className="sticky top-0 z-10 flex items-center justify-between border-b border-[var(--border)] bg-[var(--bg)] px-4 py-3">
120
+ <h2 className="text-sm font-semibold">Admin</h2>
121
121
  <button onClick={onClose} className="rounded-lg p-1.5 text-[var(--text-muted)] hover:bg-[var(--bg-card)] hover:text-[var(--text)]">
122
122
  <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><path d="M18 6L6 18M6 6l12 12" /></svg>
123
123
  </button>
124
124
  </div>
125
125
 
126
- <div className="p-5 space-y-6">
127
- <div className="rounded-xl border border-[var(--border)] bg-[var(--bg-card)] p-4">
128
- <h3 className="text-sm font-medium mb-3">Invite User</h3>
126
+ <div className="p-4 space-y-4">
127
+ <div className="rounded-lg border border-[var(--border)] bg-[var(--bg-card)] p-3">
128
+ <h3 className="text-xs font-medium mb-2">Invite User</h3>
129
129
  <form onSubmit={handleInvite} className="space-y-3">
130
130
  <input type="text" value={inviteName} onChange={(e) => setInviteName(e.target.value)} placeholder="Name (required)" required className="w-full rounded-lg border border-[var(--border)] bg-[var(--bg)] px-3 py-2 text-sm text-[var(--text)] placeholder:text-[var(--text-muted)] focus:border-[var(--accent)] focus:outline-none focus:ring-1 focus:ring-[var(--accent)]" />
131
131
  <input type="email" value={inviteEmail} onChange={(e) => setInviteEmail(e.target.value)} placeholder="email@example.com" required className="w-full rounded-lg border border-[var(--border)] bg-[var(--bg)] px-3 py-2 text-sm text-[var(--text)] placeholder:text-[var(--text-muted)] focus:border-[var(--accent)] focus:outline-none focus:ring-1 focus:ring-[var(--accent)]" />
@@ -143,7 +143,7 @@ export function AdminPanel({ supabase, onClose, apiBase = "/api/admin/users" }:
143
143
  </div>
144
144
 
145
145
  <div>
146
- <h3 className="text-sm font-medium mb-3">Users ({users.length})</h3>
146
+ <h3 className="text-xs font-medium mb-2">Users ({users.length})</h3>
147
147
  {error && <p className="mb-3 text-sm text-[var(--danger)]">{error}</p>}
148
148
  {loading ? (
149
149
  <p className="text-sm text-[var(--text-muted)]">Loading...</p>
package/src/login.tsx CHANGED
@@ -47,16 +47,16 @@ export function Login({
47
47
 
48
48
  return (
49
49
  <div className="flex min-h-screen items-center justify-center px-4">
50
- <div className="w-full max-w-sm">
51
- <div className="mb-8 text-center">
52
- <h1 className="text-2xl font-bold tracking-tight">{title}</h1>
53
- <p className="mt-2 text-sm text-[var(--text-muted)]">{subtitle}</p>
50
+ <div className="w-full max-w-xs">
51
+ <div className="mb-5 text-center">
52
+ <h1 className="text-lg font-semibold tracking-tight">{title}</h1>
53
+ <p className="mt-1 text-xs text-[var(--text-muted)]">{subtitle}</p>
54
54
  </div>
55
55
 
56
- <div className="rounded-xl border border-[var(--border)] bg-[var(--bg-card)] p-6">
56
+ <div className="rounded-lg border border-[var(--border)] bg-[var(--bg-card)] p-4">
57
57
  {!sent ? (
58
58
  <form onSubmit={handleSubmit}>
59
- <label className="block text-sm font-medium text-[var(--text-muted)] mb-2">
59
+ <label className="block text-xs font-medium text-[var(--text-muted)] mb-1.5">
60
60
  Email address
61
61
  </label>
62
62
  <input
@@ -66,28 +66,28 @@ export function Login({
66
66
  placeholder="you@example.com"
67
67
  required
68
68
  autoFocus
69
- className="w-full rounded-lg border border-[var(--border)] bg-[var(--bg)] px-3 py-2.5 text-sm text-[var(--text)] placeholder:text-[var(--text-muted)] focus:border-[var(--accent)] focus:outline-none focus:ring-1 focus:ring-[var(--accent)]"
69
+ className="w-full rounded-md border border-[var(--border)] bg-[var(--bg)] px-3 py-2 text-sm text-[var(--text)] placeholder:text-[var(--text-muted)] focus:border-[var(--accent)] focus:outline-none focus:ring-1 focus:ring-[var(--accent)]"
70
70
  />
71
71
  {error && (
72
- <p className="mt-3 text-sm text-red-400">{error}</p>
72
+ <p className="mt-2 text-xs text-red-400">{error}</p>
73
73
  )}
74
74
  <button
75
75
  type="submit"
76
76
  disabled={loading}
77
- className="mt-4 w-full rounded-lg bg-[var(--accent)] px-4 py-2.5 text-sm font-medium text-white transition-colors hover:bg-[var(--accent-light)] disabled:opacity-50"
77
+ className="mt-3 w-full rounded-md bg-[var(--accent)] px-3 py-2 text-sm font-medium text-white transition-colors hover:bg-[var(--accent-light)] disabled:opacity-50"
78
78
  >
79
79
  {loading ? "Sending..." : "Send login link"}
80
80
  </button>
81
81
  </form>
82
82
  ) : (
83
- <div className="text-center">
84
- <p className="text-sm text-[var(--text-muted)]">
83
+ <div className="text-center py-1">
84
+ <p className="text-xs text-[var(--text-muted)]">
85
85
  Check your email for a login link.
86
86
  </p>
87
- <p className="mt-2 text-sm font-medium text-[var(--text)]">{email}</p>
87
+ <p className="mt-1.5 text-sm font-medium text-[var(--text)]">{email}</p>
88
88
  <button
89
89
  onClick={() => { setSent(false); setEmail(""); setError(null) }}
90
- className="mt-4 text-sm text-[var(--text-muted)] hover:text-[var(--text)]"
90
+ className="mt-3 text-xs text-[var(--text-muted)] hover:text-[var(--text)]"
91
91
  >
92
92
  Send to a different email
93
93
  </button>
@@ -95,7 +95,7 @@ export function Login({
95
95
  )}
96
96
  </div>
97
97
 
98
- <p className="mt-6 text-center text-xs text-[var(--text-muted)]">{footer}</p>
98
+ <p className="mt-4 text-center text-[10px] text-[var(--text-muted)]">{footer}</p>
99
99
  </div>
100
100
  </div>
101
101
  )