dashboard

Signed-off-by: Lee Calcote <[email protected]>
layer5io · Oct 29, 2023 · f665afe · f665afe
1 parent 38474dc
commit f665afe
Show file tree

Hide file tree

Showing 3 changed files with 92 additions and 13 deletions.
diff --git a/assets/scss/_styles_project.scss b/assets/scss/_styles_project.scss
@@ -8,7 +8,13 @@
 }
 
 // Main Body
-
+.td-home {
+  background-color: $dark;
+}
+// .td-cover-block--height-full {
+//   min-height: 90vh;
+
+// }
 .td-outer {
   margin-top: 2rem;
 }
@@ -83,6 +89,10 @@ a:not([href]):not([class]), a:not([href]):not([class]):hover {
 // Footer
 .td-footer {
   background-color: $black;
+  bottom: 0%;
+  position: absolute;
+  width: 100%;
+
 } 
 
 
@@ -165,9 +175,76 @@ a:not([href]):not([class]), a:not([href]):not([class]):hover {
 
 .l5btn {
   border-radius: 0.75rem;
-border: 4px solid rgba(0, 179, 159, 0.40);
-background: #000;color: white;
-& :active {
+  border: 4px solid rgba(0, 179, 159, 0.40);
+  background: #000;color: white;
+  & :active {
   background-color: $saffron;
 }
+}
+
+.dash-tangle {
+  width: 78.14231rem;
+  height: 74.72rem;
+  transform: rotate(-55.68deg);
+  flex-shrink: 0;
+  position: absolute; z-index:-1;background: linear-gradient(180deg, rgba(0, 179, 115, 0.00) 0%, rgba(0, 179, 159, 0.30) 100%);position: absolute; top: -18rem;right:-32rem;
+}
+
+.dash-ircle {
+  width: 74.125rem; height: 74.125rem; flex-shrink: 0; background: radial-gradient(50% 50% at 50% 50%, rgba(0, 179, 159, 0.20) 0%, rgba(0, 179, 159, 0.00) 100%);position: absolute; top: 8rem;left:-24rem;z-index:-1;
+}
+
+@keyframes tipsy {
+  0 {
+    transform: translateX(-50%) translateY(-50%) rotate(0deg);
+  }
+  100% {
+    transform: translateX(-50%) translateY(-50%) rotate(360deg);
+  }
+}
+
+
+a.dash {
+  color: #fffbf1;
+  text-shadow: 0 20px 25px #2e2e31, 0 40px 60px #2e2e31;
+  font-size: 42px;
+  font-weight: bold;
+  text-decoration: none;
+  letter-spacing: 0px;
+  position: absolute;
+  width: auto;
+  white-space: nowrap;
+  top: 50%;
+  left: 50%;
+  padding:2rem;
+
+  transform: translateX(-50%) translateY(-50%);
+}
+
+a.dash:before,
+a.dash:after {
+  content: '';
+  padding: .9em .4em;
+  position: absolute;
+  left: 50%;
+  width: 100%;
+  top: 50%;
+  display: block;
+  border: 15px solid $primary;
+  transform: translateX(-50%) translateY(-50%) rotate(0deg);
+  animation: 10s infinite alternate ease-in-out tipsy;
+}
+
+a.dash:before {
+  border-color: $primary $secondary rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
+  z-index: -1;
+}
+
+a.dash:after {
+  border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) $primary $secondary;
+  box-shadow: 25px 25px 25px rgba(46, 46, 49, .8);
+}
+a.dash:hover {
+  color: $saffron;
+
 }
diff --git a/assets/scss/_variables_project.scss b/assets/scss/_variables_project.scss
@@ -27,6 +27,8 @@ $code-color: shade-color($secondary, 40%) !default;
 // Body
 $body-color: #ccc;
 $body-bg: #010101;
+// $--bs-body-bg: $dark;
+
 
 // Lefthand sidebar with inter-page docs menu
 

diff --git a/content/en/_index.md b/content/en/_index.md
@@ -2,23 +2,23 @@
 title: Layer5
 ---
 
-{{< blocks/cover title="Expect More from Your Infrastructure" image_anchor="top" height="full" >}}
+{{< blocks/cover title="" image_anchor="top" height="full" >}}
 
+<!-- <h1 style="font-weight:800;margin-bottom: 4rem;font-size:5rem;">Expect More from Your Infrastructure</h1> -->
+<div>
 <a class="btn btn-lg btn-primary me-3 mb-4 l5btn" href="/docs/">
   Cloud Docs <i class="fas fa-arrow-alt-circle-right ms-2"></i>
 </a>
 <a class="btn btn-lg btn-secondary me-3 mb-4 l5btn"
 href="/meshmap">
   MeshMap Docs <i class="fas fa-arrow-alt-circle-right ms-2"></i>
 </a>
-<p class="lead mt-5"></p>
-
-<div style="width: 78.14231rem;
-height: 74.72rem;
-transform: rotate(-55.68deg);
-flex-shrink: 0;
-position: absolute; z-index:-1;background: linear-gradient(180deg, rgba(0, 179, 115, 0.00) 0%, rgba(0, 179, 159, 0.30) 100%);position: absolute; top: -18rem;right:-32rem;"></div>
-<div style="width: 74.125rem; height: 74.125rem; flex-shrink: 0; background: radial-gradient(50% 50% at 50% 50%, rgba(0, 179, 159, 0.20) 0%, rgba(0, 179, 159, 0.00) 100%);position: absolute; top: 8rem;left:-24rem;z-index:-1;"></div>
+</div>
+<div style="margin-top:15%;padding-top:15%"><a href="/cloud" class="dash">Expect More from Your Infrastructure</a>
+</div>
+
+<div class="dash-tangle"></div>
+<div class="dash-ircle"></div>
 
 {{< /blocks/cover >}}