Skip to content

Commit 05fb25d

Browse files
kikkomepkikkomep
committed
feat(view): reformat merge template
1 parent c23b0d6 commit 05fb25d

File tree

1 file changed

+132
-28
lines changed

1 file changed

+132
-28
lines changed

‎lifemonitor/auth/templates/auth/merge.j2

Lines changed: 132 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -4,55 +4,159 @@
44
{% block body_class %} login-page {% endblock %}
55
{% block body_style %} height: auto; {% endblock %}
66

7+
78
{% block body %}
8-
<div class="login-box" style="margin: 50px 0;">
9+
10+
<script>
11+
function switch_block(block_id) {
12+
var blocks = ["merge-question","merge-warning", "merge-alert"];
13+
for (var i = 0; i < blocks.length; i++) {
14+
var block = document.getElementById(blocks[i]);
15+
if (blocks[i] == block_id) {
16+
block.classList.remove("d-none");
17+
} else {
18+
block.classList.add("d-none");
19+
}
20+
}
21+
}
22+
</script>
23+
24+
<div class="login-box" style="margin: 50px auto;">
925

1026
{{ macros.render_logo(class="login-logo", style="width: auto") }}
1127

1228
<div class="card card-primary card-outline shadow-lg p-3 mb-5 bg-white rounded">
1329

1430
<div class="card-body login-card-body text-center">
15-
<h5 class="login-box-msg text-bold">Merge Account</h5>
16-
<p class="font-weight-light">
17-
Your <b>{{ identity.provider }}</b> identity is already associated
31+
<h5 class="login-box-msg text-bold">Merge Accounts</h5>
32+
33+
<p class="font-weight-light mt-3">
34+
Your <b>{{ identity.provider }}</b> identity <br>
35+
is already associated
1836
with the existing account under the username <b>{{ identity.username }}</b>.
1937
</p>
20-
<p class="font-weight-light">
21-
If you wish to merge your <b>{{ current_user.username }}</b> account
22-
with your <b>{{ identity.username }}</b> account,
23-
please log in to the later (ensure that it has a password set).
24-
</p>
25-
<form method="POST">
26-
{{ form.hidden_tag() }}
27-
{{ macros.render_custom_field(form.username,caption="identity username",disabled="true")}}
28-
{{ macros.render_custom_field(form.password,caption="identity password") }}
38+
39+
<h5 class="font-weight-light my-5">
40+
Would you like to merge your <b>{{ current_user.username }}</b> account
41+
with <b>{{ identity.username }}</b> account?
42+
</h5>
2943

30-
<div class="text-center my-4 row">
44+
<div class="my-4">
45+
<div class="d-container justify-content-center ">
46+
<div class="row align-items-center">
47+
<div class="col-5">
48+
<img src="{{ identity.picture or url_for('auth.static', filename='img/avatar/default-user-avatar.jpg') }}"
49+
class="img-circle elevation-1" alt="User Image"
50+
style="width: 80px; height: 80px; object-fit: cover;">
51+
</div>
52+
<div class="col-2">
53+
<img src="{{ url_for('auth.static', filename='img/icons/arrow-right-to-left.png') }}"
54+
class="" style="width: 25px; height: 25px;">
55+
</div>
56+
<div class="col-5">
57+
<img src="{{ current_user.picture or url_for('auth.static', filename='img/avatar/default-user-avatar.jpg') }}"
58+
class="img-circle elevation-1" alt="User Image"
59+
style="width: 80px; height: 80px; object-fit: cover;">
60+
</div>
61+
</div>
62+
<div class="row align-items-center">
63+
<div class="col-5">
64+
<span class="font-weight-light"><b>{{ identity.username }}</b></span>
65+
</div>
66+
<div class="col-2"></div>
67+
<div class="col-5">
68+
<span class="font-weight-light"><b>{{ current_user.username }}</b></span>
69+
</div>
70+
</div>
71+
</div>
72+
73+
<div id="merge-question">
74+
<div class="text-center mt-5 row">
3175
<div class="col-6">
32-
<a href="{{ url_for("auth.profile") }}" class="btn btn-block btn-secondary">
76+
<a href="{{ url_for("auth.profile") }}" class="btn btn-block btn-dark">
3377
Back
3478
</a>
3579
</div>
3680
<div class="col-6">
37-
<button type="submit"
81+
<button type="button" onclick="switch_block('merge-warning')"
3882
class="btn btn-block btn-primary">
3983
Merge
4084
</button>
4185
</div>
4286
</div>
87+
</div>
88+
89+
<div id="merge-warning" class="d-none my-5">
90+
<div style="background-color: #FCF3CF; padding: 15px; border-radius: 20px;">
91+
<span style="color: var(--eosc-yellow)">
92+
<i class="fas fa-exclamation-triangle"></i>
93+
<b class="text-warning font-weight-bold">Warning:</b></span>
94+
<span class="font-weight-light" style="color: var(--test-aborted)">
95+
all content from your current
96+
<b class="font-weight-bold">{{ current_user.username }}</b> account
97+
will be transferred to the
98+
<b class="font-weight-bold">{{ identity.username }}</b> account,
99+
and then the <b class="font-weight-bold">{{ current_user.username }}</b>
100+
account will be deleted!
101+
</span>
102+
</div>
103+
104+
<div class="text-center mt-5 row">
105+
<div class="col-6">
106+
<a href="{{ url_for("auth.profile") }}" class="btn btn-block btn-dark">
107+
Back
108+
</a>
109+
</div>
110+
<div class="col-6">
111+
<button type="button" onclick="switch_block('merge-alert')"
112+
class="btn btn-block btn-secondary">
113+
Merge
114+
</button>
115+
</div>
116+
</div>
117+
</div>
118+
119+
<div id="merge-alert" class="d-none my-5">
120+
<div style="background-color: #FCF3CF; padding: 15px; border-radius: 20px;">
121+
<span style="color: var(--eosc-yellow)">
122+
<i class="fas fa-exclamation-triangle"></i>
123+
<b class="text-warning font-weight-bold">WARNING:</b></span>
124+
<span class="font-weight-light" style="color: var(--test-aborted)">
125+
all content from your current
126+
<b class="font-weight-bold">{{ current_user.username }}</b> account
127+
will be transferred to the
128+
<b class="font-weight-bold">{{ identity.username }}</b> account,
129+
and then the <b class="font-weight-bold">{{ current_user.username }}</b>
130+
account will be deleted!
131+
</span>
132+
</div>
133+
<div class="bg-danger text-white my-5" style="padding: 20px; border-radius: 20px;">
134+
<span style="color: white;">
135+
<i class="fas fa-exclamation-circle"></i>
136+
<b class="text-white font-weight-bold" style="font-variant: small-caps;">WARNING:</b></span>
137+
<span class="font-weight-bold" style="color: var(--test-aborted);">
138+
THIS ACTION CANNOT BE UNDONE!
139+
</span>
140+
</div>
43141

44-
</form>
45-
<div>
46-
<span style="color: var(--eosc-yellow)">
47-
<i class="fas fa-exclamation-triangle"></i>
48-
<b class="text-warning font-weight-bold">Warning:</b></span>
49-
<span class="font-weight-bold" style="color: var(--test-aborted)">
50-
all content from your current <b class="font-weight-light">{{ current_user.username }}</b> account
51-
will be transferred to the
52-
<b class="font-weight-light">{{ identity.username }}</b> account,
53-
and then the <b class="font-weight-light">{{ current_user.username }}</b>
54-
account will be deleted!
55-
</span>
142+
<form method="POST">
143+
{{ form.hidden_tag() }}
144+
<input type="hidden" value="{{ provider }}" name="provider">
145+
<input type="hidden" value={{ username }} name="username">
146+
<div class="text-center my-4 row">
147+
<div class="col-6">
148+
<a href="{{ url_for("auth.profile") }}" class="btn btn-block btn-secondary">
149+
Back
150+
</a>
151+
</div>
152+
<div class="col-6">
153+
<button type="submit"
154+
class="btn btn-block btn-danger">
155+
Merge
156+
</button>
157+
</div>
158+
</div>
159+
</form>
56160
</div>
57161
</div>
58162
</div>

0 commit comments

Comments
 (0)