matthias
/
WhisperMaPhone
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add styles to login page 

- Move some styles to main.css to allow for code re-use
This commit is contained in:
MatthiasSaihttam 2020-12-02 15:56:36 -05:00
parent 375a4ec717
commit 1ec107f743
4 changed files with 47 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
main/static/main/login.css Normal file
View File

@ -0,0 +1,8 @@
.main-content {
padding: 20px 30px;
font-size: 16px;
}
#password {
margin: 15px 0;
}

22
main/static/main/main.css
View File

@ -56,7 +56,8 @@ body {
margin-left: 25px;
}
button.show-more {
/* Standard button styles, most prominently used on the show-more buttons */
button, input[type="button"], input[type="submit"] {
background: none;
border: none;
border-radius: 0;
@ -68,11 +69,28 @@ button.show-more {
outline: none;
font-size: 13px;
}
button.show-more:hover, button.show-more:focus {
button:hover, button:focus,
input[type="button"]:hover, input[type="button"]:focus,
input[type="submit"]:hover, input[type="submit"]:focus {
/* border-bottom-color: var(--accent-color); */
text-decoration: underline;
}
/* Textbox/textarea styles */
textarea, input[type="text"], input[type="password"] {
padding: 1px 5px;
outline: none;
resize: none;
background: none;
border: none;
font-size: inherit;
color: inherit;
font-family: inherit;
border-bottom: 1px solid var(--accent-color);
border-radius: 0;
overflow-x: hidden;
}
.text {
max-width: 100%;
}

14
main/static/main/post.css
View File

@ -1,18 +1,6 @@
textarea.thought {
padding: 1px 5px;
outline: none;
width: calc(100% - 60px);
resize: none;
background: none;
border-right: 0;
border: none;
font-size: inherit;
color: inherit;
font-family: inherit;
border-bottom: 1px solid var(--accent-color);
border-radius: 0;
overflow-x: hidden;
display: block;
width: calc(100% - 60px);
}
#post-button {

24
main/templates/whispermaphone/login.html
View File

@ -2,15 +2,27 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Login</title>
{% load static %}
<link href="{% static 'main/login.css' %}" rel="stylesheet">
<link href="{% static 'main/main.css' %}" rel="stylesheet">
<link rel="icon" sizes="192x192" href="{% static 'images/favicon-192x192.png'%}">
<link rel="apple-touch-icon" href="{% static 'images/apple-touch-icon.png'%}"/>
</head>
<body>
Please enter the password to access this page.
<section class="main-content">
<span class="text">
Please enter the password to access this page.
</span>
<form id="password-form">
<input type="password" id="password">
<input type="submit">
</form>
<form id="password-form">
<input type="password" id="password">
<input type="submit" value="Login">
</form>
</section>
<script>
document.getElementById("password-form").addEventListener("submit", evt => {
@ -20,4 +32,4 @@ Please enter the password to access this page.
</script>
</body>
</html>
</html>