Enhance website navigation and user experience: Updated logo links to use anchors, added top links for LaForceIT and sign-in button, and introduced an under construction warning for ongoing development.

ansible-docs.html

@@ -264,21 +264,20 @@
     <nav class="navbar">
         <div class="container">
             <div class="logo">
-                <a href="index.html">
+                <a href="#home">
-                    <span class="logo-text">Argobox</span>
+                    <span class="logo-text-glow">ArgoBox</span><span class="logo-dot-glow">.com</span>
-                    <span class="logo-dot">.com</span>
                 </a>
             </div>
             <div class="nav-menu">
-                <a href="index.html#home" class="nav-link">Home</a>
+                <a href="#home" class="nav-link active">Home</a>
-                <a href="index.html#services" class="nav-link">Services</a>
+                <a href="#services" class="nav-link">Services</a>
-                <a href="index.html#lab" class="nav-link active">Live Lab</a>
+                <a href="#lab" class="nav-link">Live Lab</a>
-                <a href="index.html#projects" class="nav-link">Projects</a>
+                <a href="#projects" class="nav-link">Projects</a>
-                <a href="index.html#experience" class="nav-link">Experience</a>
+                <a href="#experience" class="nav-link">Experience</a>
-                <a href="index.html#contact" class="nav-link">Contact</a>
+                <a href="#contact" class="nav-link">Contact</a>
             </div>
             <div class="nav-buttons">
-                <a href="dashboard.html" class="dashboard-link" target="_blank">
+                <a href="https://dashboard.argobox.com" class="dashboard-link" target="_blank">
                     <span class="live-indicator"></span>
                     <span>Live Dashboard</span>
                 </a>
@@ -289,6 +288,26 @@
         </div>
     </nav>
 
+    <!-- Top Links -->
+    <div class="top-links">
+        <a href="https://laforceit.com" class="laforceit-link">
+            <span class="logo-text-glow">LaForceIT</span><span class="logo-dot-glow">.com</span>
+        </a>
+        <a href="https://login.argobox.com" class="signin-button" target="_blank">
+            <i class="fas fa-sign-in-alt"></i>
+            <span>Sign In</span>
+        </a>
+    </div>
+
+    <!-- Under Construction Warning -->
+    <div class="construction-warning">
+        <div class="warning-content">
+            <i class="fas fa-hard-hat"></i>
+            <h2>Under Construction</h2>
+            <p>This page is currently being developed. Some features may not be fully functional.</p>
+        </div>
+    </div>
+
     <div class="docs-container">
         <aside class="sidebar">
             <div class="sidebar-header">

images/site.webmanifest

@@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}

index.html

@@ -33,18 +33,17 @@
     <nav class="navbar">
         <div class="container">
             <div class="logo">
-                <a href="https://argobox.com">
+                <a href="#home">
                     <span class="logo-text-glow">ArgoBox</span><span class="logo-dot-glow">.com</span>
                 </a>
             </div>
             <div class="nav-menu">
                 <a href="#home" class="nav-link active">Home</a>
-                <a href="#architecture" class="nav-link">Architecture</a>
-                <a href="#technologies" class="nav-link">Technologies</a>
                 <a href="#services" class="nav-link">Services</a>
+                <a href="#lab" class="nav-link">Live Lab</a>
                 <a href="#projects" class="nav-link">Projects</a>
-                <a href="#dashboards" class="nav-link">Dashboards</a>
+                <a href="#experience" class="nav-link">Experience</a>
-                <a href="https://laforceit.com" class="nav-link">LaForceIT</a>
+                <a href="#contact" class="nav-link">Contact</a>
             </div>
             <div class="nav-buttons">
                 <a href="https://dashboard.argobox.com" class="dashboard-link" target="_blank">
@@ -58,8 +57,11 @@
         </div>
     </nav>
 
-    <!-- Sign In Button -->
+    <!-- Top Links -->
-    <div class="signin-container">
+    <div class="top-links">
+        <a href="https://laforceit.com" class="laforceit-link">
+            <span class="logo-text-glow">LaForceIT</span><span class="logo-dot-glow">.com</span>
+        </a>
         <a href="https://login.argobox.com" class="signin-button" target="_blank">
             <i class="fas fa-sign-in-alt"></i>
             <span>Sign In</span>

styles.css

@@ -2400,4 +2400,104 @@ section {
     background: rgba(255, 255, 255, 0.2);
     border-color: rgba(255, 255, 255, 0.3);
     transform: translateY(-2px);
+}
+
+/* Top Links */
+.top-links {
+    position: fixed;
+    top: 1rem;
+    right: 1rem;
+    z-index: 1001;
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+}
+
+.laforceit-link {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.5rem 1rem;
+    background: rgba(255, 255, 255, 0.1);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    border-radius: 4px;
+    color: #ffffff;
+    text-decoration: none;
+    transition: all 0.3s ease;
+    font-size: 0.9rem;
+}
+
+.laforceit-link:hover {
+    background: rgba(255, 255, 255, 0.2);
+    border-color: rgba(255, 255, 255, 0.3);
+    transform: translateY(-2px);
+}
+
+.signin-button {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.5rem 1rem;
+    background: rgba(255, 255, 255, 0.1);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    border-radius: 4px;
+    color: #ffffff;
+    text-decoration: none;
+    transition: all 0.3s ease;
+    font-size: 0.9rem;
+}
+
+.signin-button:hover {
+    background: rgba(255, 255, 255, 0.2);
+    border-color: rgba(255, 255, 255, 0.3);
+    transform: translateY(-2px);
+}
+
+/* Responsive adjustments */
+@media (max-width: 768px) {
+    .top-links {
+        top: 4.5rem;
+        right: 1rem;
+    }
+}
+
+/* Under Construction Warning */
+.construction-warning {
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    z-index: 1000;
+    background: rgba(15, 23, 42, 0.95);
+    border: 1px solid rgba(59, 130, 246, 0.3);
+    border-radius: 8px;
+    padding: 2rem;
+    text-align: center;
+    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+    backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
+}
+
+.warning-content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+}
+
+.warning-content i {
+    font-size: 3rem;
+    color: #f59e0b;
+}
+
+.warning-content h2 {
+    color: #f59e0b;
+    font-size: 1.5rem;
+    margin: 0;
+}
+
+.warning-content p {
+    color: #94a3b8;
+    margin: 0;
+    max-width: 300px;
 }