diff --git a/Styles/auth.css b/Styles/auth.css index 2900de3..ffc69e8 100644 --- a/Styles/auth.css +++ b/Styles/auth.css @@ -115,6 +115,38 @@ margin-top: 0.25rem; } +/* Password Visibility Toggle */ +.password-wrapper { + position: relative; + display: flex; + align-items: center; +} + +.password-wrapper input { + width: 100%; + padding-right: 2.5rem; +} + +.password-toggle { + position: absolute; + right: 0.5rem; + background: none; + border: none; + cursor: pointer; + color: var(--text); + padding: 0.25rem; + font-size: 1.1rem; + display: flex; + align-items: center; + justify-content: center; + opacity: 0.6; + transition: opacity 0.2s; +} + +.password-toggle:hover { + opacity: 1; +} + /* Responsive Design */ @media (max-width: 480px) { .auth-card { diff --git a/Styles/main.css b/Styles/main.css index 83dd353..9ab1144 100644 --- a/Styles/main.css +++ b/Styles/main.css @@ -1138,6 +1138,40 @@ ul li i.fa-check { color: var(--light-text); } +/* Scroll to Top Button */ +#scrollToTop { + position: fixed; + bottom: 2rem; + right: 2rem; + width: 44px; + height: 44px; + background: var(--secondary-color); + color: white; + border: none; + border-radius: 50%; + cursor: pointer; + font-size: 1.25rem; + display: flex; + align-items: center; + justify-content: center; + box-shadow: 0 2px 10px rgba(0,0,0,0.2); + opacity: 0; + visibility: hidden; + transform: translateY(10px); + transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease, background 0.3s ease; + z-index: 999; +} + +#scrollToTop.visible { + opacity: 1; + visibility: visible; + transform: translateY(0); +} + +#scrollToTop:hover { + background: var(--primary-color); +} + /* Responsive Modal */ @media (max-width: 768px) { .modal-content { diff --git a/admin.html b/admin.html index aa0c2b7..1067321 100644 --- a/admin.html +++ b/admin.html @@ -3,7 +3,7 @@
-