commit c20a6e9b011f2039c8443f11c882e3b81903d5b9 Author: Ryan Mwangi Date: Sat Aug 31 16:06:03 2024 +0300 Initial commit diff --git a/form-handler.js b/form-handler.js new file mode 100644 index 0000000..3d407b0 --- /dev/null +++ b/form-handler.js @@ -0,0 +1,32 @@ +document.getElementById('applicationForm').addEventListener('submit', function(event) { + event.preventDefault(); + + // Get form data + const formData = new FormData(this); + + // Convert form data to an object + const data = Object.fromEntries(formData.entries()); + + // Display the form data in the console + console.log(data); + + // Send form data to a server-side script + fetch('your-server-endpoint', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify(data), + }) + .then(response => response.json()) + .then(result => { + console.log('Success:', result); + // Redirect or show a success message here + }) + .catch(error => { + console.error('Error:', error); + }); + + // Display a thank you message (or redirect to another page) + document.body.innerHTML = '

Thank you for your application!

'; +}); diff --git a/images/logo.png b/images/logo.png new file mode 100644 index 0000000..2ead8ef Binary files /dev/null and b/images/logo.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..6340c2c --- /dev/null +++ b/index.html @@ -0,0 +1,79 @@ + + + + + + Tech Launchpad Traineeship Program + + + + +
+
+ +
+
+

Welcome to Tech Launchpad Traineeship

+

Where Tech Careers Begin

+ Apply Now +
+
+ + +
+
+

About the Program

+

The Tech Launchpad Traineeship Program is designed for aspiring IT professionals who want to build a solid foundation in the tech industry. We get to assist you in honing your technical skills for the challenges and opportunities in today’s technology landscape.

+
+
+ + +
+
+

Recommended IT courses

+ +
+
+ + +
+
+

What Our Trainees Say

+
+

"Tech Launchpad gave me the skills and confidence I needed to start my career in IT. The mentorship and real-world experience were invaluable!"

+ — Ryan Mwangi, Software Developer +
+
+
+ + +
+
+

Get Started

+

Ready to take the next step in your IT career? Apply today!

+
+ + + + +
+
+ +
+ + + + + + + diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..49b02bc --- /dev/null +++ b/styles.css @@ -0,0 +1,135 @@ +/* Basic Reset */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: Arial, sans-serif; + line-height: 1.6; + color: #333; +} + +.container { + max-width: 1100px; + margin: auto; + padding: 20px; +} + +/* Header */ +header { + background: #004080; + color: #fff; + padding: 60px 0; + text-align: center; +} + +header h1 { + font-size: 2.5rem; + margin-bottom: 20px; +} + +header p { + font-size: 1.2rem; + margin-bottom: 30px; +} + +header .cta-button { + background: #ff9900; + color: #fff; + padding: 10px 20px; + text-decoration: none; + font-size: 1.2rem; + border-radius: 5px; +} + +header .cta-button:hover { + background: #cc7a00; +} + +.logo-container { + position: absolute; + top: 60px; + left: 10px; +} + +.logo { + max-width: 150px; + height: auto; +} + +/* Sections */ +section { + padding: 40px 0; +} + +section h2 { + font-size: 2rem; + margin-bottom: 20px; + color: #004080; +} + +/* Curriculum */ +#curriculum ul { + list-style: none; + padding-left: 20px; +} + +#curriculum ul li { + margin-bottom: 10px; +} + +/* Testimonials */ +#testimonials blockquote { + font-size: 1.2rem; + font-style: italic; + margin: 20px 0; + color: #666; +} + +#testimonials cite { + font-size: 1rem; + color: #333; + font-style: normal; +} + +/* Call to Action Form */ +form { + display: flex; + flex-direction: column; +} + +form input, +form textarea { + margin-bottom: 15px; + padding: 10px; + font-size: 1rem; + border: 1px solid #ccc; + border-radius: 5px; +} + +form button { + background: #004080; + color: #fff; + padding: 10px 20px; + font-size: 1.2rem; + border: none; + border-radius: 5px; + cursor: pointer; +} + +form button:hover { + background: #00264d; +} + +/* Footer */ +footer { + background: #f4f4f4; + text-align: center; + padding: 20px 0; +} + +footer p { + font-size: 0.9rem; +}