diff options
| author | Roald de Vries <rdevries@thoughtworks.com> | 2016-11-18 13:47:32 +0100 |
|---|---|---|
| committer | Roald de Vries <rdevries@thoughtworks.com> | 2016-11-18 13:52:14 +0100 |
| commit | 6cdfb2110b0f96502eeaaf98f59a05704534cdff (patch) | |
| tree | 5b90c24ab4e2501ccea8c1ddbf23e7c4837ed3c6 /web-ui/public | |
| parent | 44112ced551f36972770704b2ee7ef61a455df83 (diff) | |
serve signup page through twisted
Diffstat (limited to 'web-ui/public')
| -rw-r--r-- | web-ui/public/signup.css | 174 | ||||
| -rw-r--r-- | web-ui/public/signup.html | 19 |
2 files changed, 193 insertions, 0 deletions
diff --git a/web-ui/public/signup.css b/web-ui/public/signup.css new file mode 100644 index 00000000..61ac8587 --- /dev/null +++ b/web-ui/public/signup.css @@ -0,0 +1,174 @@ +body { + font-family: "Open Sans", "Microsoft YaHei", "Hiragino Sans GB", "Hiragino Sans GB W3", "微软雅黑", "Helvetica Neue", Arial, sans-serif; +} + +.field-group { + position:relative; + margin-bottom: 35px; +} + +label { + font-size: 0.9em; + margin-bottom: 10px; + display: inline-block; +} + +input { + display: block; + border: solid 1px #4da3b6; + width: 100%; + height: auto; + padding: 10px 5px; + margin-bottom: 20px; +} + +.animated-label { + color:#999; + position:absolute; + pointer-events:none; + left: 6px; + top:10px; + transition:0.2s ease all; + -moz-transition:0.2s ease all; + -webkit-transition:0.2s ease all; +} + +input:focus { + outline:none; +} + +input:focus ~ .animated-label, input:valid ~ .animated-label{ + top:-20px; + left: 0; + font-size:0.8em; + color:#4da3b6; +} + +.blue-button { + background: #178ca6; + color: white; + display: block; + text-decoration: none; + text-align: center; + padding: 10px 0 10px 0; + width: 104%; + margin: 0 auto; +} + +.blue-button:hover { + background: #4da3b6; +} + +a { + text-decoration: none; + color: #4da3b6; +} + +h1 { + font-size: 1.5em; + text-align: center; +} + +header { + width: 18%; + margin: 0 auto; +} + +.link-message { + text-align: center; + font-size: 0.8em; +} + +.logo { + width: 100%; + height: auto; + padding-top: 20%; + margin-bottom: 30px; +} + +.message h1 { + margin-bottom: 35px; +} + +.message p { + padding-left: 5%; + padding-right: 5%; + width: 40%; + margin: 0 auto; + text-align: center; + line-height: 1.8em; + font-size: 0.9em; +} + +.form-container { + width: 20%; + margin: 0 auto; + padding-top: 40px; +} + +.domain-label { + position: relative; + top: 26px; + padding-left: 20px; + left: 100%; +} + +.sent-email-icon { + width: 60px; +} + +.disabled { + pointer-events: none; + background: #d4d4d4; +} + +.link-message .disabled { + pointer-events: none; + color: #d4d4d4; + background: none; +} + +/* Medium Devices, Desktops */ +@media only screen and (max-width : 992px) { + header { + width: 20%; + } + + .form-container { + width: 30%; + } + + .message p { + width: 70% + } +} + +/* Small Devices, Tablets */ +@media only screen and (max-width : 768px) { + header { + width: 30%; + } + + .form-container { + width: 50%; + } + + .message p { + width: 80% + } +} + +/* Extra Small Devices, Phones */ +@media only screen and (max-width : 480px) { + header { + width: 60%; + } + + .form-container { + width: 80%; + } + + .message p { + width: 85% + } +} diff --git a/web-ui/public/signup.html b/web-ui/public/signup.html new file mode 100644 index 00000000..9bc6cdad --- /dev/null +++ b/web-ui/public/signup.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> + <title>Pixelated Mail</title> + <meta name="description" content=""> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="/startup-assets/normalize.min.css" /> + <link rel="stylesheet" type="text/css" href="/public-assets/signup.css" /> + </head> + <body> + <header><img src="images/pixelated-logo-orange.svg" alt="Pixelated" class="logo"/></header> + <div class="message"> + <div id="app"></div> + <script src="/public-assets/signup.js"></script> + </div> + </body> +</html> |