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

View File

@ -113,16 +113,27 @@
gap: 0.25rem;
}
.logo-text {
.logo-text-glow {
background: var(--accent-gradient);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
font-size: 1.5rem;
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);
font-size: 1.5rem;
font-weight: 600;
@ -1181,8 +1192,8 @@
<div class="container">
<div class="logo">
<a href="index.html">
<span class="logo-text">Argobox</span>
<span class="logo-dot">.com</span>
<span class="logo-text-glow">Argobox</span>
<span class="logo-dot-glow">.com</span>
</a>
</div>
<div class="nav-menu" id="navMenu">
@ -1409,56 +1420,28 @@
<footer class="footer">
<div class="container">
<div class="footer-content">
<div class="footer-info">
<div class="footer-logo">
<span class="logo-text-glow">ArgoBox</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 class="footer-logo">
<span class="logo-text-glow">Argobox</span>
<span class="logo-dot-glow">.com</span>
</div>
<div class="footer-links">
<div class="footer-links-column">
<h3 class="footer-heading">Platforms</h3>
<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="https://git.argobox.com" class="footer-link">Gitea</a>
<a href="https://ai.argobox.com" class="footer-link">OpenWebUI</a>
</div>
<a href="index.html">Home</a>
<a href="index.html#services">Services</a>
<a href="index.html#lab">Live Lab</a>
<a href="index.html#projects">Projects</a>
<a href="index.html#experience">Experience</a>
<a href="index.html#contact">Contact</a>
</div>
<div class="footer-links-column">
<h3 class="footer-heading">Documentation</h3>
<a href="construction.html" class="footer-link">Architecture</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 class="footer-social">
<a href="https://linkedin.com/in/danlaforce" target="_blank"><i class="fab fa-linkedin"></i></a>
<a href="https://github.com/keyargo" target="_blank"><i class="fab fa-github"></i></a>
</div>
</div>
<div class="footer-bottom">
<div class="copyright">
&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>
<p>&copy; <span id="current-year">2025</span> All rights reserved. Inovin LLC</p>
</div>
</div>
</footer>

View File

@ -1396,22 +1396,22 @@
</div>
<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#lab">Live Lab</a>
<a href="index.html#projects">Projects</a>
<a href="index.html#experience">Experience</a>
<a href="index.html#contact">Contact</a>
</div>
<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://www.linkedin.com/in/danlaforce" target="_blank" aria-label="LinkedIn"><i class="fab fa-linkedin"></i></a>
<a href="mailto:daniel.laforce@argobox.com" aria-label="Email"><i class="fas fa-envelope"></i></a>
<a href="https://linkedin.com/in/danlaforce" target="_blank"><i class="fab fa-linkedin"></i></a>
<a href="https://github.com/keyargo" target="_blank"><i class="fab fa-github"></i></a>
</div>
</div>
<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>
</footer>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 190 KiB

After

Width:  |  Height:  |  Size: 153 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

View File

@ -111,7 +111,7 @@
</div>
</div>
<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>
<span class="btn-text">Try Ansible Sandbox</span>
</a>
@ -462,7 +462,7 @@
<span class="status-text">Public</span>
</div>
</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-info">
<h4 class="service-name">Ansible Sandbox</h4>
@ -902,7 +902,7 @@
<div class="footer-links-column">
<h3 class="footer-heading">Platforms</h3>
<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://ai.argobox.com" class="footer-link">OpenWebUI</a>
</div>
@ -926,14 +926,7 @@
</div>
<div class="footer-bottom">
<div class="copyright">
&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>
<p>&copy; <span id="current-year">2025</span> All rights reserved. Inovin LLC</p>
</div>
</div>
</footer>

View File

@ -1346,7 +1346,7 @@ section {
/* Contact Section */
.contact {
padding: 6rem 0;
background: var(--secondary-bg);
background: var(--primary-bg);
}
.contact-grid {
@ -1451,9 +1451,20 @@ section {
/* Footer */
.footer {
background-color: var(--secondary-bg);
background-color: var(--primary-bg);
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 {
@ -1511,13 +1522,16 @@ section {
}
.footer-bottom {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 2rem;
border-top: 1px solid var(--border);
color: var(--text-secondary);
margin-top: 2rem;
padding-top: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.05);
text-align: center;
font-size: 0.9rem;
color: var(--text-secondary);
}
.footer-bottom p {
margin: 0;
}
.footer-extra-link {