sidney
/
microtecflix
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add password show/hide eye toggle and remove admin quick login option from portal login
Build and Deploy (Gitea) / build-and-deploy (push) Successful in 1m17s Details

This commit is contained in:
Sidney Gomes 2026-07-23 10:58:38 -03:00
parent a66391e925
commit 8a5427402f
1 changed files with 31 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
src/App.tsx
View File

@ -1,7 +1,7 @@
import React, { useState, useEffect } from 'react';
import {
Play, Shield, User, GraduationCap, ArrowRight, Lock, Mail,
Plus, CheckCircle, ChevronRight, HelpCircle, Film, Laptop
Plus, CheckCircle, ChevronRight, HelpCircle, Film, Laptop, Eye, EyeOff
} from 'lucide-react';
import Navbar from './components/Navbar';
import HeroBanner from './components/HeroBanner';
@ -32,6 +32,8 @@ export default function App() {
const [isRegister, setIsRegister] = useState(false);
const [loginEmail, setLoginEmail] = useState('');
const [loginPassword, setLoginPassword] = useState('');
const [showPassword, setShowPassword] = useState(false);
const [showRegPassword, setShowRegPassword] = useState(false);
const [regName, setRegName] = useState('');
const [regEmail, setRegEmail] = useState('');
const [regPassword, setRegPassword] = useState('');
@ -394,14 +396,23 @@ export default function App() {
<div className="space-y-1">
<label className="text-[10px] text-zinc-400 font-bold uppercase tracking-wider">Crie uma Senha</label>
<div className="relative">
<input
type="password"
type={showRegPassword ? "text" : "password"}
required
value={regPassword}
onChange={(e) => setRegPassword(e.target.value)}
placeholder="Mínimo 6 caracteres"
className="w-full glass-input rounded-lg p-3 text-xs text-white focus:outline-none"
className="w-full glass-input rounded-lg p-3 pr-10 text-xs text-white focus:outline-none"
/>
<button
type="button"
onClick={() => setShowRegPassword(!showRegPassword)}
className="absolute right-3 top-2.5 text-zinc-500 hover:text-white transition-colors"
>
{showRegPassword ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
</button>
</div>
</div>
<button
@ -447,13 +458,20 @@ export default function App() {
<div className="relative">
<Lock className="absolute left-3 top-3 w-4 h-4 text-zinc-500" />
<input
type="password"
type={showPassword ? "text" : "password"}
required
value={loginPassword}
onChange={(e) => setLoginPassword(e.target.value)}
placeholder="Digite sua senha"
className="w-full glass-input rounded-lg p-3 pl-10 text-xs text-white focus:outline-none"
className="w-full glass-input rounded-lg p-3 pl-10 pr-10 text-xs text-white focus:outline-none"
/>
<button
type="button"
onClick={() => setShowPassword(!showPassword)}
className="absolute right-3 top-3 text-zinc-500 hover:text-white transition-colors animate-fade-in"
>
{showPassword ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
</button>
</div>
</div>
@ -480,21 +498,14 @@ export default function App() {
{/* QUICK PRESETS FOR SANDBOX DEMO */}
<div className="border-t border-white/10 pt-4 space-y-3">
<p className="text-center text-[10px] text-zinc-500 font-bold uppercase tracking-wider">Acesso de Teste Rápido (Iframe Sandbox)</p>
<div className="grid grid-cols-2 gap-2">
<div className="flex justify-center">
<button
type="button"
onClick={() => quickFill('aluno@microtecflix.com', 'aluno123')}
className="glass-btn-secondary text-zinc-300 font-semibold p-2 rounded text-[10px] transition-colors"
className="w-full glass-btn-secondary text-zinc-300 font-semibold p-2.5 rounded text-[10px] transition-colors text-center"
>
Logar como Aluno
</button>
<button
type="button"
onClick={() => quickFill('sidney.gomes1989@gmail.com', 'admin123')}
className="glass-btn-secondary text-zinc-300 font-semibold p-2 rounded text-[10px] transition-colors"
>
Logar como Admin
</button>
</div>
</div>
</form>