diff --git a/README.md b/README.md index d83ea0b..fc735cb 100644 --- a/README.md +++ b/README.md @@ -3,5 +3,8 @@ Repo following tutorial @ https://docs.djangoproject.com/en/3.2/intro/ -Login Page example @ -https://learndjango.com/tutorials/django-login-and-logout-tutorial +✅ Login Page tutorial @ +https://learndjango.com/tutorials/django-login-and-logout-tutorial + +✅ Remember me @ +https://codepen.io/AllThingsSmitty/pen/pOoeyz diff --git a/djlearn/djlearn/settings.py b/djlearn/djlearn/settings.py index 36ae822..b114ab5 100644 --- a/djlearn/djlearn/settings.py +++ b/djlearn/djlearn/settings.py @@ -127,4 +127,5 @@ STATIC_URL = '/static/' DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField' -LOGIN_REDIRECT_URL = '/' \ No newline at end of file +LOGIN_REDIRECT_URL = 'index' +LOGOUT_REDIRECT_URL = 'index' diff --git a/djlearn/pages/static/css/login.css b/djlearn/pages/static/css/login.css index 906175f..0475ecc 100644 --- a/djlearn/pages/static/css/login.css +++ b/djlearn/pages/static/css/login.css @@ -19,10 +19,10 @@ .login-form { display: flex; + min-height: 15vh; flex-direction: column; justify-content: center; align-items: center; - margin: 2em; } .login-input { @@ -30,6 +30,11 @@ margin: 0.1em; } +.login-error { + color: red; + padding-bottom: 1em; +} + .spaced { width: 100%; display: flex; diff --git a/djlearn/pages/static/js/base.js b/djlearn/pages/static/js/base.js new file mode 100644 index 0000000..3118418 --- /dev/null +++ b/djlearn/pages/static/js/base.js @@ -0,0 +1,19 @@ +document.addEventListener('DOMContentLoaded', (event) => { + clock(); + }) + +function clock() { + const today = new Date(); + let h = today.getHours(); + let m = today.getMinutes(); + let s = today.getSeconds(); + m = checkTime(m); + s = checkTime(s); + document.getElementById('clock').innerHTML = h + ":" + m + ":" + s; + setTimeout(clock, 1000); + } + +function checkTime(i) { + if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10 + return i; +} diff --git a/djlearn/pages/static/js/login.js b/djlearn/pages/static/js/login.js new file mode 100644 index 0000000..dfe0a75 --- /dev/null +++ b/djlearn/pages/static/js/login.js @@ -0,0 +1,24 @@ +document.addEventListener('DOMContentLoaded', (event) => { + + const rmCheck = document.getElementById("remember_me"), + emailInput = document.getElementById("id_username"); + + if (localStorage.checkbox && localStorage.checkbox !== "") { + rmCheck.setAttribute("checked", "checked"); + emailInput.value = localStorage.username; + } else { + rmCheck.removeAttribute("checked"); + emailInput.value = ""; + } + +}) + +function lsRememberMe() { + if (rmCheck.checked && emailInput.value !== "") { + localStorage.username = emailInput.value; + localStorage.checkbox = rmCheck.value; + } else { + localStorage.username = ""; + localStorage.checkbox = ""; + } +} \ No newline at end of file diff --git a/djlearn/pages/templates/pages/base.html b/djlearn/pages/templates/pages/base.html index f09119e..9ce460d 100644 --- a/djlearn/pages/templates/pages/base.html +++ b/djlearn/pages/templates/pages/base.html @@ -8,6 +8,7 @@ + {% block extrahead %}{% endblock %} @@ -21,20 +22,21 @@
- {% if user.is_authenticated %} - {{ user.username }} - - {% else %} -

You are not logged in

- Log In - {% endif %} +
- Sign in: - PyHub - Github - Twitter + {% if user.is_authenticated %} + + {{ user.username }} + (logout) + + {% else %} + Sign in: + PyHub + Github + Twitter + {% endif %}
diff --git a/djlearn/pages/templates/registration/login.html b/djlearn/pages/templates/registration/login.html index 56914e2..d3e949f 100644 --- a/djlearn/pages/templates/registration/login.html +++ b/djlearn/pages/templates/registration/login.html @@ -5,6 +5,7 @@ {% block extrahead %} + {% endblock %} {% block content %} @@ -14,20 +15,23 @@

<PyHub Login>

{% csrf_token %} - {{ form.as_p }} - + {% if form.errors %} +
Username or Password not correct!
+ {% endif %} +

Username: {{ form.username }}

+

Password: {{ form.password }}

+
- + - +
-

Forgot your password? Click here to reset.

+

Forgot your password? Click here.

+ + {% endblock %} \ No newline at end of file