diff options
author | rsiddharth <s@ricketyspace.net> | 2019-10-21 22:01:55 -0400 |
---|---|---|
committer | rsiddharth <s@ricketyspace.net> | 2019-10-21 22:01:55 -0400 |
commit | be1f931f13f37e2d05c79f61cbf1a254c002aa20 (patch) | |
tree | bd4c04be42fa592a190c7d26bff9f2c70409babc | |
parent | 02b2a19d94a7826e4c15392f89935149f4a2f38c (diff) |
nfsw/templates/register.html: Prettify.
Only Desktop view ready. Need to work on the Mobile view.
-rw-r--r-- | nfsw/static/auth.css | 80 | ||||
-rw-r--r-- | nfsw/static/fonts/roboto-regular.ttf | bin | 0 -> 171272 bytes | |||
-rw-r--r-- | nfsw/templates/register.html | 53 |
3 files changed, 114 insertions, 19 deletions
diff --git a/nfsw/static/auth.css b/nfsw/static/auth.css new file mode 100644 index 0000000..834a3b7 --- /dev/null +++ b/nfsw/static/auth.css @@ -0,0 +1,80 @@ +@font-face { + font-family: roboto-black; + src: url('./fonts/roboto-black.ttf'); +} + +@font-face { + font-family: roboto-medium; + src: url('./fonts/roboto-medium.ttf'); +} + +@font-face { + font-family: roboto-regular; + src: url('./fonts/roboto-regular.ttf'); +} + +.auth-grid { + display: grid; + grid-template-rows: 29vh 225px 29vh; + grid-template-columns: auto 370px auto; +} + +.auth-grid-item { + grid-column-start: 2; + grid-column-end: 3; + grid-row-start: 2; + grid-row-end: 3; +} + +header h1 { + font-family: roboto-black; + font-size: 35px; +} + +.form-group { + display: flex; + flex-direction: row; + justify-content: space-between; + padding-bottom: 10px; +} + +.button-group { + display: flex; + flex-direction: row; + justify-content: flex-start; +} + +label { + font-family: roboto-medium; + font-size: 20px; + flex-basis: auto; +} + +input[type="text"], +input[type="password"] { + font-family: roboto-regular; + font-size: 20px; + border: 3px solid rgb(90,90,90); + flex-basis: auto; +} + +input[type="text"], +input[type="password"] { + font-family: roboto-regular; + font-size: 20px; + border: 3px solid rgb(90,90,90); + outline: none; + flex-basis: auto; +} + +input[type="submit"] { + font-family: roboto-medium; + font-size: 20px; + border: 1px solid rgb(10, 10,10); + background-color: rgb(10,10,10); + color: rgb(240,240,240); + border-radius: 5px; + padding: 11px 13px 11px 13px; + cursor: pointer; + +} diff --git a/nfsw/static/fonts/roboto-regular.ttf b/nfsw/static/fonts/roboto-regular.ttf Binary files differnew file mode 100644 index 0000000..2b6392f --- /dev/null +++ b/nfsw/static/fonts/roboto-regular.ttf diff --git a/nfsw/templates/register.html b/nfsw/templates/register.html index 1327512..3676591 100644 --- a/nfsw/templates/register.html +++ b/nfsw/templates/register.html @@ -4,27 +4,42 @@ {% block title %}Register{% endblock %} {% block content %} -<div class="msg-block"> - <div class="content"> - {% for m in get_flashed_messages() %} - <p>{{ m }}</p> - {% endfor %} - </div> -</div> -<form method="post"> - <div class="form-group"> - <label for="username">Username</label> - <input name="username" class="username" required> - </div> +<div class="auth-grid"> + <div class="auth-grid-item"> + <header> + <h1>NFSW - Register</h1> + </header> - <div class="form-group"> - <label for="password">Password</label> - <input type="password" name="password" class="password" required> - </div> + <div class="msg-block"> + <div class="content"> + {% for m in get_flashed_messages() %} + <p>{{ m }}</p> + {% endfor %} + </div> + </div> + + <form method="post"> + <div class="form-group"> + <label for="username">Username</label> + <input type="text" id="username" + name="username" class="username" required> + </div> - <div class="button-group"> - <input type="submit" value="Register"> + <div class="form-group"> + <label for="password">Password</label> + <input type="password" id="password" + name="password" class="password" required> + </div> + + <div class="button-group"> + <input type="submit" value="Register"> + </div> + </form> </div> -</form> +</div> +{% endblock %} + +{% block css %} +<link rel="stylesheet" href="{{ url_for('static', filename='auth.css') }}"> {% endblock %} |