Skip to content

Commit 268c794

Browse files
UI changes and refinements
1 parent fe911d3 commit 268c794

File tree

3 files changed

+54
-50
lines changed

3 files changed

+54
-50
lines changed

Algolyzer/community/templates/community/post_detail.html

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -78,13 +78,17 @@ <h2 class="text-xl lg:text-3xl font-bold break-words">{{ post.title }}</h2>
7878
<form action="{% url 'vote_post' post.id 1 %}" method="POST">
7979
{% csrf_token %}
8080
<button type="submit" class="btn hover:btn-success border-1 border-solid border-success flex items-center">
81-
👍
81+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" class="h-5 w-5">
82+
<path fill="#63E6BE" d="M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 141.2 160 448c0 17.7 14.3 32 32 32s32-14.3 32-32l0-306.7L329.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"/>
83+
</svg>
8284
</button>
8385
</form>
8486
<form action="{% url 'vote_post' post.id -1 %}" method="POST">
8587
{% csrf_token %}
8688
<button type="submit" class="btn hover:btn-error border-1 border-solid border-error flex items-center">
87-
👎
89+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" class="h-5 w-5">
90+
<path fill="#ed333b" d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"/>
91+
</svg>
8892
</button>
8993
</form>
9094
<h1 class="text-xl font-bold text-secondary">{{ total_votes }}</h1>

Algolyzer/templates/account/login.html

Lines changed: 31 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -56,12 +56,14 @@ <h1 class="text-2xl font-bold text-center text-primary">
5656
>
5757
{% if field.name == 'password' %}
5858
<button
59-
type="button"
60-
class="absolute inset-y-0 right-2 flex items-center btn btn-sm btn-ghost transform -translate-y-1/2 top-1/2"
61-
onclick="togglePasswordVisibility('{{ field.id_for_label }}')"
59+
type="button"
60+
class="absolute inset-y-0 right-2 flex items-center btn btn-sm btn-ghost transform -translate-y-1/2 top-1/2"
61+
onclick="togglePasswordVisibility('{{ field.id_for_label }}', this)"
6262
>
63-
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
64-
<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" />
63+
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 eye-icon" fill="none" viewBox="0 0 24 24" stroke="currentColor">
64+
<!-- Open Eye Icon -->
65+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
66+
<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" />
6567
</svg>
6668
</button>
6769
{% endif %}
@@ -114,14 +116,29 @@ <h1 class="text-2xl font-bold text-center text-primary">
114116
{% endblock extra_body %}
115117

116118
{% block scripts %}
117-
<script>
118-
function togglePasswordVisibility(inputId) {
119-
const input = document.getElementById(inputId);
120-
if (input.type === "password") {
121-
input.type = "text";
122-
} else {
123-
input.type = "password";
119+
120+
121+
<script>
122+
function togglePasswordVisibility(inputId, button) {
123+
const input = document.getElementById(inputId);
124+
const icon = button.querySelector(".eye-icon");
125+
126+
if (input.type === "password") {
127+
input.type = "text";
128+
// Change to Closed Eye Icon
129+
icon.innerHTML = `
130+
<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" />
131+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.53 9.53a3 3 0 014.24 4.24" />
132+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 1l22 22" />
133+
`;
134+
} else {
135+
input.type = "password";
136+
// Change to Open Eye Icon
137+
icon.innerHTML = `
138+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
139+
<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" />
140+
`;
141+
}
124142
}
125-
}
126-
</script>
143+
</script
127144
{% endblock %}

Algolyzer/templates/base.html

Lines changed: 17 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -101,18 +101,11 @@
101101
<!-- Footer Section -->
102102
<footer class="footer bg-base-200 text-base-content p-10">
103103
<nav>
104-
<h6 class="footer-title">Services</h6>
105-
<a class="link link-hover">Branding</a>
106-
<a class="link link-hover">Design</a>
107-
<a class="link link-hover">Marketing</a>
108-
<a class="link link-hover">Advertisement</a>
109-
</nav>
110-
<nav>
111-
<h6 class="footer-title">Company</h6>
112-
<a class="link link-hover">About us</a>
113-
<a class="link link-hover">Contact</a>
114-
<a class="link link-hover">Jobs</a>
115-
<a class="link link-hover">Press kit</a>
104+
<h6 class="footer-title">Features</h6>
105+
<a class="link link-hover" href="{% url 'study_home' %}">Study</a>
106+
<a class="link link-hover" href="{% url 'playground_home' %}">Playground</a>
107+
<a class="link link-hover" href="{% url 'quiz_home' %}">Quizzes</a>
108+
<a class="link link-hover" href="{% url 'category_list' %}">Community Forum</a>
116109
</nav>
117110
<nav>
118111
<h6 class="footer-title">Legal</h6>
@@ -123,34 +116,24 @@ <h6 class="footer-title">Legal</h6>
123116
</footer>
124117
<footer class="footer bg-base-200 text-base-content border-base-300 border-t px-10 py-4">
125118
<aside class="grid-flow-col items-center">
126-
<svg
127-
width="24"
128-
height="24"
129-
viewBox="0 0 24 24"
130-
xmlns="http://www.w3.org/2000/svg"
131-
fill-rule="evenodd"
132-
clip-rule="evenodd"
133-
class="fill-current">
134-
<path
135-
d="M22.672 15.226l-2.432.811.841 2.515c.33 1.019-.209 2.127-1.23 2.456-1.15.325-2.148-.321-2.463-1.226l-.84-2.518-5.013 1.677.84 2.517c.391 1.203-.434 2.542-1.831 2.542-.88 0-1.601-.564-1.86-1.314l-.842-2.516-2.431.809c-1.135.328-2.145-.317-2.463-1.229-.329-1.018.211-2.127 1.231-2.456l2.432-.809-1.621-4.823-2.432.808c-1.355.384-2.558-.59-2.558-1.839 0-.817.509-1.582 1.327-1.846l2.433-.809-.842-2.515c-.33-1.02.211-2.129 1.232-2.458 1.02-.329 2.13.209 2.461 1.229l.842 2.515 5.011-1.677-.839-2.517c-.403-1.238.484-2.553 1.843-2.553.819 0 1.585.509 1.85 1.326l.841 2.517 2.431-.81c1.02-.33 2.131.211 2.461 1.229.332 1.018-.21 2.126-1.23 2.456l-2.433.809 1.622 4.823 2.433-.809c1.242-.401 2.557.484 2.557 1.838 0 .819-.51 1.583-1.328 1.847m-8.992-6.428l-5.01 1.675 1.619 4.828 5.011-1.674-1.62-4.829z"></path>
136-
</svg>
119+
<a href="{% url 'home' %}" class="w-[30px]">
120+
<img alt="Algolyzer logo" class="w-full h-full object-cover" src="{% static 'algolyzer.png' %}" />
121+
</a>
137122
<p>
138-
ACME Industries Ltd.
123+
pbvs
139124
<br />
140-
Providing reliable tech since 1992
125+
The minds behind algolyzer
141126
</p>
142127
</aside>
143128
<nav class="md:place-self-center md:justify-self-end">
144129
<div class="grid grid-flow-col gap-4">
145-
<a>
146-
<svg
147-
xmlns="http://www.w3.org/2000/svg"
148-
width="24"
149-
height="24"
150-
viewBox="0 0 24 24"
151-
class="fill-current">
152-
<path
153-
d="M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z"></path>
130+
<a href="https://github.com/Priyanshu-Batham/Algolyzer">
131+
<svg
132+
xmlns="http://www.w3.org/2000/svg"
133+
viewBox="0 0 480 512"
134+
class="fill-current w-6 h-6">
135+
<path
136+
d="M186.1 328.7c0 20.9-10.9 55.1-36.7 55.1s-36.7-34.2-36.7-55.1 10.9-55.1 36.7-55.1 36.7 34.2 36.7 55.1zM480 278.2c0 31.9-3.2 65.7-17.5 95-37.9 76.6-142.1 74.8-216.7 74.8-75.8 0-186.2 2.7-225.6-74.8-14.6-29-20.2-63.1-20.2-95 0-41.9 13.9-81.5 41.5-113.6-5.2-15.8-7.7-32.4-7.7-48.8 0-21.5 4.9-32.3 14.6-51.8 45.3 0 74.3 9 108.8 36 29-6.9 58.8-10 88.7-10 27 0 54.2 2.9 80.4 9.2 34-26.7 63-35.2 107.8-35.2 9.8 19.5 14.6 30.3 14.6 51.8 0 16.4-2.6 32.7-7.7 48.2 27.5 32.4 39 72.3 39 114.2zm-64.3 50.5c0-43.9-26.7-82.6-73.5-82.6-18.9 0-37 3.4-56 6-14.9 2.3-29.8 3.2-45.1 3.2-15.2 0-30.1-.9-45.1-3.2-18.7-2.6-37-6-56-6-46.8 0-73.5 38.7-73.5 82.6 0 87.8 80.4 101.3 150.4 101.3h48.2c70.3 0 150.6-13.4 150.6-101.3zm-82.6-55.1c-25.8 0-36.7 34.2-36.7 55.1s10.9 55.1 36.7 55.1 36.7-34.2 36.7-55.1-10.9-55.1-36.7-55.1z"></path>
154137
</svg>
155138
</a>
156139
<a>

0 commit comments

Comments
 (0)