InovinLabs
/
argobox-portfolio
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor footer and navigation links: Updated footer structure and links for consistency across pages, improved logo styling with glow effects, and adjusted background colors for better visual appeal.

This commit is contained in:
Daniel LaForce 2025-04-10 02:13:00 -06:00
parent caab5109a1
commit 9b5f4e42ec
7 changed files with 62 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
ansible-sandbox.html
View File

@ -113,16 +113,27 @@
gap: 0.25rem; gap: 0.25rem;
} }
.logo-text { .logo-text-glow {
background: var(--accent-gradient); background: var(--accent-gradient);
-webkit-background-clip: text; -webkit-background-clip: text;
background-clip: text; background-clip: text;
color: transparent; color: transparent;
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 600; font-weight: 600;
text-shadow: 0 0 10px rgba(59, 130, 246, 0.3);
position: relative;
} }
.logo-dot { .logo-text-glow::before {
content: "";
position: absolute;
inset: -5px;
background: radial-gradient(circle at center, rgba(59, 130, 246, 0.2), transparent 60%);
z-index: -1;
filter: blur(5px);
}
.logo-dot-glow {
color: var(--text-secondary); color: var(--text-secondary);
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 600; font-weight: 600;
@ -1181,8 +1192,8 @@
<div class="container"> <div class="container">
<div class="logo"> <div class="logo">
<a href="index.html"> <a href="index.html">
<span class="logo-text">Argobox</span> <span class="logo-text-glow">Argobox</span>
<span class="logo-dot">.com</span> <span class="logo-dot-glow">.com</span>
</a> </a>
</div> </div>
<div class="nav-menu" id="navMenu"> <div class="nav-menu" id="navMenu">
@ -1409,56 +1420,28 @@
<footer class="footer"> <footer class="footer">
<div class="container"> <div class="container">
<div class="footer-content"> <div class="footer-content">
<div class="footer-info"> <div class="footer-logo">
<div class="footer-logo"> <span class="logo-text-glow">Argobox</span>
<span class="logo-text-glow">ArgoBox</span> <span class="logo-dot-glow">.com</span>
<span class="logo-dot-glow">.com</span>
</div>
<p class="footer-description">
Enterprise-grade home lab environment for DevOps experimentation, infrastructure automation, and containerized application deployment.
</p>
<div class="footer-evolution">
<i class="fas fa-code-branch evolution-icon"></i>
<span>Continuously evolving since 2023</span>
</div>
</div> </div>
<div class="footer-links"> <div class="footer-links">
<div class="footer-links-column"> <a href="index.html">Home</a>
<h3 class="footer-heading">Platforms</h3> <a href="index.html#services">Services</a>
<a href="https://dashboard.argobox.com" class="footer-link">Dashboard</a> <a href="index.html#lab">Live Lab</a>
<a href="https://sandbox.argobox.com" class="footer-link">Ansible Sandbox</a> <a href="index.html#projects">Projects</a>
<a href="https://git.argobox.com" class="footer-link">Gitea</a> <a href="index.html#experience">Experience</a>
<a href="https://ai.argobox.com" class="footer-link">OpenWebUI</a> <a href="index.html#contact">Contact</a>
</div> </div>
<div class="footer-links-column"> <div class="footer-social">
<h3 class="footer-heading">Documentation</h3> <a href="https://linkedin.com/in/danlaforce" target="_blank"><i class="fab fa-linkedin"></i></a>
<a href="construction.html" class="footer-link">Architecture</a> <a href="https://github.com/keyargo" target="_blank"><i class="fab fa-github"></i></a>
<a href="construction.html" class="footer-link">Kubernetes</a>
<a href="construction.html" class="footer-link">Ansible</a>
<a href="construction.html" class="footer-link">Network</a>
</div>
<div class="footer-links-column">
<h3 class="footer-heading">Resources</h3>
<a href="construction.html" class="footer-link">Ansible Playbooks</a>
<a href="construction.html" class="footer-link">K8s Manifests</a>
<a href="construction.html" class="footer-link">Shell Scripts</a>
<a href="construction.html" class="footer-link">Configuration Files</a>
</div>
</div> </div>
</div> </div>
<div class="footer-bottom"> <div class="footer-bottom">
<div class="copyright"> <p>&copy; <span id="current-year">2025</span> All rights reserved. Inovin LLC</p>
&copy; <span id="current-year">2025</span> ArgoBox Lab Environment. All rights reserved.
</div>
<div class="footer-extra-links">
<a href="https://laforceit.com" class="footer-extra-link">
<i class="fas fa-external-link-alt"></i> LaForceIT.com
</a>
</div>
</div> </div>
</div> </div>
</footer> </footer>

10
dashboard.html
View File

@ -1396,22 +1396,22 @@
</div> </div>
<div class="footer-links"> <div class="footer-links">
<a href="index.html#home">Home</a> <a href="index.html">Home</a>
<a href="index.html#services">Services</a> <a href="index.html#services">Services</a>
<a href="index.html#lab">Live Lab</a> <a href="index.html#lab">Live Lab</a>
<a href="index.html#projects">Projects</a> <a href="index.html#projects">Projects</a>
<a href="index.html#experience">Experience</a>
<a href="index.html#contact">Contact</a> <a href="index.html#contact">Contact</a>
</div> </div>
<div class="footer-social"> <div class="footer-social">
<a href="https://github.com/keyargo" target="_blank" aria-label="GitHub"><i class="fab fa-github"></i></a> <a href="https://linkedin.com/in/danlaforce" target="_blank"><i class="fab fa-linkedin"></i></a>
<a href="https://www.linkedin.com/in/danlaforce" target="_blank" aria-label="LinkedIn"><i class="fab fa-linkedin"></i></a> <a href="https://github.com/keyargo" target="_blank"><i class="fab fa-github"></i></a>
<a href="mailto:daniel.laforce@argobox.com" aria-label="Email"><i class="fas fa-envelope"></i></a>
</div> </div>
</div> </div>
<div class="footer-bottom"> <div class="footer-bottom">
<p>&copy; <span id="current-year"></span> All rights reserved. Inovin LLC</p> <p>&copy; <span id="current-year">2025</span> All rights reserved. Inovin LLC</p>
</div> </div>
</div> </div>
</footer> </footer>

BIN
images/android-chrome-192x192.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 31 KiB

BIN
images/android-chrome-512x512.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 190 KiB

After

Width:  |  Height:  |  Size: 153 KiB

BIN
images/apple-touch-icon.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

15
index.html
View File

@ -111,7 +111,7 @@
</div> </div>
</div> </div>
<div class="cta-buttons"> <div class="cta-buttons">
<a href="https://sandbox.argobox.com" class="btn btn-primary"> <a href="ansible-sandbox.html" class="btn btn-primary">
<i class="fab fa-ansible btn-icon"></i> <i class="fab fa-ansible btn-icon"></i>
<span class="btn-text">Try Ansible Sandbox</span> <span class="btn-text">Try Ansible Sandbox</span>
</a> </a>
@ -462,7 +462,7 @@
<span class="status-text">Public</span> <span class="status-text">Public</span>
</div> </div>
</a> </a>
<a href="https://sandbox.argobox.com" class="service-item available" target="_blank"> <a href="ansible-sandbox.html" class="service-item available" target="_blank">
<div class="service-icon"><i class="fab fa-ansible"></i></div> <div class="service-icon"><i class="fab fa-ansible"></i></div>
<div class="service-info"> <div class="service-info">
<h4 class="service-name">Ansible Sandbox</h4> <h4 class="service-name">Ansible Sandbox</h4>
@ -902,7 +902,7 @@
<div class="footer-links-column"> <div class="footer-links-column">
<h3 class="footer-heading">Platforms</h3> <h3 class="footer-heading">Platforms</h3>
<a href="https://dashboard.argobox.com" class="footer-link">Dashboard</a> <a href="https://dashboard.argobox.com" class="footer-link">Dashboard</a>
<a href="https://sandbox.argobox.com" class="footer-link">Ansible Sandbox</a> <a href="ansible-sandbox.html" class="footer-link">Ansible Sandbox</a>
<a href="https://git.argobox.com" class="footer-link">Gitea</a> <a href="https://git.argobox.com" class="footer-link">Gitea</a>
<a href="https://ai.argobox.com" class="footer-link">OpenWebUI</a> <a href="https://ai.argobox.com" class="footer-link">OpenWebUI</a>
</div> </div>
@ -926,14 +926,7 @@
</div> </div>
<div class="footer-bottom"> <div class="footer-bottom">
<div class="copyright"> <p>&copy; <span id="current-year">2025</span> All rights reserved. Inovin LLC</p>
&copy; <span id="current-year">2025</span> ArgoBox Lab Environment. All rights reserved.
</div>
<div class="footer-extra-links">
<a href="https://laforceit.com" class="footer-extra-link">
<i class="fas fa-external-link-alt"></i> LaForceIT.com
</a>
</div>
</div> </div>
</div> </div>
</footer> </footer>

32
styles.css
View File

@ -1346,7 +1346,7 @@ section {
/* Contact Section */ /* Contact Section */
.contact { .contact {
padding: 6rem 0; padding: 6rem 0;
background: var(--secondary-bg); background: var(--primary-bg);
} }
.contact-grid { .contact-grid {
@ -1451,9 +1451,20 @@ section {
/* Footer */ /* Footer */
.footer { .footer {
background-color: var(--secondary-bg); background-color: var(--primary-bg);
padding: 4rem 0 1rem; padding: 4rem 0 1rem;
margin-top: 6rem; position: relative;
}
.footer:before {
content: '';
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 80%;
height: 1px;
background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0) 100%);
} }
.footer-content { .footer-content {
@ -1511,13 +1522,16 @@ section {
} }
.footer-bottom { .footer-bottom {
display: flex; margin-top: 2rem;
justify-content: space-between; padding-top: 1.5rem;
align-items: center; border-top: 1px solid rgba(255, 255, 255, 0.05);
padding-top: 2rem; text-align: center;
border-top: 1px solid var(--border);
color: var(--text-secondary);
font-size: 0.9rem; font-size: 0.9rem;
color: var(--text-secondary);
}
.footer-bottom p {
margin: 0;
} }
.footer-extra-link { .footer-extra-link {