Merge pull request #32 from JoaquinPar/refactor/ai-challenge2
refactor/ai-challenge2 removed from pages where the user is not logge…
This commit is contained in:
5 files changed
+83
-68
No files matched your search
@@ -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");
|
||||||
});
|
});
|
||||||
|
|||||||
+23
-19
@@ -1,38 +1,42 @@
|
|||||||
<%- 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>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<%- include("./partials/footer") %> <%- include("./partials/footer") %>
|
<%- include("./partials/footer") %>
|
||||||
+26
-22
@@ -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>
|
||||||
|
|||||||
@@ -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
@@ -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>
|
||||||
|
|||||||
Reference in new issue
Block a user