aboutsummaryrefslogtreecommitdiff
path: root/ufund-ui/src/app/components/signup/signup.component.css
diff options
context:
space:
mode:
Diffstat (limited to 'ufund-ui/src/app/components/signup/signup.component.css')
-rw-r--r--ufund-ui/src/app/components/signup/signup.component.css73
1 files changed, 73 insertions, 0 deletions
diff --git a/ufund-ui/src/app/components/signup/signup.component.css b/ufund-ui/src/app/components/signup/signup.component.css
new file mode 100644
index 0000000..429bc42
--- /dev/null
+++ b/ufund-ui/src/app/components/signup/signup.component.css
@@ -0,0 +1,73 @@
+:host {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+ margin-top: -66px
+
+}
+
+#box {
+ display: flex;
+ flex-direction: column;
+ /*max-width: 300px;*/
+ gap: 10px;
+
+ & > div {
+ display: flex;
+ flex-direction: column;
+ }
+}
+
+.border {
+ border-style: solid;
+ border-width: 1px;
+ padding: 10px;
+ margin: 10px;
+ position: absolute;
+ background-color: white;
+ box-shadow: 0 0 10px 10px black;
+}
+
+#bar {
+ height: 5px;
+ width: 100%;
+ appearance: none;
+ overflow: hidden;
+ /*margin-top: -5px;*/
+}
+
+#bar::-webkit-progress-bar {
+ background-color: lightgray;
+ transition: width 0.5s ease-in-out, background-color 0.5s ease-in-out;
+}
+
+.color0::-webkit-progress-value { background: rgba(255, 0 ,0, 1); transition: background-color 0.5s ease-in-out, width 0.5s ease-in-out; }
+.color1::-webkit-progress-value { background: rgba(255, 0 ,0, 1); transition: background-color 0.5s ease-in-out, width 0.5s ease-in-out; }
+.color2::-webkit-progress-value { background: rgba(255, 165, 0, 1); transition: background-color 0.5s ease-in-out, width 0.5s ease-in-out; }
+.color3::-webkit-progress-value { background: rgba(255, 255, 0, 1); transition: background-color 0.5s ease-in-out, width 0.5s ease-in-out; }
+.color4::-webkit-progress-value { background: rgba(173, 255, 47, 1); transition: background-color 0.5s ease-in-out, width 0.5s ease-in-out; }
+.color5::-webkit-progress-value { background: rgba(50, 205, 50, 1); transition: background-color 0.5s ease-in-out, width 0.5s ease-in-out; }
+.color6::-webkit-progress-value { background: rgba(0, 128, 0, 1); transition: background-color 0.5s ease-in-out, width 0.5s ease-in-out; }
+
+#requirement2, #statusText, #passwordStatusText, #usernameStatusText {
+ color: red;
+}
+
+#passReq {
+ display: flex;
+ flex-direction: column;
+}
+
+#box > div {
+ display: flex;
+ flex-direction: row;
+ align-items: start;
+ gap: 20px;
+
+ div {
+ display: flex;
+ flex-direction: column;
+ }
+}
+