mapleopentech/monorepo
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

additional GUI work

Browse source
This commit is contained in:
Rodolfo Martinez 2025-12-03 01:20:30 -05:00
parent 3c6899ace5
commit 81f60acd06
8 changed files with 467 additions and 285 deletions
Download patch file Download diff file Expand all files Collapse all files

52
web/maplefile-frontend/src/pages/Anonymous/Login/RequestOTT.jsx
View file

@ -3,11 +3,10 @@
import { useState, useEffect, useRef, useCallback } from "react";
import { useNavigate, Link } from "react-router";
import { useServices } from "../../../services/Services";
import { Card, Input, Button, Alert, GDPRFooter, ProgressIndicator, Divider } from "../../../components/UIX";
import { Card, Input, Button, Alert, GDPRFooter, ProgressIndicator, Divider, NavBar, AuthPageHeader } from "../../../components/UIX";
import { useUIXTheme } from "../../../components/UIX/themes/useUIXTheme";
import {
ArrowRightIcon,
LockClosedIcon,
ShieldCheckIcon,
SparklesIcon,
} from "@heroicons/react/24/outline";
@ -172,33 +171,13 @@ const RequestOTT = () => {
{/* Header */}
<div className="relative z-10 flex-shrink-0">
<nav className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6 flex justify-between items-center">
<Link to="/" className="inline-flex items-center space-x-3 group">
<div className="relative">
<div className={`absolute inset-0 ${getThemeClasses("bg-gradient-secondary")} rounded-xl opacity-0 group-hover:opacity-100 blur-xl transition-opacity duration-300`}></div>
<div className={`relative flex items-center justify-center h-10 w-10 ${getThemeClasses("bg-gradient-secondary")} rounded-xl shadow-md group-hover:shadow-lg transform group-hover:scale-105 transition-all duration-200`}>
<LockClosedIcon className="h-5 w-5 text-white" />
</div>
</div>
<span className={`text-xl font-bold ${getThemeClasses("text-primary")} transition-colors duration-200`}>
MapleFile
</span>
</Link>
<div className="flex items-center space-x-6">
<Link
to="/register"
className={`text-base font-medium ${getThemeClasses("link-secondary")} transition-colors duration-200`}
>
Need an account?
</Link>
<Link
to="/recovery"
className={`text-base font-medium ${getThemeClasses("link-secondary")} transition-colors duration-200`}
>
Forgot password?
</Link>
</div>
</nav>
<NavBar
links={[
{ to: "/register", label: "Need an account?" },
{ to: "/recovery", label: "Forgot password?" }
]}
transparent
/>
</div>
{/* Main Content */}
@ -216,17 +195,10 @@ const RequestOTT = () => {
/>
{/* Welcome Message */}
<div className="text-center">
<div className="flex justify-center mb-6">
<div className="relative">
<div className={`absolute inset-0 ${getThemeClasses("bg-gradient-secondary")} rounded-2xl blur-2xl opacity-20`}></div>
<div className={`relative h-16 w-16 ${getThemeClasses("bg-gradient-secondary")} rounded-2xl flex items-center justify-center shadow-xl`}>
<ShieldCheckIcon className="h-8 w-8 text-white" />
</div>
</div>
</div>
<h1 className={`text-3xl font-bold ${getThemeClasses("text-primary")}`}>Secure Sign In</h1>
</div>
<AuthPageHeader
title="Secure Sign In"
icon={ShieldCheckIcon}
/>
{/* Login Form */}
<Card