feat: added lots of work to landing page
This commit is contained in:
Blake Ridgway
330
templates/about.html
Normal file
330
templates/about.html
Normal file
@@ -0,0 +1,330 @@
|
||||
{{define "about"}}
|
||||
|
||||
<div class="contact-about-page">
|
||||
<div class="hero-section">
|
||||
<h1>About RideAware</h1>
|
||||
<p>Smart cycling training for every level</p>
|
||||
</div>
|
||||
|
||||
<div class="about-content">
|
||||
<div class="about-text">
|
||||
<h2>Our Mission</h2>
|
||||
<p>
|
||||
RideAware is dedicated to making cycling training accessible,
|
||||
effective, and enjoyable for cyclists of all levels. We provide
|
||||
intelligent training plans, real-time analytics, and community support
|
||||
to help you achieve your cycling goals.
|
||||
</p>
|
||||
<p>
|
||||
Every ride counts. We believe smart training combined with technology
|
||||
can unlock your full potential as a cyclist.
|
||||
</p>
|
||||
<ul>
|
||||
<li>AI-powered adaptive training plans</li>
|
||||
<li>Real-time performance analytics</li>
|
||||
<li>Expert coaching and guidance</li>
|
||||
<li>Community-driven motivation</li>
|
||||
<li>Seamless device integration</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="about-image">
|
||||
<div style="
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
background: var(--gradient);
|
||||
border-radius: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white;
|
||||
font-size: 4rem;
|
||||
">
|
||||
<i class="fas fa-bicycle"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="values-section">
|
||||
<div class="section-header">
|
||||
<h2>Our Values</h2>
|
||||
<p>What drives our mission</p>
|
||||
</div>
|
||||
|
||||
<div class="values-grid">
|
||||
<div class="value-card">
|
||||
<div class="value-icon">
|
||||
<i class="fas fa-heart"></i>
|
||||
</div>
|
||||
<h3>Passion</h3>
|
||||
<p>
|
||||
We're cyclists ourselves. We understand the dedication it takes
|
||||
to improve and achieve your goals.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="value-card">
|
||||
<div class="value-icon">
|
||||
<i class="fas fa-brain"></i>
|
||||
</div>
|
||||
<h3>Intelligence</h3>
|
||||
<p>
|
||||
Our AI-driven platform learns from your performance to deliver
|
||||
personalized training that actually works.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="value-card">
|
||||
<div class="value-icon">
|
||||
<i class="fas fa-users"></i>
|
||||
</div>
|
||||
<h3>Community</h3>
|
||||
<p>
|
||||
Cycling is better together. Connect with other riders, share
|
||||
achievements, and push each other forward.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="value-card">
|
||||
<div class="value-icon">
|
||||
<i class="fas fa-chart-line"></i>
|
||||
</div>
|
||||
<h3>Transparency</h3>
|
||||
<p>
|
||||
See all your data clearly. We believe in giving you the insights
|
||||
you need to understand your progress.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="value-card">
|
||||
<div class="value-icon">
|
||||
<i class="fas fa-lightbulb"></i>
|
||||
</div>
|
||||
<h3>Innovation</h3>
|
||||
<p>
|
||||
Technology should enhance your cycling, not complicate it.
|
||||
We're constantly improving to serve you better.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="value-card">
|
||||
<div class="value-icon">
|
||||
<i class="fas fa-medal"></i>
|
||||
</div>
|
||||
<h3>Excellence</h3>
|
||||
<p>
|
||||
Whether you're training for a race or personal satisfaction,
|
||||
we help you reach peak performance.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="team-section">
|
||||
<div class="team-container">
|
||||
<div class="team-header">
|
||||
<h2>Meet Our Team</h2>
|
||||
<p>Cyclists and engineers building the future of training</p>
|
||||
</div>
|
||||
|
||||
<div class="team-grid">
|
||||
<div class="team-member">
|
||||
<div class="team-member-image">
|
||||
<i class="fas fa-user-circle"></i>
|
||||
</div>
|
||||
<div class="team-member-info">
|
||||
<h3>Blake Ridgway</h3>
|
||||
<p>Founder & CEO</p>
|
||||
<div class="bio">
|
||||
Building the future of cycling training with scalable infrastructure
|
||||
and performant systems. Passionate about Infrastructure-as-Code,
|
||||
cloud networking, and creating observable platforms that ship faster
|
||||
with confidence.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="team-member">
|
||||
<div class="team-member-image">
|
||||
<i class="fas fa-user-circle"></i>
|
||||
</div>
|
||||
<div class="team-member-info">
|
||||
<h3>Cycling Experts</h3>
|
||||
<p>Training Advisors</p>
|
||||
<div class="bio">
|
||||
Professional cyclists and coaches ensuring our training plans
|
||||
are effective and science-based.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="team-member">
|
||||
<div class="team-member-image">
|
||||
<i class="fas fa-user-circle"></i>
|
||||
</div>
|
||||
<div class="team-member-info">
|
||||
<h3>You</h3>
|
||||
<p>Community</p>
|
||||
<div class="bio">
|
||||
Every rider using RideAware is part of our team. Your feedback
|
||||
shapes our future.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="stats-section">
|
||||
<div class="section-header">
|
||||
<h2>By The Numbers</h2>
|
||||
<p>Growth and impact</p>
|
||||
</div>
|
||||
|
||||
<div class="stats-grid">
|
||||
<div class="stat-box">
|
||||
<div class="stat-number">Coming</div>
|
||||
<div class="stat-label">Q4 2026</div>
|
||||
</div>
|
||||
|
||||
<div class="stat-box">
|
||||
<div class="stat-number">∞</div>
|
||||
<div class="stat-label">Potential</div>
|
||||
</div>
|
||||
|
||||
<div class="stat-box">
|
||||
<div class="stat-number">100%</div>
|
||||
<div class="stat-label">Passion</div>
|
||||
</div>
|
||||
|
||||
<div class="stat-box">
|
||||
<div class="stat-number">You</div>
|
||||
<div class="stat-label">In Control</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq-section">
|
||||
<div class="section-header">
|
||||
<h2>Frequently Asked Questions</h2>
|
||||
</div>
|
||||
|
||||
<div class="faq-container">
|
||||
<div class="faq-item">
|
||||
<div class="faq-question">
|
||||
<h3>When is RideAware launching?</h3>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
<div class="faq-answer">
|
||||
<p>
|
||||
We're launching Q4 2026! Sign up for our newsletter to get
|
||||
early access and exclusive launch day bonuses.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq-item">
|
||||
<div class="faq-question">
|
||||
<h3>How much will it cost?</h3>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
<div class="faq-answer">
|
||||
<p>
|
||||
Pricing details coming soon. We're committed to making RideAware
|
||||
accessible to cyclists at all price points.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq-item">
|
||||
<div class="faq-question">
|
||||
<h3>What devices does RideAware support?</h3>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
<div class="faq-answer">
|
||||
<p>
|
||||
RideAware works on iOS, Android, web, and integrates with all
|
||||
major fitness trackers and cycling computers (Garmin, Wahoo, etc.).
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq-item">
|
||||
<div class="faq-question">
|
||||
<h3>Is my data private?</h3>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
<div class="faq-answer">
|
||||
<p>
|
||||
Yes. Your training data is yours alone. We'll never sell or share
|
||||
your personal information with third parties.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq-item">
|
||||
<div class="faq-question">
|
||||
<h3>Can I import my current training data?</h3>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
<div class="faq-answer">
|
||||
<p>
|
||||
Yes! RideAware will integrate with Strava, TrainingPeaks, and other
|
||||
platforms so you can bring all your history with you.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="cta-section" style="
|
||||
background: var(--gradient);
|
||||
padding: 4rem 2rem;
|
||||
text-align: center;
|
||||
color: white;
|
||||
border-radius: 16px;
|
||||
margin: 4rem 2rem;
|
||||
">
|
||||
<h2>Ready to Elevate Your Cycling?</h2>
|
||||
<p style="opacity: 0.9; margin: 1rem 0 2rem;">
|
||||
Join the waitlist and be first to know when we launch
|
||||
</p>
|
||||
<a href="/" class="action-btn primary" style="
|
||||
background: white;
|
||||
color: var(--primary);
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
border-radius: 50px;
|
||||
padding: 0.8rem 2rem;
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
">
|
||||
Join the Waitlist
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// FAQ accordion toggle
|
||||
document.querySelectorAll('.faq-question').forEach((question) => {
|
||||
question.addEventListener('click', () => {
|
||||
const item = question.parentElement;
|
||||
const answer = item.querySelector('.faq-answer');
|
||||
const isOpen = item.classList.contains('open');
|
||||
|
||||
// Close all other items
|
||||
document.querySelectorAll('.faq-item').forEach((faq) => {
|
||||
faq.classList.remove('open');
|
||||
});
|
||||
|
||||
// Toggle current item
|
||||
if (!isOpen) {
|
||||
item.classList.add('open');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
{{end}}
|
||||
Reference in New Issue
Block a user