Skip to content

Commit 3b3b82a

Browse files
more UI refinements
1 parent 23d3241 commit 3b3b82a

File tree

6 files changed

+80
-79
lines changed

6 files changed

+80
-79
lines changed

Algolyzer/Algolyzer/urls.py

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,10 @@
1818
from django.contrib import admin
1919
from django.urls import include, path
2020

21+
admin.site.site_header = "Algolyzer Admin"
22+
admin.site.site_title = "Algolyzer"
23+
admin.site.index_title = "Welcome to Algolyzer"
24+
2125
urlpatterns = [
2226
# admin url
2327
path("admin/", admin.site.urls),

Algolyzer/static/algolyzer.ico

243 KB
Binary file not shown.

Algolyzer/static/algolyzer.png

-122 KB
Binary file not shown.

Algolyzer/templates/account/login.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,5 +140,5 @@ <h1 class="text-2xl font-bold text-center text-primary">
140140
`;
141141
}
142142
}
143-
</script
143+
</script>
144144
{% endblock %}

Algolyzer/templates/account/signup.html

Lines changed: 71 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -5,87 +5,84 @@
55
{% endblock head_title %}
66

77
{% block content %}
8-
<div class="flex justify-center items-center min-h-screen bg-base-200">
9-
<div class="card w-full max-w-md shadow-lg bg-base-100">
10-
<div class="card-body">
11-
<h1 class="text-2xl font-bold text-center text-primary">
12-
{% trans "Sign Up" %}
13-
</h1>
14-
<p class="text-sm text-center text-secondary mt-2">
15-
{% blocktranslate %}
16-
Already have an account? Then please
17-
<a href="{{ login_url }}" class="link link-primary">sign in</a>.
18-
{% endblocktranslate %}
19-
</p>
20-
21-
{% if not SOCIALACCOUNT_ONLY %}
22-
<form method="post" action="{% url 'account_signup' %}" class="mt-6 space-y-4">
23-
{% csrf_token %}
24-
{% for field in form %}
25-
<div class="form-control relative">
26-
<input
27-
type="{% if field.name == 'password1' or field.name == 'password2' %}password{% else %}{{ field.type }}{% endif %}"
28-
name="{{ field.name }}"
29-
id="{{ field.id_for_label }}"
30-
value="{{ field.value|default:'' }}"
31-
placeholder="{{field.label}}"
32-
class="input input-bordered input-primary"
33-
>
34-
{% if field.name == 'password1' or field.name == 'password2' %}
35-
<button
36-
type="button"
37-
class="absolute inset-y-0 right-2 flex items-center btn btn-sm btn-ghost transform -translate-y-1/2 top-1/2"
38-
onclick="togglePasswordVisibility('{{ field.id_for_label }}')"
39-
>
40-
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
41-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.875 18.825l4.5-4.5M21 12a9 9 0 11-6-8.47" />
42-
</svg>
43-
</button>
44-
{% endif %}
45-
{% for error in field.errors %}
46-
<span class="text-error text-sm">{{ error }}</span>
47-
{% endfor %}
48-
</div>
49-
{% endfor %}
50-
{{ redirect_field }}
51-
52-
<button type="submit" class="btn btn-primary btn-block">
8+
<div class="flex justify-center items-center min-h-screen bg-base-200">
9+
<div class="card w-full max-w-md shadow-lg bg-base-100">
10+
<div class="card-body">
11+
<h1 class="text-2xl font-bold text-center text-primary">
5312
{% trans "Sign Up" %}
54-
</button>
55-
</form>
56-
{% endif %}
13+
</h1>
14+
<p class="text-sm text-center text-secondary mt-2">
15+
{% blocktranslate %}
16+
Already have an account? Then please
17+
<a href="{{ login_url }}" class="link link-primary">sign in</a>.
18+
{% endblocktranslate %}
19+
</p>
5720

58-
{% if PASSKEY_SIGNUP_ENABLED %}
59-
<div class="divider">OR</div>
60-
<a href="{{ signup_by_passkey_url }}" class="btn btn-outline btn-primary btn-block">
61-
{% trans "Sign up using a passkey" %}
62-
</a>
63-
{% endif %}
21+
{% if not SOCIALACCOUNT_ONLY %}
22+
<form method="post" action="{% url 'account_signup' %}" class="mt-6 space-y-4">
23+
{% csrf_token %}
24+
{% for field in form %}
25+
<div class="form-control relative">
26+
<input
27+
type="{% if field.name == 'password1' or field.name == 'password2' %}password{% else %}{{ field.type }}{% endif %}"
28+
name="{{ field.name }}"
29+
id="{{ field.id_for_label }}"
30+
value="{{ field.value|default:'' }}"
31+
placeholder="{{field.label}}"
32+
class="input input-bordered input-primary"
33+
>
34+
{% if field.name == 'password1' or field.name == 'password2' %}
35+
<button
36+
type="button"
37+
class="absolute inset-y-0 right-2 flex items-center btn btn-sm btn-ghost transform -translate-y-1/2 top-1/2"
38+
onclick="togglePasswordVisibility('{{ field.id_for_label }}', this)"
39+
>
40+
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 eye-icon" fill="none" viewBox="0 0 24 24" stroke="currentColor">
41+
<!-- Open Eye Icon -->
42+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
43+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.477 0 8.268 2.943 9.542 7-1.274 4.057-5.065 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" />
44+
</svg>
45+
</button>
46+
{% endif %}
47+
{% for error in field.errors %}
48+
<span class="text-error text-sm">{{ error }}</span>
49+
{% endfor %}
50+
</div>
51+
{% endfor %}
52+
{{ redirect_field }}
6453

65-
{% if SOCIALACCOUNT_ENABLED %}
66-
<div class="divider">Or Use a Third Party App</div>
67-
<div class="text-center">
68-
{% include "socialaccount/snippets/login.html" with page_layout="entrance" %}
54+
<button type="submit" class="btn btn-primary btn-block">
55+
{% trans "Sign Up" %}
56+
</button>
57+
</form>
58+
{% endif %}
6959
</div>
70-
{% endif %}
7160
</div>
7261
</div>
73-
</div>
7462
{% endblock content %}
7563

76-
{% block extra_body %}
77-
{{ block.super }}
78-
{% endblock extra_body %}
79-
8064
{% block scripts %}
81-
<script>
82-
function togglePasswordVisibility(inputId) {
83-
const input = document.getElementById(inputId);
84-
if (input.type === "password") {
85-
input.type = "text";
86-
} else {
87-
input.type = "password";
65+
<script>
66+
function togglePasswordVisibility(inputId, button) {
67+
const input = document.getElementById(inputId);
68+
const icon = button.querySelector(".eye-icon");
69+
70+
if (input.type === "password") {
71+
input.type = "text";
72+
// Change to Closed Eye Icon
73+
icon.innerHTML = `
74+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12s3-5 9-5 9 5 9 5-3 5-9 5-9-5-9-5z" />
75+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.53 9.53a3 3 0 014.24 4.24" />
76+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 1l22 22" />
77+
`;
78+
} else {
79+
input.type = "password";
80+
// Change to Open Eye Icon
81+
icon.innerHTML = `
82+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
83+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.477 0 8.268 2.943 9.542 7-1.274 4.057-5.065 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" />
84+
`;
85+
}
8886
}
89-
}
90-
</script>
91-
{% endblock %}
87+
</script>
88+
{% endblock %}

Algolyzer/templates/base.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@
44
<head>
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
<title>{% block title %}My Django App{% endblock %}</title>
7+
<title>{% block title %}Algolyzer{% endblock %}</title>
88
<!-- Link to the main CSS file -->
99
{% load static %}
1010
<link rel="stylesheet" href="{% static 'output.css' %}">
11-
<link rel="icon" type="image/x-icon" href="{% static 'algolyzer.png' %}">
11+
<link rel="icon" type="image/x-icon" href="{% static 'algolyzer.ico' %}">
1212
<!-- JS scripts -->
1313
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
1414
<!-- Additional head content can be added by child templates -->
@@ -53,7 +53,7 @@
5353
</ul>
5454
</div>
5555
<a href="{%url "home" %}" class="btn btn-ghost text-xl">
56-
<img alt="home" class='w-full h-full object-cover' src="{% static 'algolyzer.png' %}" />
56+
<img alt="home" class='w-full h-full object-cover' src="{% static 'algolyzer.ico' %}" />
5757
</a>
5858
</div>
5959
<div class="navbar-center hidden lg:flex">
@@ -117,7 +117,7 @@ <h6 class="footer-title">Legal</h6>
117117
<footer class="footer bg-base-200 text-base-content border-base-300 border-t px-10 py-4">
118118
<aside class="grid-flow-col items-center">
119119
<a href="{% url 'home' %}" class="w-[30px]">
120-
<img alt="Algolyzer logo" class="w-full h-full object-cover" src="{% static 'algolyzer.png' %}" />
120+
<img alt="Algolyzer logo" class="w-full h-full object-cover" src="{% static 'algolyzer.ico' %}" />
121121
</a>
122122
<p>
123123
pbvs

0 commit comments

Comments
 (0)