Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: add IDP review user profile page #99

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

feat: add IDP review user profile page #99

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
136 changes: 136 additions & 0 deletions html/login/idp-review-user-profile.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,136 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Review Profile</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">Review Your Profile</h1>
</div>
<div class="space-y-4">
<form class="m-0 space-y-4" method="post" action="/login-action">
<div>
<label class="sr-only" for="firstName">First name</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="firstName"
name="firstName"
placeholder="First name"
type="text"
autocomplete="given-name"
value=""
/>
<div class="mt-2 text-red-600 text-sm"></div>
</div>
<div>
<label class="sr-only" for="lastName">Last name</label>
<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="lastName"
name="lastName"
placeholder="Last name"
type="text"
autocomplete="family-name"
value=""
/>
<div class="mt-2 text-red-600 text-sm"></div>
</div>
<div>
<label class="sr-only" for="email">Email</label>
<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="email"
name="email"
placeholder="Email"
type="email"
autocomplete="email"
value=""
/>
<div class="mt-2 text-red-600 text-sm"></div>
</div>
<div>
<label class="sr-only" for="phone">Phone Number</label>
<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="phone"
name="phone"
placeholder="Phone Number"
type="tel"
autocomplete="tel"
value=""
/>
<div class="mt-2 text-red-600 text-sm"></div>
</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"
type="submit"
>
Submit
</button>
</div>
</form>
</div>
</div>
<div class="flex justify-around">
<a class="text-secondary-600 hover:text-secondary-900 text-sm inline-flex" href="/login-url"
>« Back to Login</a
>
<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="/francais"
>Français</a
>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
76 changes: 76 additions & 0 deletions theme/keywind/login/idp-review-user-profile.ftl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
<#import "template.ftl" as layout>
<#import "components/atoms/button.ftl" as button>
<#import "components/atoms/button-group.ftl" as buttonGroup>
<#import "components/atoms/form.ftl" as form>
<#import "components/atoms/input.ftl" as input>
<#import "components/atoms/link.ftl" as link>

<@layout.registrationLayout
displayMessage=messagesPerField.exists('global')
displayRequiredFields=false;
section
>
<#if section="header">
${msg("loginIdpReviewProfileTitle")}
<#elseif section="form">
<@form.kw action=url.loginAction method="post">

<@input.kw
autocomplete="email"
invalid=messagesPerField.existsError("email")
label=msg("email")
message=kcSanitize(messagesPerField.get("email"))
name="email"
type="email"
value=(user.getEmail())!''
/>
<@input.kw
autocomplete="given-name"
autofocus=true
invalid=messagesPerField.existsError("firstName")
label=msg("firstName")
message=kcSanitize(messagesPerField.get("firstName"))
name="firstName"
type="text"
value=(user.getFirstName())!''
/>
<@input.kw
autocomplete="family-name"
invalid=messagesPerField.existsError("lastName")
label=msg("lastName")
message=kcSanitize(messagesPerField.get("lastName"))
name="lastName"
type="text"
value=(user.getLastName())!''
/>
<#if !realm.registrationEmailAsUsername>
<@input.kw
autocomplete="username"
invalid=messagesPerField.existsError("username")
label=msg("username")
message=kcSanitize(messagesPerField.get("username"))
name="username"
type="text"
value=(user.getUsername())!''
/>
</#if>

<div class="${properties.kcFormGroupClass!}">
<div id="kc-form-options" class="${properties.kcFormOptionsClass!}">
<div class="${properties.kcFormOptionsWrapperClass!}">
</div>
</div>

<div id="kc-form-buttons" class="${properties.kcFormButtonsClass!}">
<@button.kw color="primary" type="submit" class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonBlockClass!} ${properties.kcButtonLargeClass!}">
${msg("doSubmit")}
</@button.kw>
</div>
</div>
</@form.kw>
<#elseif section="nav">
<@link.kw color="secondary" href=url.loginUrl size="small">
${kcSanitize(msg("backToLogin"))?no_esc}
</@link.kw>
</#if>
</@layout.registrationLayout>