added documentation link and google fonts integration

kioydiolabs · Apr 23, 2024 · c4bb8d1 · c4bb8d1
1 parent 5df1c3f
commit c4bb8d1
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 0 deletions.
diff --git a/website/index.html b/website/index.html
@@ -5,6 +5,7 @@
     <title>KioydioLabs CISCAPPS</title>
     <link rel="stylesheet" href="style.css">
     <link rel="icon" href="./static/images/favicon.jpg">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-50..200" />
     <script src="index.js"></script>
 </head>
 <body>
@@ -47,6 +48,11 @@ <h3 style="text-align: center">How you can help with CISCAPPS</h3>
                     - <a href="https://github.com/kioydiolabs/CISCAPPS/">CISCAPPS GitHub Repository</a>
                 </p>
             </div>
+            <div id="tb4" class="textBox">
+                <a href="https://ciscapps-docs.kioydiolabs.org/"><p>CISCAPPS Documentation</p><span class="material-symbols-outlined">
+arrow_outward
+</span></a>
+            </div>
             <div id="footer">
                 <p>KIOYDIOLABS © 2024</p>
             </div>

diff --git a/website/style.css b/website/style.css
@@ -3,6 +3,14 @@
     src: url("./static/fonts/FiraCode-VF.woff");
 }
 
+.material-symbols-outlined {
+  font-variation-settings:
+  'FILL' 0,
+  'wght' 200,
+  'GRAD' 0,
+  'opsz' 48
+}
+
 body{
     background-color: #1d1e24;
     color: white;
@@ -80,6 +88,7 @@ body::-webkit-scrollbar { /* WebKit */
     opacity: 0;
     animation: fadeIn 1s forwards;
     animation-delay: 0.3s;
+    margin-bottom: 10px;
 }
 
 #textOuter{
@@ -146,6 +155,25 @@ h3{
     animation: flyUp 1.6s forwards;
     animation-delay: 1.4s;
 }
+#tb4 a{
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    text-decoration: none;
+}
+#tb4 a span{
+    margin-left: 10px;
+    text-decoration: none;
+}
+#tb4 p{
+    text-decoration: underline;
+    margin: 0px;
+}
+#tb4{
+    transform: translateY(100vh);
+    animation: flyUp 1.6s forwards;
+    animation-delay: 1.6s;
+}
 
 
 #footer{