a1e41ac6e3
Carried over from a prior session. Preserved on the feature branch for review rather than discarded; Scott can decide what to merge.
357 lines
11 KiB
Text
357 lines
11 KiB
Text
---
|
|
const currentYear = new Date().getFullYear();
|
|
---
|
|
|
|
<footer class="site-footer">
|
|
<div class="footer-container">
|
|
|
|
<div class="footer-main">
|
|
<div class="footer-brand">
|
|
<span class="footer-logo">Scott Scoble</span>
|
|
<p class="footer-tagline">The human cultivation expert for the AI age.</p>
|
|
<p class="footer-email">📧 <span id="footer-email-link" data-user="scott" data-domain="scoble.me"></span></p>
|
|
<script>
|
|
(function() {
|
|
const el = document.getElementById('footer-email-link');
|
|
if (!el) return;
|
|
const user = el.getAttribute('data-user');
|
|
const domain = el.getAttribute('data-domain');
|
|
const email = user + '@' + domain;
|
|
el.innerHTML = '<a href="mailto:' + email + '">' + email + '</a>';
|
|
})();
|
|
</script>
|
|
|
|
<!-- Footer newsletter form handler -->
|
|
<script>
|
|
(function() {
|
|
const form = document.getElementById('footer-newsletter-form');
|
|
if (!form) return;
|
|
const successEl = form.parentElement.querySelector('.footer-newsletter-success');
|
|
const errorEl = form.parentElement.querySelector('.footer-newsletter-error');
|
|
const submitBtn = form.querySelector('button[type="submit"]');
|
|
|
|
form.addEventListener('submit', async (e) => {
|
|
e.preventDefault();
|
|
submitBtn.disabled = true;
|
|
submitBtn.textContent = 'Subscribing...';
|
|
errorEl.style.display = 'none';
|
|
errorEl.textContent = '';
|
|
successEl.style.display = 'none';
|
|
|
|
try {
|
|
const formData = new FormData(form);
|
|
formData.append('_subject', 'Newsletter Subscribe - Scott Scoble');
|
|
|
|
const response = await fetch('https://formsubmit.co/ajax/scott@scoble.me', {
|
|
method: 'POST',
|
|
body: formData,
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (!response.ok || result.success !== 'true') {
|
|
throw new Error(result.message || 'Subscription failed. Please try again.');
|
|
}
|
|
|
|
form.style.display = 'none';
|
|
successEl.style.display = '';
|
|
} catch (err) {
|
|
errorEl.textContent = err.message || 'Something went wrong. Please try again.';
|
|
errorEl.style.display = '';
|
|
submitBtn.disabled = false;
|
|
submitBtn.textContent = 'Subscribe';
|
|
}
|
|
});
|
|
})();
|
|
</script>
|
|
|
|
<div class="footer-social">
|
|
<a href="https://linkedin.com/in/scottscoble" target="_blank" rel="noopener me" class="social-link" aria-label="Follow on LinkedIn for AI insights and leadership perspectives" data-umami-event="footer-linkedin-click">
|
|
<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>
|
|
<span class="social-label">Follow for AI Insights</span>
|
|
</a>
|
|
<a href="https://x.com/scottscoble" target="_blank" rel="noopener me" class="social-link" aria-label="Follow on X/Twitter for daily thoughts on cultivation and AI" data-umami-event="footer-x-click">
|
|
<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>
|
|
<span class="social-label">Daily Thoughts</span>
|
|
</a>
|
|
<a href="https://github.com/wscoble" target="_blank" rel="noopener me" class="social-link" aria-label="Explore open source projects on GitHub" data-umami-event="footer-github-click">
|
|
<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor"><path d="M12 0C5.374 0 0 5.373 0 12c0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.605-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.509 11.509 0 0112 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12z"/></svg>
|
|
<span class="social-label">Open Source</span>
|
|
</a>
|
|
<a href="https://www.amazon.com/stores/Scott-Scoble/author/B0GKSSBDMK" target="_blank" rel="noopener me" class="social-link" aria-label="Scott Scoble author page on Amazon" data-umami-event="footer-amazon-click">
|
|
<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor"><path d="M13.23 10.56V10c0-1.2.63-2.1 1.68-2.1.87 0 1.5.64 1.5 1.48 0 .96-1.04 1.76-3.18 3.18zm-4.2 8.68c-2.12 0-4.08-.76-5.48-2.26-.24-.26-.15-.66.2-.78l2.68-.92c.33-.1.66.1.82.4.56.96 1.5 1.5 2.64 1.5 2.3 0 3.34-1.84 3.78-3.34-1.3.52-2.64.78-4.04.78-3.18 0-6.08-1.72-7.2-4.44-.24-.58-.38-1.24-.38-1.92 0-2.92 2.62-6.34 7.2-6.34 2.98 0 5.68 1.24 7.08 3.18 1.44 1.98 1.26 5.08-.24 7.54-1.16 1.92-3.24 3.36-5.46 3.46zM22.46 21l-2.34-.7c-.3-.08-.5-.36-.42-.66.08-.3.36-.5.66-.42l2.34.7c.3.1.48.4.4.7-.1.3-.38.5-.68.4z"/></svg>
|
|
<span class="social-label">Books on Amazon</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer-newsletter">
|
|
<h4>Stay in the loop</h4>
|
|
<p>Get updates on new talks, workshops, and writings.</p>
|
|
<form class="newsletter-form" id="footer-newsletter-form">
|
|
<div style="position: absolute; left: -9999px;" aria-hidden="true">
|
|
<input type="text" name="_gotcha" tabindex="-1" autocomplete="off" />
|
|
</div>
|
|
<input type="email" name="email" placeholder="Your email" required />
|
|
<button type="submit">Subscribe</button>
|
|
</form>
|
|
<div class="footer-newsletter-success" style="display:none;">
|
|
<p><strong>You're subscribed!</strong> Check your inbox for the welcome email.</p>
|
|
</div>
|
|
<div class="footer-newsletter-error" style="display:none;"></div>
|
|
<p class="newsletter-note">No spam. Unsubscribe anytime.</p>
|
|
</div>
|
|
|
|
<div class="footer-links">
|
|
<div class="footer-col">
|
|
<h4>Pages</h4>
|
|
<a href="/">Home</a>
|
|
<a href="/speaking">Speaking</a>
|
|
<a href="/consulting">Consulting</a>
|
|
<a href="/about">About</a>
|
|
</div>
|
|
|
|
<div class="footer-col">
|
|
<h4>Resources</h4>
|
|
<a href="/books">Books</a>
|
|
<a href="/blog">Blog</a>
|
|
<a href="/contact">Contact</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer-bottom">
|
|
<p>© {currentYear} Scott Scoble. All rights reserved.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<style>
|
|
.site-footer {
|
|
background: var(--color-brown-dark);
|
|
color: var(--color-cream);
|
|
padding: 4rem 0 2rem;
|
|
}
|
|
|
|
.footer-container {
|
|
max-width: 1200px;
|
|
margin: 0 auto;
|
|
padding: 0 2rem;
|
|
}
|
|
|
|
.footer-main {
|
|
display: grid;
|
|
grid-template-columns: 1.5fr 1.5fr 1fr;
|
|
gap: 3rem;
|
|
padding-bottom: 3rem;
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
.footer-logo {
|
|
font-family: var(--font-heading);
|
|
font-size: 1.5rem;
|
|
font-weight: 600;
|
|
color: white;
|
|
display: block;
|
|
margin-bottom: 0.75rem;
|
|
}
|
|
|
|
.footer-tagline {
|
|
color: rgba(255, 255, 255, 0.7);
|
|
margin: 0 0 1.5rem;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.footer-email {
|
|
margin: 0 0 1.5rem;
|
|
font-size: 0.9375rem;
|
|
color: rgba(255, 255, 255, 0.8);
|
|
}
|
|
|
|
.footer-email a {
|
|
color: var(--color-amber);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.footer-email a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.footer-social {
|
|
display: flex;
|
|
gap: 0.75rem;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.social-link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0.375rem;
|
|
color: rgba(255, 255, 255, 0.7);
|
|
text-decoration: none;
|
|
font-size: 0.8125rem;
|
|
padding: 0.375rem 0.625rem;
|
|
border-radius: 6px;
|
|
border: 1px solid rgba(255, 255, 255, 0.12);
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
.social-link:hover {
|
|
color: var(--color-amber);
|
|
border-color: var(--color-amber);
|
|
background: rgba(200, 149, 46, 0.08);
|
|
}
|
|
|
|
.social-label {
|
|
font-weight: 500;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.footer-newsletter {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.5rem;
|
|
}
|
|
|
|
.footer-newsletter h4 {
|
|
font-size: 0.875rem;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.1em;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
margin: 0 0 0.25rem;
|
|
}
|
|
|
|
.footer-newsletter p {
|
|
color: rgba(255, 255, 255, 0.8);
|
|
font-size: 0.9375rem;
|
|
margin: 0 0 1rem;
|
|
}
|
|
|
|
.footer-newsletter-success {
|
|
text-align: center;
|
|
padding: 1rem;
|
|
background: rgba(61, 90, 62, 0.6);
|
|
color: white;
|
|
border-radius: 6px;
|
|
font-size: 0.875rem;
|
|
}
|
|
|
|
.footer-newsletter-success p {
|
|
color: white;
|
|
margin: 0;
|
|
}
|
|
|
|
.footer-newsletter-error {
|
|
background: #dc2626;
|
|
color: white;
|
|
padding: 0.75rem;
|
|
border-radius: 4px;
|
|
font-size: 0.8125rem;
|
|
width: 100%;
|
|
}
|
|
|
|
.newsletter-form {
|
|
display: flex;
|
|
gap: 0.5rem;
|
|
}
|
|
|
|
.newsletter-form input {
|
|
flex: 1;
|
|
padding: 0.625rem 0.875rem;
|
|
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
border-radius: 4px;
|
|
background: rgba(0, 0, 0, 0.2);
|
|
color: white;
|
|
font-size: 0.9375rem;
|
|
}
|
|
|
|
.newsletter-form input:focus {
|
|
outline: none;
|
|
border-color: var(--color-amber);
|
|
}
|
|
|
|
.newsletter-form button {
|
|
padding: 0.625rem 1.25rem;
|
|
background: var(--color-amber);
|
|
color: white;
|
|
border: none;
|
|
border-radius: 4px;
|
|
font-weight: 600;
|
|
font-size: 0.9375rem;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.newsletter-form button:hover {
|
|
background: var(--color-amber-light);
|
|
}
|
|
|
|
.newsletter-note {
|
|
font-size: 0.75rem;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
margin: 0;
|
|
}
|
|
|
|
.footer-links {
|
|
display: flex;
|
|
gap: 2rem;
|
|
}
|
|
|
|
.footer-col {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.75rem;
|
|
}
|
|
|
|
.footer-col h4 {
|
|
font-size: 0.875rem;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.1em;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
margin: 0 0 0.5rem;
|
|
}
|
|
|
|
.footer-col a {
|
|
color: rgba(255, 255, 255, 0.8);
|
|
text-decoration: none;
|
|
font-size: 0.9375rem;
|
|
transition: color 0.2s ease;
|
|
}
|
|
|
|
.footer-col a:hover {
|
|
color: var(--color-amber);
|
|
}
|
|
|
|
.footer-bottom {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
font-size: 0.875rem;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
|
|
@media (max-width: 960px) {
|
|
.footer-main {
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 640px) {
|
|
.footer-main {
|
|
grid-template-columns: 1fr;
|
|
gap: 2rem;
|
|
}
|
|
|
|
.footer-links {
|
|
gap: 2rem;
|
|
}
|
|
|
|
.footer-bottom {
|
|
flex-direction: column;
|
|
gap: 1rem;
|
|
text-align: center;
|
|
}
|
|
}
|
|
</style>
|