Add comprehensive environment-based configuration system: - Created config.js module to centralize all environment variables - Updated server.js to use config module for all settings - Added /api/config endpoint to expose company info to frontend - Created init.js to dynamically inject config into HTML pages - Updated .env.example with comprehensive configuration options - Added data attributes to index.html for dynamic content - Updated Dockerfile to include config.js This allows users to customize: - Company name, tagline, and description - Branding colors (primary, accent, dark) - Contact information (email, phone, address, hours) - Social media links - About page content - Services offered 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
245 lines
13 KiB
HTML
245 lines
13 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Ryans Recruit Firm - Find Your Dream Job</title>
|
|
<link rel="stylesheet" href="/css/styles.css">
|
|
<script src="/js/init.js"></script>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<nav class="container">
|
|
<div class="logo" data-company-name>Ryans Recruit Firm</div>
|
|
<ul class="nav-links">
|
|
<li><a href="/" class="active">Home</a></li>
|
|
<li><a href="/about">About</a></li>
|
|
<li><a href="/services">Services</a></li>
|
|
<li><a href="/jobs">Jobs</a></li>
|
|
<li><a href="/contact">Contact</a></li>
|
|
<li><a href="/admin/login" class="btn btn-primary btn-sm">Admin</a></li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
|
|
<section class="hero">
|
|
<div class="container">
|
|
<h1 data-company-tagline>Your Career Success Is Our Mission</h1>
|
|
<p data-company-description>Connecting talented professionals with leading companies worldwide</p>
|
|
<div style="display: flex; gap: 1rem; justify-content: center; margin-top: 2rem;">
|
|
<a href="/jobs" class="btn btn-primary btn-lg">Browse Jobs</a>
|
|
<a href="/contact" class="btn btn-secondary btn-lg">Get in Touch</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section>
|
|
<div class="container">
|
|
<div class="section-title">
|
|
<h2>Why Choose <span data-company-name>Ryans Recruit Firm</span>?</h2>
|
|
<p>We're committed to finding the perfect match for both candidates and employers</p>
|
|
</div>
|
|
|
|
<div class="grid grid-3">
|
|
<div class="card text-center">
|
|
<div style="font-size: 3rem; margin-bottom: 1rem;">🎯</div>
|
|
<h3>Targeted Matching</h3>
|
|
<p>Our advanced screening process ensures we match the right talent with the right opportunity, saving time and increasing success rates.</p>
|
|
</div>
|
|
|
|
<div class="card text-center">
|
|
<div style="font-size: 3rem; margin-bottom: 1rem;">🌍</div>
|
|
<h3>Global Network</h3>
|
|
<p>Access to positions across multiple industries and locations, from startups to Fortune 500 companies worldwide.</p>
|
|
</div>
|
|
|
|
<div class="card text-center">
|
|
<div style="font-size: 3rem; margin-bottom: 1rem;">🤝</div>
|
|
<h3>Personal Support</h3>
|
|
<p>Dedicated recruiters guide you through every step, from application to offer negotiation and beyond.</p>
|
|
</div>
|
|
|
|
<div class="card text-center">
|
|
<div style="font-size: 3rem; margin-bottom: 1rem;">⚡</div>
|
|
<h3>Fast Process</h3>
|
|
<p>Streamlined recruitment process with quick turnaround times, getting you in front of hiring managers faster.</p>
|
|
</div>
|
|
|
|
<div class="card text-center">
|
|
<div style="font-size: 3rem; margin-bottom: 1rem;">💼</div>
|
|
<h3>Industry Experts</h3>
|
|
<p>Our team has deep expertise across technology, finance, healthcare, and more, understanding what companies need.</p>
|
|
</div>
|
|
|
|
<div class="card text-center">
|
|
<div style="font-size: 3rem; margin-bottom: 1rem;">🎓</div>
|
|
<h3>Career Coaching</h3>
|
|
<p>Free resume reviews, interview preparation, and career advice to help you land your dream role.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section style="background: var(--bg-white);">
|
|
<div class="container">
|
|
<div class="section-title">
|
|
<h2>Our Success Stories</h2>
|
|
<p>Hear from professionals who found their dream jobs through us</p>
|
|
</div>
|
|
|
|
<div class="grid grid-2">
|
|
<div class="card">
|
|
<p style="font-style: italic; color: var(--text-light); margin-bottom: 1rem;">
|
|
"Ryans Recruit Firm found me the perfect role in just two weeks. Their team understood exactly what I was looking for and matched me with a company that aligned with my career goals. Highly recommended!"
|
|
</p>
|
|
<div style="display: flex; align-items: center; gap: 1rem;">
|
|
<div style="width: 50px; height: 50px; border-radius: 50%; background: var(--primary-color); display: flex; align-items: center; justify-content: center; color: white; font-weight: 700;">SJ</div>
|
|
<div>
|
|
<div style="font-weight: 600;">Sarah Johnson</div>
|
|
<div style="font-size: 0.875rem; color: var(--text-light);">Senior Software Engineer</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<p style="font-style: italic; color: var(--text-light); margin-bottom: 1rem;">
|
|
"The personalized support I received was incredible. From resume refinement to interview coaching, they were with me every step of the way. I'm now working at my dream company!"
|
|
</p>
|
|
<div style="display: flex; align-items: center; gap: 1rem;">
|
|
<div style="width: 50px; height: 50px; border-radius: 50%; background: var(--accent-color); display: flex; align-items: center; justify-content: center; color: white; font-weight: 700;">MC</div>
|
|
<div>
|
|
<div style="font-weight: 600;">Michael Chen</div>
|
|
<div style="font-size: 0.875rem; color: var(--text-light);">Product Manager</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<p style="font-style: italic; color: var(--text-light); margin-bottom: 1rem;">
|
|
"As a hiring manager, I've worked with many recruiting firms, but Ryans stands out. They consistently deliver high-quality candidates who are well-screened and truly interested in our opportunities."
|
|
</p>
|
|
<div style="display: flex; align-items: center; gap: 1rem;">
|
|
<div style="width: 50px; height: 50px; border-radius: 50%; background: var(--success); display: flex; align-items: center; justify-content: center; color: white; font-weight: 700;">EP</div>
|
|
<div>
|
|
<div style="font-weight: 600;">Emily Parker</div>
|
|
<div style="font-size: 0.875rem; color: var(--text-light);">HR Director</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<p style="font-style: italic; color: var(--text-light); margin-bottom: 1rem;">
|
|
"After months of unsuccessful job hunting, Ryans helped me land a position that exceeded my salary expectations. Their expertise in negotiation made a huge difference!"
|
|
</p>
|
|
<div style="display: flex; align-items: center; gap: 1rem;">
|
|
<div style="width: 50px; height: 50px; border-radius: 50%; background: var(--warning); display: flex; align-items: center; justify-content: center; color: white; font-weight: 700;">DK</div>
|
|
<div>
|
|
<div style="font-weight: 600;">David Kim</div>
|
|
<div style="font-size: 0.875rem; color: var(--text-light);">Data Scientist</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section>
|
|
<div class="container">
|
|
<div class="section-title">
|
|
<h2>How It Works</h2>
|
|
<p>Getting started is simple and straightforward</p>
|
|
</div>
|
|
|
|
<div class="grid grid-4">
|
|
<div class="text-center">
|
|
<div style="width: 80px; height: 80px; border-radius: 50%; background: var(--primary-color); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem; font-weight: 700; margin: 0 auto 1rem;">1</div>
|
|
<h4>Browse Jobs</h4>
|
|
<p>Explore our curated job listings across various industries and locations.</p>
|
|
</div>
|
|
|
|
<div class="text-center">
|
|
<div style="width: 80px; height: 80px; border-radius: 50%; background: var(--primary-color); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem; font-weight: 700; margin: 0 auto 1rem;">2</div>
|
|
<h4>Submit Application</h4>
|
|
<p>Apply with your resume and let us know what you're looking for.</p>
|
|
</div>
|
|
|
|
<div class="text-center">
|
|
<div style="width: 80px; height: 80px; border-radius: 50%; background: var(--primary-color); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem; font-weight: 700; margin: 0 auto 1rem;">3</div>
|
|
<h4>Get Matched</h4>
|
|
<p>Our team reviews your profile and matches you with suitable opportunities.</p>
|
|
</div>
|
|
|
|
<div class="text-center">
|
|
<div style="width: 80px; height: 80px; border-radius: 50%; background: var(--primary-color); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem; font-weight: 700; margin: 0 auto 1rem;">4</div>
|
|
<h4>Start Your Journey</h4>
|
|
<p>Receive support throughout interviews and land your dream job!</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center" style="margin-top: 3rem;">
|
|
<a href="/jobs" class="btn btn-primary btn-lg">View Open Positions</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section style="background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%); color: white;">
|
|
<div class="container text-center">
|
|
<h2 style="color: white; margin-bottom: 1rem;">Ready to Take the Next Step?</h2>
|
|
<p style="color: rgba(255, 255, 255, 0.9); font-size: 1.125rem; margin-bottom: 2rem;">
|
|
Join thousands of professionals who have found their dream jobs through Ryans Recruit Firm
|
|
</p>
|
|
<div style="display: flex; gap: 1rem; justify-content: center;">
|
|
<a href="/jobs" class="btn btn-lg" style="background: white; color: var(--primary-color);">Browse Jobs</a>
|
|
<a href="/contact" class="btn btn-secondary btn-lg">Contact Us</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<footer>
|
|
<div class="container">
|
|
<div class="footer-content">
|
|
<div class="footer-section">
|
|
<h3 data-company-name>Ryans Recruit Firm</h3>
|
|
<p style="color: rgba(255, 255, 255, 0.8);" data-company-description>
|
|
Your trusted partner in career advancement and talent acquisition.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="footer-section">
|
|
<h3>Quick Links</h3>
|
|
<ul>
|
|
<li><a href="/">Home</a></li>
|
|
<li><a href="/about">About Us</a></li>
|
|
<li><a href="/services">Services</a></li>
|
|
<li><a href="/jobs">Job Listings</a></li>
|
|
<li><a href="/contact">Contact</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="footer-section">
|
|
<h3>For Employers</h3>
|
|
<ul>
|
|
<li><a href="/contact">Post a Job</a></li>
|
|
<li><a href="/contact">Our Process</a></li>
|
|
<li><a href="/contact">Pricing</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="footer-section">
|
|
<h3>Contact</h3>
|
|
<ul>
|
|
<li>Email: <a href="mailto:info@ryansrecruit.com" data-contact-email>info@ryansrecruit.com</a></li>
|
|
<li>Phone: <a href="tel:+15551234567" data-contact-phone>+1 (555) 123-4567</a></li>
|
|
<li>Hours: <span data-business-hours>Mon-Fri 9AM-6PM EST</span></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer-bottom">
|
|
<p>© 2026 Ryans Recruit Firm. All rights reserved.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html>
|