refactor/ai-challenge2 removed from pages where the user is not logged in

This commit is contained in:
nicoagostini committed 2025-05-16 11:47:40 -07:00
1 parent 5ec2de0631
commit f5f1516a76
5 files changed
+82 -67

No files matched your search

+7
View File
@@ -3,6 +3,13 @@ const factMenu = document.getElementById("factMenu");
const factInput = document.getElementById("factInput"); const factInput = document.getElementById("factInput");
const factSubmitButton = document.getElementById("factSubmitButton"); const factSubmitButton = document.getElementById("factSubmitButton");
var path = window.location.pathname;
var page = path.split("/").pop();
if(page !== "login" && page !== "signup" && page !== "forgotPassword" && page !== "") {
factButton.classList.remove("hidden");
}
factButton.addEventListener("click", () => { factButton.addEventListener("click", () => {
factMenu.classList.toggle("hidden"); factMenu.classList.toggle("hidden");
}); });
+22 -18
View File
@@ -1,33 +1,37 @@
<%- include("./partials/fileHeader") %> <%- include("./partials/fileHeader") %>
<%- include("./partials/headerStart") %>
<main> <main class="pt-12 bg-slate-100 min-h-screen">
<div class="flex justify-center items-center h-screen"> <div class="flex justify-center items-center py-10">
<form action="/auth/resetPass" method="POST"> <form action="/auth/resetPass" method="POST">
<div class="w-96 p-6 shadow-1g bg-white rounded-md"> <div class="w-96 p-8 bg-white rounded-lg shadow-xl border border-slate-200">
<h1 class="text-3xl block text-center font-semibold">Reset Password</h1> <h1 class="text-3xl block text-center font-semibold text-slate-700">Reset Password</h1>
<hr class="mt-3"> <hr class="mt-4 mb-6 border-slate-300">
<% if (!reset ) { %> <% if (!reset ) { %>
<div class="mt-3"> <div class="mt-4">
<label for="email" class="block text-base mb-2">Email</label> <label for="email" class="block text-base mb-2 text-slate-600">Email</label>
<input type="text" id="email" name="email" <input type="text" id="email" name="email"
class="border focus:border-gray-600 w-full rounded-md text-base px-2 py-1 focus:outline-none focus:ring-0 " class="border border-slate-300 focus:border-indigo-500 w-full rounded-md text-base px-3 py-2 focus:outline-none focus:ring-1 focus:ring-indigo-500 transition-colors duration-200"
placeholder="Enter Email" /> placeholder="Enter Email" />
</div> </div>
<% } else { %> <% } else { %>
<div class="mt-3"> <div class="mt-4 text-center">
<h1 class="text-2xl block text-center font-bold text-red-600"> Reset link sent. </h1> <h2 class="text-xl font-semibold text-green-600">Reset link sent.</h2>
<p class="text-sm text-slate-600 mt-2">Please check your email inbox (and spam folder).</p>
</div> </div>
<% } %> <% } %>
<!---->
<div class="text-red-800 font-bold" id="forgor"> <% if (typeof error !== 'undefined' && error && error.length > 0) { %>
<%= error%> <div class="mt-3 text-red-600 font-semibold text-sm" id="forgor"><%= error %></div>
</div> <% } else if (!reset) { %>
<div class="mt-3 h-5" id="forgor"></div> <% /* Placeholder for layout consistency */ %>
<% } %>
<% if (!reset) { %> <% if (!reset) { %>
<div class="mt-5"> <div class="mt-6">
<button type="submit" <button type="submit"
class="cursor-pointer border-2 border-gray-600 bg-blue-600 text-white py-1 w-full rounded-md hover:bg-transparent hover:text-indigo-700 font-semibold">Send class="border-2 border-indigo-600 bg-indigo-600 text-white py-2 w-full rounded-md hover:bg-indigo-700 hover:border-indigo-700 font-semibold transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2">Send Reset Link</button>
reset Link</button>
</div> </div>
<% } %> <% } %>
</div> </div>
@@ -35,4 +39,4 @@
</div> </div>
</main> </main>
<%- include("./partials/footer") %> <%- include("./partials/footer") %> <%- include("./partials/footer") %>
+26 -22
View File
@@ -1,41 +1,45 @@
<%- include("./partials/fileHeader") %> <%- include("./partials/fileHeader") %>
<%- include("./partials/headerStart") %> <%- include("./partials/headerStart") %>
<main class="pt-24"> <main class="pt-12 bg-slate-100 min-h-screen">
<div class="flex justify-center items-center"> <div class="flex justify-center items-center py-10">
<form action="/login" method="POST"> <form action="/login" method="POST">
<div class="w-96 p-6 shadow-1g bg-white rounded-md"> <div class="w-96 p-8 bg-white rounded-lg shadow-xl border border-slate-200">
<h1 class="text-3xl block text-center font-semibold">Login</h1> <h1 class="text-3xl block text-center font-semibold text-slate-700">Login</h1>
<hr class="mt-3"> <hr class="mt-4 mb-6 border-slate-300">
<div class="mt-3"> <div class="mt-4">
<label for="email" class="block text-base mb-2">Email</label> <label for="email" class="block text-base mb-2 text-slate-600">Email</label>
<input type="text" id="email" name="email" <input type="text" id="email" name="email"
class="border focus:border-gray-600 w-full rounded-md text-base px-2 py-1 focus:outline-none focus:ring-0 " class="border border-slate-300 focus:border-indigo-500 w-full rounded-md text-base px-3 py-2 focus:outline-none focus:ring-1 focus:ring-indigo-500 transition-colors duration-200"
placeholder="Enter Email" /> placeholder="Enter Email" />
</div> </div>
<div class="mt-3"> <div class="mt-4">
<label for="password" class="block text-base mb-2">Password</label> <label for="password" class="block text-base mb-2 text-slate-600">Password</label>
<input type="password" id="password" name="password" <input type="password" id="password" name="password"
class="border focus:border-gray-600 w-full rounded-md text-base px-2 py-1 focus:outline-none focus:ring-0 " class="border border-slate-300 focus:border-indigo-500 w-full rounded-md text-base px-3 py-2 focus:outline-none focus:ring-1 focus:ring-indigo-500 transition-colors duration-200"
placeholder="Enter Password" /> placeholder="Enter Password" />
</div> </div>
<div class="text-red-800 font-bold" id="forgor"> <%= errMessage %></div> <% if (errMessage && errMessage.length > 0) { %>
<div class="mt-3 flex justify-between items-center"> <div class="mt-3 text-red-600 font-semibold text-sm" id="forgor"> <%= errMessage %></div>
<div> <% } else { %>
<input type="checkbox"> <div class="mt-3 h-5" id="forgor"></div> <% /* Placeholder to maintain layout when no error */ %>
<label>Remember me</label> <% } %>
<div class="mt-4 flex justify-between items-center">
<div class="flex items-center">
<input type="checkbox" id="rememberMe" class="h-4 w-4 text-indigo-600 border-slate-300 rounded focus:ring-indigo-500">
<label for="rememberMe" class="ml-2 text-sm text-slate-600">Remember me</label>
</div> </div>
<div> <div>
<a href="/forgotPassword" class="text-indigo-600 font-semibold">Forgot Password? </a> <a href="/forgotPassword" class="text-sm text-indigo-600 hover:text-indigo-500 font-semibold transition-colors duration-200">Forgot Password? </a>
</div> </div>
</div> </div>
<div class="mt-5"> <div class="mt-6">
<button type="submit" <button type="submit"
class="border-2 border-gray-600 bg-blue-600 text-white py-1 w-full rounded-md hover:bg-transparent hover:text-indigo-700 font-semibold">Login</button> class="border-2 border-indigo-600 bg-indigo-600 text-white py-2 w-full rounded-md hover:bg-indigo-700 hover:border-indigo-700 font-semibold transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2">Login</button>
</div> </div>
<div class="mt-5 block justify-between items-center"> <div class="mt-6 text-center">
<label>Don't have an account?</label> <span class="text-sm text-slate-600">Don't have an account?</span>
<a href="/signup" class="text-indigo-600 font-semibold">Register</a> <a href="/signup" class="text-sm text-indigo-600 hover:text-indigo-500 font-semibold ml-1 transition-colors duration-200">Register</a>
</div> </div>
</div> </div>
</form> </form>
+1 -3
View File
@@ -6,7 +6,7 @@
<button type="button" id="factSubmitButton" class="mt-3 w-full px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-700">Submit</button> <button type="button" id="factSubmitButton" class="mt-3 w-full px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-700">Submit</button>
</div> </div>
</div> </div>
<button type="button" id="factButton" class="flex items-center justify-center text-white bg-blue-700 rounded-full w-14 h-14 hover:bg-blue-800 dark:bg-blue-600 dark:hover:bg-blue-700 focus:ring-4 focus:ring-blue-300 focus:outline-none dark:focus:ring-blue-800"> <button type="button" id="factButton" class="flex items-center justify-center text-white bg-blue-700 rounded-full w-14 h-14 hover:bg-blue-800 dark:bg-blue-600 dark:hover:bg-blue-700 focus:ring-4 focus:ring-blue-300 focus:outline-none dark:focus:ring-blue-800 hidden">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"></path></svg> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"></path></svg>
<span class="sr-only">Get a Fact</span> <span class="sr-only">Get a Fact</span>
</button> </button>
@@ -20,8 +20,6 @@
</div> </div>
</footer> </footer>
<script src="https://cdn.jsdelivr.net/npm/flowbite@3.1.2/dist/flowbite.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="/static/scripts/footer.js"></script> <script src="/static/scripts/footer.js"></script>
<script src="https://cdn.jsdelivr.net/npm/flowbite@3.1.2/dist/flowbite.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/flowbite@3.1.2/dist/flowbite.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
+26 -24
View File
@@ -1,44 +1,46 @@
<%- include("./partials/fileHeader") %> <%- include("./partials/fileHeader") %>
<%- include("./partials/headerStart") %> <%- include("./partials/headerStart") %>
<main class="pt-24"> <main class="pt-12 bg-slate-100 min-h-screen">
<div class="flex justify-center items-center"> <div class="flex justify-center items-center py-10">
<form action="/signup" method="POST"> <form action="/signup" method="POST">
<div class="w-96 p-6 shadow-1g bg-white rounded-md"> <div class="w-96 p-8 bg-white rounded-lg shadow-xl border border-slate-200">
<h1 class="text-3xl block text-center font-semibold">Signup</h1> <h1 class="text-3xl block text-center font-semibold text-slate-700">Signup</h1>
<hr class="mt-3"> <hr class="mt-4 mb-6 border-slate-300">
<div class="mt-3"> <div class="mt-4">
<label for="name" class="block text-base mb-2">Name</label> <label for="name" class="block text-base mb-2 text-slate-600">Name</label>
<input type="text" id="name" name="name" <input type="text" id="name" name="name"
class="border focus:border-gray-600 w-full rounded-md text-base px-2 py-1 focus:outline-none focus:ring-0 " class="border border-slate-300 focus:border-indigo-500 w-full rounded-md text-base px-3 py-2 focus:outline-none focus:ring-1 focus:ring-indigo-500 transition-colors duration-200"
placeholder="Enter Name" /> placeholder="Enter Name" />
</div> </div>
<div class="mt-3"> <div class="mt-4">
<label for="email" class="block text-base mb-2">Email</label> <label for="email" class="block text-base mb-2 text-slate-600">Email</label>
<input type="email" id="email" name="email" <input type="email" id="email" name="email"
class="border focus:border-gray-600 w-full rounded-md text-base px-2 py-1 focus:outline-none focus:ring-0 " class="border border-slate-300 focus:border-indigo-500 w-full rounded-md text-base px-3 py-2 focus:outline-none focus:ring-1 focus:ring-indigo-500 transition-colors duration-200"
placeholder="Enter Email" /> placeholder="Enter Email" />
</div> </div>
<div class="mt-3"> <div class="mt-4">
<label for="password" class="block text-base mb-2">Password</label> <label for="password" class="block text-base mb-2 text-slate-600">Password</label>
<input type="password" id="password" name="password" <input type="password" id="password" name="password"
class="border focus:border-gray-600 w-full rounded-md text-base px-2 py-1 focus:outline-none focus:ring-0 " class="border border-slate-300 focus:border-indigo-500 w-full rounded-md text-base px-3 py-2 focus:outline-none focus:ring-1 focus:ring-indigo-500 transition-colors duration-200"
placeholder="Enter Password" /> placeholder="Enter Password" />
<label for="password" class="block text-base mb-2 mt-3">Re-type Password</label> <label for="repassword" class="block text-base mb-2 mt-3 text-slate-600">Re-type Password</label>
<input type="password" id="repassword" name="repassword" <input type="password" id="repassword" name="repassword"
class="border focus:border-gray-600 w-full rounded-md text-base px-2 py-1 focus:outline-none focus:ring-0 " class="border border-slate-300 focus:border-indigo-500 w-full rounded-md text-base px-3 py-2 focus:outline-none focus:ring-1 focus:ring-indigo-500 transition-colors duration-200"
placeholder="Enter Password" /> placeholder="Enter Password" />
</div> </div>
<div class="text-red-800 font-bold " id="forgor"> <% if (errMessage && errMessage.length > 0) { %>
<%= errMessage %> <div class="mt-3 text-red-600 font-semibold text-sm" id="forgor"> <%= errMessage %></div>
</div> <% } else { %>
<div class="mt-5"> <div class="mt-3 h-5" id="forgor"></div> <% /* Placeholder to maintain layout when no error */ %>
<% } %>
<div class="mt-6">
<button type="submit" <button type="submit"
class="border-2 border-gray-600 bg-blue-600 text-white py-1 w-full rounded-md hover:bg-transparent hover:text-indigo-700 font-semibold">Signup</button> class="border-2 border-indigo-600 bg-indigo-600 text-white py-2 w-full rounded-md hover:bg-indigo-700 hover:border-indigo-700 font-semibold transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2">Signup</button>
</div> </div>
<div class="mt-5 block justify-between items-center"> <div class="mt-6 text-center">
<label>Already have an account?</label> <span class="text-sm text-slate-600">Already have an account?</span>
<a href="/login" class="text-indigo-600 font-semibold">Login</a> <a href="/login" class="text-sm text-indigo-600 hover:text-indigo-500 font-semibold ml-1 transition-colors duration-200">Login</a>
</div> </div>
</div> </div>
</form> </form>