Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-10-27 11:02:16 +01:00
Code Issues Projects Releases Wiki Activity

chore: improve demo auth screen (#9780)

Browse Source 
https://linear.app/unleash/issue/2-2575/adjust-text-login-screen

Adjusts the text for the demo auth screen.

Also took some liberties to improve the visual design of this page (at
least, IMO).

### Before


![image](https://github.com/user-attachments/assets/c17a4378-a940-4e5f-ad79-00ae4514cba6)

### After


![image](https://github.com/user-attachments/assets/c77d7d43-648f-40ab-9eb6-07156af22a7f)
This commit is contained in:
Nuno Góis 2025-04-16 15:07:22 +01:00 committed by GitHub
parent f3a1da9d7e
commit 176e9d3187
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/component/user/DemoAuth/DemoAuth.module.scss
View File

@ -1,5 +1,11 @@
.container { .container {
width: 350px; width: 350px;
text-align: center;
}
.container > h2 {
margin-top: 16px;
margin-bottom: 16px;
} }
.container > * { .container > * {
@ -24,9 +30,15 @@
.button { .button {
min-width: 150px; min-width: 150px;
margin: 1rem auto; margin: 1rem auto;
margin-top: 0.5rem;
display: block; display: block;
} }
.terms {
margin-top: 32px;
font-size: 12px;
}
@media (max-width: 500px) { @media (max-width: 500px) {
.container { .container {
width: 100%; width: 100%;

10
frontend/src/component/user/DemoAuth/DemoAuth.tsx
View File

@ -49,7 +49,11 @@ const DemoAuth: VFC<IDemoAuthProps> = ({ authDetails, redirect }) => {
<Logo className={styles.logo} aria-label='Unleash logo' /> <Logo className={styles.logo} aria-label='Unleash logo' />
<div className={styles.container}> <div className={styles.container}>
<h2>Access the Unleash demo instance</h2> <h2>Access the Unleash demo instance</h2>
<p>No further data or Credit Card required</p> <p>
Use your email to test out the demo
<br />
No further data or credit card required
</p>
<div className={styles.form}> <div className={styles.form}>
<TextField <TextField
value={email} value={email}
@ -73,10 +77,10 @@ const DemoAuth: VFC<IDemoAuthProps> = ({ authDetails, redirect }) => {
className={styles.button} className={styles.button}
data-testid={LOGIN_BUTTON} data-testid={LOGIN_BUTTON}
> >
Sign in Test Unleash demo
</Button> </Button>
</div> </div>
<p> <p className={styles.terms}>
By accessing our demo instance, you agree to the By accessing our demo instance, you agree to the
Unleash&nbsp; Unleash&nbsp;
<a <a