Skip to content

Commit b1bb006

Browse files
slmgkckslmgkck
committed
fix register & login pages
1 parent f1de706 commit b1bb006

5 files changed

Lines changed: 132 additions & 134 deletions

File tree

‎src/lib/component/Footer.svelte‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
src="/api/websiteLogo" />
2828
</a>
2929
<h5>Panocraft</h5>
30-
<small class="text-gray px-3" style="text-align: justify;">
30+
<small class="text-center">
3131
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor,
3232
eveniet maiores similique, excepturi, impedit quae nisi pariatur
3333
dolorum quod quam officiis ut quasi est rem distinctio vero iure
@@ -38,7 +38,7 @@
3838
<div
3939
class="col-lg-4 d-flex justify-content-center align-items-center"
4040
data-bs-theme="dark">
41-
<span class="badge text-bg-secondary rounded-pill user-select-all"
41+
<span class="badge fs-6 text-bg-secondary user-select-all"
4242
>play.N3d10nCr4fT.net</span>
4343
</div>
4444
<div class="w-100"></div>

‎src/lib/pages/LoginPage.svelte‎

Lines changed: 45 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,61 +1,53 @@
11
<style>
2-
#usernameOrEmail {
3-
margin-bottom: -2px;
4-
}
5-
6-
#usernameOrEmail:focus {
7-
position: relative;
8-
z-index: 2;
9-
}
2+
#usernameOrEmail {
3+
margin-bottom: -2px;
4+
}
5+
6+
#usernameOrEmail:focus {
7+
position: relative;
8+
z-index: 2;
9+
}
1010
</style>
1111

12-
<div class="col-6 mx-auto">
12+
<div class="col-lg-6 mx-auto">
1313
<div class="card">
1414
<div class="card-header">{$_("components.modals.login.title")}</div>
15-
<div class="card-body">
16-
<form on:submit|preventDefault={onSubmit}>
17-
<div class="modal-body">
18-
<ErrorAlert error={error} />
19-
<div class="vstack gap-3">
20-
<div class="vstack gap-0">
21-
<div class="form-floating">
22-
<input
23-
bind:value={usernameOrEmail}
24-
class="form-control rounded-bottom-0"
25-
id="usernameOrEmail"
26-
type="text" />
27-
<label for="usernameOrEmail"
28-
>{$_("components.modals.login.inputs.username-email")}</label>
29-
</div>
30-
31-
<div class="form-floating">
32-
<input
33-
bind:value={password}
34-
class="form-control rounded-top-0"
35-
id="password"
36-
type="password" />
37-
<label for="password"
38-
>{$_("components.modals.login.inputs.password")}</label>
39-
</div>
40-
</div>
41-
</div>
15+
<form on:submit|preventDefault={onSubmit}>
16+
<div class="card-body">
17+
<ErrorAlert error={error} />
18+
<div class="form-floating">
19+
<input
20+
bind:value={usernameOrEmail}
21+
class="form-control rounded-bottom-0"
22+
id="usernameOrEmail"
23+
type="text" />
24+
<label for="usernameOrEmail"
25+
>{$_("components.modals.login.inputs.username-email")}</label>
4226
</div>
4327

44-
<div class="modal-footer">
45-
<button
46-
class="btn btn-lg btn-secondary w-100"
47-
class:disabled={loading}
48-
disabled={loading}
49-
type="submit">
50-
{$_("buttons.login")}
51-
</button>
52-
<a class="btn btn-link w-100" href="/reset-password">
53-
{$_("buttons.forgot-password")}
54-
</a>
28+
<div class="form-floating">
29+
<input
30+
bind:value={password}
31+
class="form-control rounded-top-0"
32+
id="password"
33+
type="password" />
34+
<label for="password"
35+
>{$_("components.modals.login.inputs.password")}</label>
5536
</div>
56-
</form>
57-
58-
</div>
37+
</div>
38+
<div class="card-footer vstack gap-2">
39+
<button
40+
class="btn btn-lg btn-secondary"
41+
class:disabled={loading}
42+
disabled={loading}
43+
type="submit">
44+
{$_("buttons.login")}
45+
</button>
46+
<a class="btn btn-link" href="/reset-password">
47+
{$_("buttons.forgot-password")}
48+
</a>
49+
</div>
50+
</form>
5951
</div>
6052
</div>
6153

@@ -71,7 +63,8 @@
7163
7264
import { getCredentials, sendLogin } from "$lib/services/auth.js";
7365
74-
let usernameOrEmail = "", password = "";
66+
let usernameOrEmail = "",
67+
password = "";
7568
let loading, error;
7669
7770
const session = getContext("session");
@@ -100,7 +93,7 @@
10093
object[key] = body[key];
10194
10295
return object;
103-
}, {})
96+
}, {}),
10497
};
10598
10699
data.csrfToken = csrfToken;

‎src/lib/pages/RegisterPage.svelte‎

Lines changed: 83 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -1,88 +1,83 @@
11
<div class="col-6 mx-auto">
22
<div class="card">
33
<div class="card-header">{$_("components.modals.register.title")}</div>
4-
<div class="card-body">
5-
<form on:submit|preventDefault={onSubmit}>
6-
<div class="modal-body">
7-
<SuccessAlert message={successMessage} />
8-
<ErrorAlert error={error} />
9-
<div class="vstack gap-3">
10-
<div class="vstack gap-0">
11-
<div class="form-floating">
12-
<input
13-
bind:value={username}
14-
class="form-control rounded-bottom-0 border-bottom-0"
15-
id="registerUserName"
16-
type="text" />
17-
<label for="registerUserName"
4+
<form on:submit|preventDefault={onSubmit}>
5+
<div class="card-body">
6+
<SuccessAlert message={successMessage} />
7+
<ErrorAlert error={error} />
8+
<div class="vstack gap-3">
9+
<div>
10+
<div class="form-floating">
11+
<input
12+
bind:value={username}
13+
class="form-control rounded-bottom-0 border-bottom-0"
14+
id="registerUserName"
15+
type="text" />
16+
<label for="registerUserName"
1817
>{$_("components.modals.register.inputs.username")}</label>
19-
</div>
20-
<div class="form-floating">
21-
<input
22-
bind:value={email}
23-
class="form-control rounded-top-0"
24-
id="registerEmail"
25-
type="email" />
26-
<label for="registerEmail"
18+
</div>
19+
<div class="form-floating">
20+
<input
21+
bind:value={email}
22+
class="form-control rounded-top-0"
23+
id="registerEmail"
24+
type="email" />
25+
<label for="registerEmail"
2726
>{$_("components.modals.register.inputs.email")}</label>
28-
</div>
2927
</div>
30-
<div class="input-group">
31-
<div class="form-floating">
32-
<input
33-
bind:value={password}
34-
class="form-control"
35-
id="registerPassword"
36-
type="password" />
37-
<label for="registerPassword"
28+
</div>
29+
<div class="input-group">
30+
<div class="form-floating">
31+
<input
32+
bind:value={password}
33+
class="form-control"
34+
id="registerPassword"
35+
type="password" />
36+
<label for="registerPassword"
3837
>{$_("components.modals.register.inputs.password")}</label>
39-
</div>
40-
<div class="form-floating">
41-
<input
42-
bind:value={passwordRepeat}
43-
class="form-control"
44-
id="registerPasswordRepeat"
45-
type="password" />
46-
<label for="registerPasswordRepeat"
47-
>{$_(
48-
"components.modals.register.inputs.password-repeat",
49-
)}</label>
50-
</div>
5138
</div>
52-
{#if $session.siteInfo.registerAgreement}
53-
<div class="form-check">
54-
<input
55-
bind:checked={agreement}
56-
class="form-check-input"
57-
id="registerAcceptTerms"
58-
type="checkbox" />
59-
<label class="form-check-label" for="registerAcceptTerms">
60-
{@html $_("components.modals.register.inputs.agreement-text", {
61-
values: {
62-
link: `<a href="/rules">${$_("components.modals.register.inputs.server-rules")}</a>`,
63-
},
64-
})}
65-
</label>
66-
</div>
67-
{/if}
39+
<div class="form-floating">
40+
<input
41+
bind:value={passwordRepeat}
42+
class="form-control"
43+
id="registerPasswordRepeat"
44+
type="password" />
45+
<label for="registerPasswordRepeat"
46+
>{$_("components.modals.register.inputs.password-repeat")}
47+
</label>
48+
</div>
6849
</div>
50+
{#if $session.siteInfo.registerAgreement}
51+
<div class="form-check">
52+
<input
53+
bind:checked={agreement}
54+
class="form-check-input"
55+
id="registerAcceptTerms"
56+
type="checkbox" />
57+
<label class="form-check-label" for="registerAcceptTerms">
58+
{@html $_("components.modals.register.inputs.agreement-text", {
59+
values: {
60+
link: `<a class="rounded focus-ring" href="/rules">${$_("components.modals.register.inputs.server-rules")}</a>`,
61+
},
62+
})}
63+
</label>
64+
</div>
65+
{/if}
6966
</div>
70-
<div class="modal-footer mt-3">
71-
<button
72-
class="btn btn-lg btn-secondary w-100"
73-
class:disabled={loading}
74-
disabled={loading}
75-
type="submit">
76-
{$_("buttons.register")}
77-
</button>
78-
<a
79-
class="btn btn-link w-100"
80-
href="/login">
81-
{$_("buttons.already-registered")}
82-
</a>
83-
</div>
84-
</form>
85-
</div>
67+
</div>
68+
<div class="card-footer vstack gap-2">
69+
<button
70+
class="btn btn-lg btn-secondary"
71+
class:disabled={loading}
72+
disabled={loading}
73+
type="submit">
74+
{$_("buttons.register")}
75+
</button>
76+
<a class="btn btn-link" href="/login">
77+
{$_("buttons.already-registered")}
78+
</a>
79+
</div>
80+
</form>
8681
</div>
8782
</div>
8883

@@ -100,15 +95,25 @@
10095
const session = getContext("session");
10196
10297
let loading, error, successMessage;
103-
let username = "", email = "", password = "", passwordRepeat = "";
98+
let username = "",
99+
email = "",
100+
password = "",
101+
passwordRepeat = "";
104102
let agreement = !$session.siteInfo.registerAgreement ? true : false;
105103
106104
async function onSubmit() {
107105
error = null;
108106
successMessage = null;
109107
loading = true;
110108
111-
await sendRegister({ username, email, password, passwordRepeat, agreement, recaptcha: "" })
109+
await sendRegister({
110+
username,
111+
email,
112+
password,
113+
passwordRepeat,
114+
agreement,
115+
recaptcha: "",
116+
})
112117
.then((body) => {
113118
loading = false;
114119
@@ -124,4 +129,4 @@
124129
error = NETWORK_ERROR;
125130
});
126131
}
127-
</script>
132+
</script>

‎src/lib/pages/RulesPage.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div class="col-lg-8 mx-auto">
1+
<div class="col mx-auto">
22
<div
33
class="alert alert-secondary"
44
role="alert">

‎src/pano-ui‎

0 commit comments

Comments
 (0)