Countdown added

2022-01-04 23:39:58 +01:00
parent 58fac0aa1e
commit 6ae3e86cb9
14 changed files with 591 additions and 275 deletions
--- a/ui/src/app/countdown/countdown.component.css
+++ b/ui/src/app/countdown/countdown.component.css
@@ -0,0 +1,121 @@
+.content-coming-soon {
+	position: relative;
+	width: 100%;
+}
+#coming-soon {
+	position: absolute;
+	top: -50px;
+	left: 50%;
+	margin-left: -230px;
+}
+.coming-soon-wrapper {
+	width: 100px;
+	border-radius: 50%;
+	height: 100px;
+}
+.coming-soon-time {
+	font-size: 44px;
+	font-weight: 100;
+	line-height: 64px;
+}
+.coming-soon-date {
+    line-height: 14px;
+	display:block;
+	font-size: 16px;
+}
+
+
+.wrapper-table {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+}
+
+.wrapper-table {
+    display: table;
+}
+
+.wrapper-table-cell {
+    display: table-cell;
+    margin: 0;
+    padding: 0;
+    text-align: center;
+    vertical-align: middle;
+}
+
+.content-coming-soon {
+    height: auto;
+    margin: auto;
+}
+
+.coming-soon-wrapper {
+  text-align:center;
+  background-color:#fff;
+  padding: 0px;
+  display:inline-block;
+  color:white;
+}
+
+.coming-soon-wrapper-transparent {
+  text-align:center;
+  background-color:rgba(0,0,0,0.6);
+  padding:20px;
+  display:inline-block;
+  color:white;
+}
+.coming-soon-wrapper+.coming-soon-wrapper,
+.coming-soon-wrapper-transparent+.coming-soon-wrapper-transparent {
+  margin-left:16px;
+}
+
+@media (max-width: 992px) {
+	/*
+      .coming-soon-wrapper,
+    .coming-soon-wrapper-transparent {
+          padding-p: 20px;
+      }
+      /*.coming-soon-time {
+          font-size: 48px;
+          line-height: 60px;
+      }
+      .coming-soon-date {
+          line-height: 20px;
+          font-size: 15px;
+      }*/
+	#coming-soon {
+		top: -64px;
+    	margin-left: -228px;
+	}
+}
+
+@media (max-width: 767px) {
+  
+	.coming-soon-wrapper,
+  .coming-soon-wrapper-transparent {
+		width: 64px; /* 160, 128, 64 */
+		border-radius: 35px;
+		height: 64px;
+		padding-top: 10px;
+	}
+	.coming-soon-time {
+		font-size: 24px; /* 60, 48, 24 */
+		line-height: 30px;
+	}
+	.coming-soon-date {
+		line-height: 15px;
+		font-size: 11px;  /* 18, 15, 13 */
+	}
+	#coming-soon {
+		top: -32px;
+    	margin-left: -150px;
+	}
+
+  .coming-soon-wrapper+.coming-soon-wrapper,
+  .coming-soon-wrapper-transparent+.coming-soon-wrapper-transparent {
+    margin-left:8px;
+  }
+
+  .coming-soon-date {
+    display:block;
+  }
+}