Files
ms1readerv4/public_html/raven-demo/auth-signup.html
2026-07-17 11:48:07 -04:00

171 lines
9.3 KiB
HTML

<!DOCTYPE html>
<html lang="en" class="h-full">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Raven - Admin Dashboard</title>
<link rel="icon" href="images/favicon.png" type="image/png">
<!--Simplebar-->
<link rel="stylesheet" href="vendor/css/simplebar.css">
<!--:Fonts:-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap" rel="stylesheet">
<!--:Main Style:-->
<link rel="stylesheet" href="css/style.css" />
</head>
<body class="font-theme flex flex-col h-full text-base font-normal bg-white dark:bg-zinc-900 text-zinc-700 dark:text-zinc-300">
<main class="flex flex-col items-center flex-1 justify-center">
<div class="px-4 max-w-md mx-auto py-8 w-full">
<div class="mb-5">
<a href="index.html" class="flex items-center mb-5">
<span
class="flex w-10 h-10 items-center justify-center rounded-full bg-gradient-to-tl from-primary via-primary-deep to-primary-deep text-white shrink-0 font-normal">
<svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 -960 960 960" width="20px"
fill="currentColor">
<path
d="m400-240-51 123q-6 15-21.5 21.5T297-95q-15-6-21.5-21.5T275-147l43-104q-106-28-172-114T80-560v-160q0-66 47-113t113-47q22 0 42 7.5t40 15.5l191 78q13 5 12.5 18.5T512-742l-112 42v60l426 271q7 5 11 11.5t6 14.5l28 140q3 17-7.5 30T836-160h-14q-11 0-19-5.5T790-180l-30-60H560v120q0 17-11.5 28.5T520-80q-17 0-28.5-11.5T480-120v-120h-80ZM240-680q-17 0-28.5-11.5T200-720q0-17 11.5-28.5T240-760q17 0 28.5 11.5T280-720q0 17-11.5 28.5T240-680Zm160 320Zm0 40h353l-63-40H400q-36 0-67.5-14.5T279-415q-13-14-25-38.5T242-498q0-17 11.5-28.5T282-538q15 0 26 10t14 24q5 28 27 46t51 18h165L320-596v-124q0-33-23.5-56.5T240-800q-33 0-56.5 23.5T160-720v160q0 100 70 170t170 70Z" />
</svg>
</span>
</a>
<h3 class="text-2xl font-semibold text-mono leading-none my-2.5">
Sign Up
</h3>
<span class="text-zinc-500 dark:text-zinc-400">
And lets get started with your free trial
</span>
</div>
<form>
<div class="flex flex-col gap-1 mb-4">
<label class="block mb-0.5 text-muted" for="userName">
User name
</label>
<input id="userName" class="input" placeholder="User Name" type="text" value="">
</div>
<div class="flex flex-col gap-1 mb-4">
<label class="block mb-0.5 text-muted" for="userEmail">
Email
</label>
<input id="userEmail" class="input" placeholder="Email" type="email" value="">
</div>
<div class="flex flex-col gap-1 mb-4">
<label class="block mb-0.5 text-muted" for="userPassword">
Password
</label>
<input id="userPassword" class="input" placeholder="Password" type="password" value="">
</div>
<div class="flex flex-col gap-1 mb-4">
<label class="block mb-0.5 text-muted" for="userConfirmPassword">
Confirm password
</label>
<input id="userConfirmPassword" class="input" placeholder="Confirm password" type="password"
value="">
</div>
<button type="submit" class="btn bg-primary text-white hover:bg-primary-deep w-full text-center">Sign
up</button>
<div class="flex items-center justify-center font-semibold text-zinc-400 mt-3 gap-2">
Already have an account?
<a class="text-primary hover:text-primary-deep underline" href="auth-signin.html">
Sign in
</a>
</div>
</form>
</div>
</main>
<div class="absolute ltr:right-3 rtl:left-3 top-3">
<div class="relative">
<button type="button"
class="cursor-pointer relative flex items-center justify-center size-8 rounded-lg hover:bg-zinc-200 hover:text-black dark:hover:text-white dark:hover:bg-zinc-800"
data-bs-toggle="dropdown" data-bs-display="static" data-bs-auto-close="outside">
<span class="icon-[lucide--settings] text-lg"></span>
</button>
<div class="dropdown-menu absolute min-w-56 abslute ltr:right-0 rtl:left-0 top-full z-50 !p-2 mt-4.5">
<div class="mb-3 px-3 pt-2">
<h5>Theme</h5>
</div>
<div class="flex flex-wrap px-3 pb-2 gap-2">
<button id="indigoTheme" class="theme-switcher cursor-pointer">
<span class="flex items-center justify-center size-7 rounded-full text-white"
style="background-color: #636DFF;">
<span class="icon-[lucide--check] theme-check text-lg"></span>
</span>
</button>
<button id="navyTheme" class="theme-switcher cursor-pointer">
<span class="flex items-center justify-center size-7 rounded-full text-white"
style="background-color: #0E6DD9;">
<span class="icon-[lucide--check] theme-check text-lg"></span>
</span>
</button>
<button id="emeraldTheme" class="theme-switcher cursor-pointer">
<span class="flex items-center justify-center size-7 rounded-full text-white"
style="background-color: #049772;">
<span class="icon-[lucide--check] theme-check text-lg"></span>
</span>
</button>
<button id="purpleTheme" class="theme-switcher cursor-pointer">
<span class="flex items-center justify-center size-7 rounded-full text-white"
style="background-color: #D300C5;">
<span class="icon-[lucide--check] theme-check text-lg"></span>
</span>
</button>
</div>
<div class="pt-2 mt-2 border-t border-dashed border-zinc-200 dark:border-zinc-700">
<label class="flex items-center cursor-pointer dropdown-item">
<span class="icon-[lucide--sun-moon] me-1"></span>
<span class="flex-grow text-sm me-2">Dark mode</span>
<input class="input-switch" data-theme-switch="dark" name="check_theme" type="checkbox" value="1">
</label>
</div>
<div class="pt-2 mt-2 border-t border-dashed border-zinc-200 dark:border-zinc-700">
<label for="toggleRTL" class="flex items-center justify-between cursor-pointer dropdown-item">
<span class="text-sm">Enable RTL</span>
<input type="checkbox" class="input-switch" id="toggleRTL" />
</label>
</div>
<div class="pt-2 dark:hidden mt-2 border-t border-dashed border-zinc-200 dark:border-zinc-700">
<h5 class="px-3 mb-2">Sidebar</h5>
<div class="radio-group flex items-center">
<div class="radio-option flex-grow">
<input class="appearance-none hidden" type="radio" id="sidebarLight" name="sidebarTheme" value="light" checked>
<label for="sidebarLight" class="block text-center cursor-pointer sidebar-label">
<span class="w-24 h-16 mb-2 overflow-hidden flex mx-auto p-1 rounded-sm bg-zinc-100 dark:bg-zinc-950 border border-dashed border-zinc-200">
<span class="w-6 h-full bg-white rounded-sm"></span>
</span>
<span class="block text-sm text-zinc-400">
Light
</span>
</label>
</div>
<div class="radio-option flex-grow">
<input class="appearance-none hidden" type="radio" id="sidebarDark" name="sidebarTheme" value="dark">
<label for="sidebarDark" class="block text-center cursor-pointer sidebar-label">
<span class="w-24 h-16 mb-2 overflow-hidden flex mx-auto p-1 rounded-sm bg-zinc-100 dark:bg-zinc-950 border border-dashed border-zinc-200">
<span class="w-6 h-full bg-zinc-900 rounded-sm"></span>
</span>
<span class="block text-sm text-zinc-400">
Dark
</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!--:Scripts:-->
<script src="js/theme.js"></script>
</body>
</html>