109 lines
12 KiB
HTML
109 lines
12 KiB
HTML
<html lang="en">
|
|
<head>
|
|
<title>Sign in to </title>
|
|
<meta charset="utf-8">
|
|
<meta name="robots" content="noindex, nofollow">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link href="http://localhost:5173/src/index.css" rel="stylesheet">
|
|
<script defer src="http://localhost:5173/src/index.ts" type="module"></script>
|
|
</head>
|
|
<body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
|
|
<div class="max-w-md space-y-6 w-full">
|
|
<div class="bg-white p-8 rounded-lg space-y-6">
|
|
<div class="space-y-4">
|
|
<div class="font-bold text-center text-2xl">
|
|
Keywind
|
|
</div>
|
|
<h1 class="text-center text-xl">Sign in to your account</h1>
|
|
</div>
|
|
<div class="space-y-4">
|
|
<div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
|
|
Example of an error message
|
|
</div>
|
|
<form class="m-0 space-y-4" method="post" action="loginAction" onsubmit="login.disabled = true; return true;">
|
|
<input name="credentialId" type="hidden" value="">
|
|
<div>
|
|
<label class="sr-only" for="username"> Email </label> <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="username" name="username" placeholder="Email" type="text" autocomplete="email" value="">
|
|
<div class="mt-2 text-red-600 text-sm">
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="sr-only" for="password"> Password </label>
|
|
<div class="relative" x-data="{ show: false }">
|
|
<input required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="password" name="password" placeholder="Password" :type="show ? 'text' : 'password'"> <button @click="show = !show" aria-controls="password" :aria-expanded="show" class="absolute text-secondary-400 right-3 top-3 sm:top-2" type="button">
|
|
<div x-show="!show">
|
|
<svg class="h-5 w-5" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M10 12.5C11.3807 12.5 12.5 11.3807 12.5 10C12.5 8.61929 11.3807 7.5 10 7.5C8.61929 7.5 7.5 8.61929 7.5 10C7.5 11.3807 8.61929 12.5 10 12.5Z" /> <path clip-rule="evenodd" d="M0.664255 10.5904C0.517392 10.2087 0.517518 9.78563 0.66461 9.40408C2.10878 5.65788 5.7433 3 9.99859 3C14.256 3 17.892 5.66051 19.3347 9.40962C19.4816 9.79127 19.4814 10.2144 19.3344 10.5959C17.8902 14.3421 14.2557 17 10.0004 17C5.74298 17 2.10698 14.3395 0.664255 10.5904ZM14.0004 10C14.0004 12.2091 12.2095 14 10.0004 14C7.79123 14 6.00037 12.2091 6.00037 10C6.00037 7.79086 7.79123 6 10.0004 6C12.2095 6 14.0004 7.79086 14.0004 10Z" fill-rule="evenodd" />
|
|
</svg>
|
|
</div>
|
|
<div x-cloak x-show="show">
|
|
<svg class="h-5 w-5" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
|
<path clip-rule="evenodd" d="M3.28033 2.21967C2.98744 1.92678 2.51256 1.92678 2.21967 2.21967C1.92678 2.51256 1.92678 2.98744 2.21967 3.28033L16.7197 17.7803C17.0126 18.0732 17.4874 18.0732 17.7803 17.7803C18.0732 17.4874 18.0732 17.0126 17.7803 16.7197L16.0352 14.9745C17.5064 13.8594 18.6595 12.3465 19.3344 10.5959C19.4814 10.2144 19.4816 9.79127 19.3347 9.40962C17.892 5.66051 14.256 3 9.99859 3C8.28207 3 6.66657 3.43249 5.2551 4.19444L3.28033 2.21967ZM7.75194 6.69128L8.84367 7.78301C9.18951 7.60223 9.58291 7.5 10.0002 7.5C11.3809 7.5 12.5002 8.61929 12.5002 10C12.5002 10.4173 12.398 10.8107 12.2172 11.1565L13.3091 12.2484C13.7454 11.6077 14.0004 10.8336 14.0004 10C14.0004 7.79086 12.2095 6 10.0004 6C9.16675 6 8.39268 6.25501 7.75194 6.69128Z" fill-rule="evenodd" /> <path d="M10.7484 13.9302L13.2711 16.4529C12.2462 16.8074 11.1458 17 10.0004 17C5.74298 17 2.10698 14.3395 0.664255 10.5904C0.517392 10.2087 0.517518 9.78563 0.66461 9.40408C1.15603 8.12932 1.90108 6.98057 2.83791 6.01969L6.0702 9.25198C6.02436 9.4943 6.00037 9.74435 6.00037 10C6.00037 12.2091 7.79123 14 10.0004 14C10.256 14 10.5061 13.976 10.7484 13.9302Z" />
|
|
</svg>
|
|
</div></button>
|
|
</div>
|
|
<div class="mt-2 text-red-600 text-sm">
|
|
</div>
|
|
</div>
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-center">
|
|
<input checked class="border-secondary-200 h-4 rounded text-primary-600 w-4 focus:ring-primary-200 focus:ring-opacity-50" id="rememberMe" name="rememberMe" type="checkbox"> <label class="ml-2 text-secondary-600 text-sm" for="rememberMe"> Remember me </label>
|
|
</div><a class="text-primary-600 hover:text-primary-500 text-sm inline-flex" href="loginResetCredentialsUrl"> Forgot Password? </a>
|
|
</div>
|
|
<div class="flex flex-col pt-4 space-y-2">
|
|
<button class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="login" type="submit"> Sign In </button>
|
|
</div>
|
|
</form>
|
|
<form action="loginAction" method="post">
|
|
<input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
|
|
</form>
|
|
<div class="pt-4 separate text-secondary-600 text-sm">
|
|
Or sign in with
|
|
</div>
|
|
<div class="gap-4 grid grid-cols-3">
|
|
<a class="hover:bg-provider-facebook/10 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="facebook" href="loginUrl" type="button">
|
|
<div class="h-6 w-6">
|
|
<svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<title>Facebook</title><path d="M24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 17.9895 4.38822 22.954 10.125 23.8542V15.4688H7.07813V12H10.125V9.35626C10.125 6.34875 11.9165 4.68751 14.6576 4.68751C15.9705 4.68751 17.3438 4.92188 17.3438 4.92188V7.875H15.8306C14.3399 7.875 13.875 8.80002 13.875 9.74901V12H17.2031L16.6711 15.4688H13.875V23.8542C19.6118 22.954 24 17.9895 24 12Z" fill="#1877F2" /> <path d="M16.6711 15.4688L17.2031 12H13.875V9.74901C13.875 8.80002 14.3399 7.875 15.8306 7.875H17.3438V4.92188C17.3438 4.92188 15.9705 4.68751 14.6576 4.68751C11.9165 4.68751 10.125 6.34875 10.125 9.35626V12H7.07813V15.4688H10.125V23.8542C10.7453 23.9514 11.3722 24.0002 12 24C12.6379 24 13.2641 23.9501 13.875 23.8542V15.4688H16.6711Z" fill="white" />
|
|
</svg>
|
|
</div></a> <a class="hover:bg-provider-github/10 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="github" href="loginUrl" type="button">
|
|
<div class="h-6 w-6">
|
|
<svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<title>GitHub</title><path d="M11.8452 0C5.13387 0 0 5.09516 0 11.8065C0 17.1726 3.37742 21.7645 8.20161 23.3806C8.82097 23.4919 9.03871 23.1097 9.03871 22.7952C9.03871 22.4952 9.02419 20.8403 9.02419 19.8242C9.02419 19.8242 5.6371 20.55 4.92581 18.3823C4.92581 18.3823 4.37419 16.9742 3.58065 16.6113C3.58065 16.6113 2.47258 15.8516 3.65806 15.8661C3.65806 15.8661 4.8629 15.9629 5.52581 17.1145C6.58548 18.9823 8.36129 18.4452 9.05323 18.1258C9.16452 17.3516 9.47903 16.8145 9.82742 16.4952C7.12258 16.1952 4.39355 15.8032 4.39355 11.1484C4.39355 9.81774 4.76129 9.15 5.53548 8.29839C5.40968 7.98387 4.99839 6.6871 5.66129 5.0129C6.67258 4.69839 9 6.31936 9 6.31936C9.96774 6.04839 11.0081 5.90806 12.0387 5.90806C13.0694 5.90806 14.1097 6.04839 15.0774 6.31936C15.0774 6.31936 17.4048 4.69355 18.4161 5.0129C19.079 6.69194 18.6677 7.98387 18.5419 8.29839C19.3161 9.15484 19.7903 9.82258 19.7903 11.1484C19.7903 15.8177 16.9403 16.1903 14.2355 16.4952C14.6806 16.8774 15.0581 17.6032 15.0581 18.7403C15.0581 20.371 15.0435 22.3887 15.0435 22.7855C15.0435 23.1 15.2661 23.4823 15.8806 23.371C20.7194 21.7645 24 17.1726 24 11.8065C24 5.09516 18.5565 0 11.8452 0Z" fill="#181717" />
|
|
</svg>
|
|
</div></a> <a class="hover:bg-provider-google/10 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="google" href="loginUrl" type="button">
|
|
<div class="h-6 w-6">
|
|
<svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<title>Google</title><path d="M23.76 12.2727C23.76 11.4218 23.6836 10.6036 23.5418 9.81818H12.24V14.46H18.6982C18.42 15.96 17.5745 17.2309 16.3036 18.0818L18.2427 19.5873L20.1818 21.0927C22.4509 19.0036 23.76 15.9273 23.76 12.2727Z" fill="#4285F4" /> <path d="M12.24 24C15.48 24 18.1964 22.9255 20.1818 21.0927L16.3036 18.0818C15.2291 18.8018 13.8545 19.2273 12.24 19.2273C9.11455 19.2273 6.46909 17.1164 5.52545 14.28L3.52091 15.8345L1.51636 17.3891C3.49091 21.3109 7.54909 24 12.24 24Z" fill="#34A853" /> <path d="M5.52545 14.28C5.28545 13.56 5.14909 12.7909 5.14909 12C5.14909 11.2091 5.28545 10.44 5.52545 9.72L3.52091 8.16546L1.51636 6.61091C0.703637 8.23091 0.240001 10.0636 0.240001 12C0.240001 13.9364 0.703637 15.7691 1.51636 17.3891L5.52545 14.28Z" fill="#FBBC05" /> <path d="M12.24 4.77273C14.0018 4.77273 15.5836 5.37818 16.8273 6.56727L20.2691 3.12545C18.1909 1.18909 15.4745 0 12.24 0C7.54909 0 3.49091 2.68909 1.51636 6.61091L5.52545 9.72C6.46909 6.88364 9.11455 4.77273 12.24 4.77273Z" fill="#EA4335" />
|
|
</svg>
|
|
</div></a>
|
|
</div>
|
|
</div>
|
|
<div class="space-y-4">
|
|
<div class="text-center">
|
|
New user? <a class="text-primary-600 hover:text-primary-500 inline-flex" href="registrationUrl"> Register </a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-around">
|
|
<div class="relative" x-data="{ open: false }">
|
|
<button class="text-secondary-600 hover:text-secondary-900 inline-flex" @click="open = true" type="button">
|
|
<div class="flex items-center">
|
|
<span class="mr-1 text-sm">English</span>
|
|
<svg class="h-5 w-5" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
|
<path clip-rule="evenodd" d="M5.23017 7.20938C5.52875 6.92228 6.00353 6.93159 6.29063 7.23017L10 11.1679L13.7094 7.23017C13.9965 6.93159 14.4713 6.92228 14.7698 7.20938C15.0684 7.49647 15.0777 7.97125 14.7906 8.26983L10.5406 12.7698C10.3992 12.9169 10.204 13 10 13C9.79599 13 9.60078 12.9169 9.45938 12.7698L5.20938 8.26983C4.92228 7.97125 4.93159 7.49647 5.23017 7.20938Z" fill-rule="evenodd" />
|
|
</svg>
|
|
</div></button>
|
|
<div @click.away="open = false" class="absolute bg-white bottom-0 -left-4 max-h-80 mb-6 overflow-y-scroll rounded-lg shadow-lg" x-cloak x-show="open">
|
|
<div class="px-4 py-2">
|
|
<a class="text-secondary-600 hover:text-secondary-900 text-sm inline-flex" href="url"> Deutsch </a>
|
|
</div>
|
|
<div class="px-4 py-2">
|
|
<a class="text-secondary-600 hover:text-secondary-900 text-sm inline-flex" href="url"> Français </a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |