styles

sinamics · Aug 27, 2023 · 5b21b99 · 5b21b99
1 parent 294f3e2
commit 5b21b99
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 6 deletions.
diff --git a/docs/images/showcase/network_page.jpg b/docs/images/showcase/network_page.jpg
diff --git a/docs/index.html b/docs/index.html
@@ -66,7 +66,7 @@
   <section class="home" id="home">
     <div class="max-width">
       <div class="home-content">
-        <div class="text-1">ZTNET</div>
+        <div class="text-1"><img src="./images/logo/ztnet_100x100.png" width="30px" height="30px" style="margin-right: 15px" alt="Network Page" />ZTNET</div>
         <h1 class="text-2">Awesome Zerotier Controller</h1>
         <div class="nav-buttons">
           <a title="Goto github project" href="https://github.com/sinamics/ztnet">Github Project</a>
@@ -232,6 +232,6 @@ <h2 class="title">My Skills</h2>
       <a title="Goto github project" href="https://github.com/sinamics/ztnet"> ZTNET </a> | <span class="far fa-copyright"></span> 2023 All Rights Reserved
     </span>
   </footer>
-
 </body>
+
 </html>
diff --git a/docs/style.css b/docs/style.css
@@ -213,17 +213,31 @@
   }
 
   /*  Home  */
+  .home::before {
+    mask: url(#mask);
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: url("./images/showcase/network_page.jpg") no-repeat center;
+    background-size: cover;
+    background-attachment: fixed;
+    filter: blur(3px) saturate(1.5);
+    z-index: -1;
+  }
+
   .home {
     display: flex;
-    background: url("./images/showcase/member_options.jpg") no-repeat
-      center;
     height: 100vh;
     color: #fff;
     min-height: 500px;
-    background-size: cover;
-    background-attachment: fixed;
     font-family: "Ubuntu", sans-serif;
+    position: relative;
+    overflow: hidden;
   }
+
 
   .home .max-width {
     width: 100%;
@@ -266,6 +280,8 @@
   }
   .home .home-content .text-1 {
     font-size: 27px;
+    display: flex;
+    align-items: center;
   }
 
   .home .home-content .text-2 {