add css
This commit is contained in:
parent
09621485a7
commit
c1420bb75a
39
static/stickup.css
Normal file
39
static/stickup.css
Normal file
|
@ -0,0 +1,39 @@
|
|||
body {
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
background-color: lightgray;
|
||||
font-family: Helvetica,sans-serif;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
header {
|
||||
margin-bottom: 3em;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
main {
|
||||
background-color: whitesmoke;
|
||||
padding: 2% 5%;
|
||||
border-radius: 0.5em;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
|
||||
0 3px 1px -2px rgba(0, 0, 0, 0.2),
|
||||
0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.result_message {
|
||||
display: inline-block;
|
||||
padding: 1% 2%;
|
||||
border-radius: 0.5em;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
|
||||
0 3px 1px -2px rgba(0, 0, 0, 0.2),
|
||||
0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
||||
margin: 0.5em;
|
||||
}
|
||||
|
||||
.result_good {
|
||||
background-color: rgba(0, 255, 0, 0.6);
|
||||
}
|
||||
|
||||
.result_bad {
|
||||
background-color: rgba(255, 0, 0, 0.6);
|
||||
}
|
|
@ -2,16 +2,20 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<title>Stickup</title>
|
||||
<link rel="stylesheet" type="text/css" href="/static/stickup.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=0.8">
|
||||
<meta name="description" content="An email management frontend.">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>This is a stickup!</h1>
|
||||
</header>
|
||||
<main>
|
||||
{% for record in user_data %}
|
||||
<div>Your email address is {{ record['email'] }}</div>
|
||||
{% endfor %}
|
||||
{% if result %}
|
||||
<div>{{ result['message'] }}</div>
|
||||
<div class="result_message result_{% if result['ok'] %}good{% else %}bad{% endif %}">{{ result['message'] }}</div>
|
||||
{% endif %}
|
||||
<form method="post" enctype="application/x-www-form-urlencoded">
|
||||
<table>
|
||||
|
@ -32,5 +36,6 @@
|
|||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in New Issue
Block a user