1 files changed, 174 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%
+  }
+}