Skip to content

Commit

Permalink
onboarding form updated
Browse files Browse the repository at this point in the history
  • Loading branch information
burnt-exe committed Mar 27, 2024
1 parent 38c18b4 commit b3c0b07
Show file tree
Hide file tree
Showing 2 changed files with 103 additions and 101 deletions.
65 changes: 33 additions & 32 deletions about-us.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,59 +3,60 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>About Skunkworks</title>
<script src="https://cdn.tailwindcss.com"></script>
<title>About Us - Skunkworks Academy</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet">
<style>
.header-blue { background-color: #0f62fe; }
.bg-light-blue { background-color: #e0f2fe; }
.border-custom { border: 3px solid #0f62fe; }
.container {
max-width: 1200px;
margin: auto;
padding: 2rem;
}
.text-center { text-align: center; }
.text-white { color: white; }
.mb-4 { margin-bottom: 1rem; }
.p-4 { padding: 1rem; }
.p-10 { padding: 2.5rem; }
.hover\:underline:hover { text-decoration: underline; }
</style>
</head>

<body class="font-roboto bg-light-blue text-gray-900">

<header class="header-blue text-white text-center p-10">
<nav class="flex justify-center space-x-4">
<nav class="flex justify-center space-x-4 mb-4">
<a href="index.html" class="text-white hover:underline">Home</a>
<a href="about-us.html" class="text-white hover:underline">About Us</a>
<a href="course-catalog.html" class="text-white hover:underline">Course Catalog</a>
<a href="contact.html" class="text-white hover:underline">Contact</a>
</nav>
<h1 class="text-4xl font-bold">About Skunkworks</h1>
<h1 class="text-4xl font-bold">About Us</h1>
</header>

<div class="container mx-auto p-8">
<div class="bg-white p-6 border-custom rounded mb-4">
<h2 class="text-2xl font-bold mb-2">Skunkworks EdTech - Microsoft Repository</h2>
<p class="mb-4">
Welcome to the Skunkworks EdTech Microsoft Repository, a hub of innovation and learning. As proud Microsoft business partners, we at Skunkworksza are dedicated to leveraging the power of technology to revolutionize education. This public repository serves as a cornerstone for our mission, offering a diverse range of educational scripts, tools, and resources.
</p>
<a href="https://github.com/skunkworksza/skunkworks.github.io" class="text-blue-700 hover:text-blue-800">Explore our GitHub Repository</a>
</div>
<section class="mb-8">
<h2 class="text-3xl font-bold mb-4">Our Mission</h2>
<p>Skunkworks Academy is dedicated to empowering students and professionals by providing top-notch education in technology and innovation. We strive to bridge the gap between theoretical knowledge and practical application.</p>
</section>

<div class="bg-white p-6 border-custom rounded mb-4">
<h2 class="text-2xl font-bold mb-2">Our Mission</h2>
<p class="mb-4">
Our mission is to empower educators, students, and tech enthusiasts by providing them with powerful tools and comprehensive learning materials. We focus on scripting, automation, and innovative tech solutions to make learning more accessible, engaging, and effective.
</p>
</div>
<section class="mb-8">
<h2 class="text-3xl font-bold mb-4">Our Vision</h2>
<p>We envision a world where anyone, anywhere, has the tools and opportunities to pursue their dreams in technology and make a significant impact on the future.</p>
</section>

<div class="bg-white p-6 border-custom rounded mb-4">
<h2 class="text-2xl font-bold mb-2">Recent Projects</h2>
<ul class="list-disc pl-5 mb-4">
<li><a href="https://github.com/Pero-s-Academy" class="text-blue-700 hover:text-blue-800">Pedro's Academy on GitHub</a></li>
<li><a href="https://www.linkedin.com/newsletters/skunkworks-insights-7104248104035479553" class="text-blue-700 hover:text-blue-800">Skunkworks Insights - Newsletter</a></li>
<li><a href="https://blog.skunkworks.africa/" class="text-blue-700 hover:text-blue-800">Skunkworks Insights - Blog</a></li>
<section>
<h2 class="text-3xl font-bold mb-4">Our Values</h2>
<ul>
<li><strong>Innovation:</strong> We encourage creativity and out-of-the-box thinking.</li>
<li><strong>Excellence:</strong> We commit to the highest standards in all our courses and services.</li>
<li><strong>Inclusivity:</strong> We believe in the power of diversity and strive to create an inclusive learning environment.</li>
</ul>
<a href="contact.html" class="bg-blue-700 text-white rounded-full px-4 py-2">Get Involved</a>
</div>

<!-- Additional content can be added here -->

</section>
</div>

<footer class="text-center p-4 text-white header-blue">
<p>&copy; 2024 Skunkworks. All rights reserved.</p>
<p>&copy; 2024 Skunkworks Education. All rights reserved.</p>
</footer>

</body>
</html>
</html>
139 changes: 70 additions & 69 deletions onboarding.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,96 +3,97 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Onboarding - Skunkworks</title>
<script src="https://cdn.tailwindcss.com"></script>
<title>Onboarding - Skunkworks Academy</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet">
<style>
.header-blue { background-color: #0f62fe; }
.bg-light-blue { background-color: #e0f2fe; }
.border-custom { border: 3px solid #0f62fe; }
.dropdown { position: relative; display: inline-block; }
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
padding: 12px 16px;
z-index: 1;
left: 0;
right: 0;
margin: auto;
text-align: center;
.text-center { text-align: center; }
.text-white { color: white; }
.mb-4 { margin-bottom: 1rem; }
.p-4 { padding: 1rem; }
.hover\:underline:hover { text-decoration: underline; }

.container {
max-width: 60%;
margin: 2rem auto;
padding: 2rem;
background: white;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.form-group {
margin-bottom: 1rem;
}

.form-control {
width: 100%;
padding: 0.5rem;
border-radius: 4px;
border: 2px solid #0f62fe;
box-sizing: border-box;
}
.dropdown:hover .dropdown-content { display: block; }
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;

.form-label {
display: block;
margin-bottom: 0.5rem;
font-weight: bold;
}

.submit-btn {
background-color: #0f62fe;
color: white;
padding: 0.5rem 1rem;
border: none;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.3s;
}

.submit-btn:hover {
background-color: #0e56d8;
}
.dropdown-content a:hover { background-color: #ddd; }
</style>
</head>
<body class="font-roboto bg-light-blue text-gray-900">
<header class="header-blue text-white text-center p-10">
<div class="dropdown">
<span class="cursor-pointer">Menu</span>
<div class="dropdown-content">
<a href="index.html">Home</a>
<a href="about-us.html">About Us</a>
<a href="course-catalog.html">Course Catalog</a>
<a href="contact.html">Contact</a>
<a href="onboarding.html">Onboarding</a>
</div>
</div>
<h1 class="text-4xl font-bold">Onboarding</h1>
</header>

<div class="container mx-auto p-8">
<form action="your-server-endpoint" method="POST" enctype="multipart/form-data">
<div class="bg-white p-6 border-custom rounded mb-4">
<h2 class="text-2xl font-bold mb-4">Personal Information</h2>
<label for="fullName">Full Name:</label>
<input type="text" id="fullName" name="fullName" class="mb-2 block" required>

<label for="email">Email Address:</label>
<input type="email" id="email" name="email" class="mb-2 block" required>

<label for="phone">Phone Number:</label>
<input type="tel" id="phone" name="phone" class="mb-2 block">
</div>

<div class="bg-white p-6 border-custom rounded mb-4">
<h2 class="text-2xl font-bold mb-4">Skills Assessment</h2>
<textarea id="skills" name="skills" rows="4" placeholder="Describe your skills and proficiency levels." class="mb-2 block w-full"></textarea>
</div>
<header class="header-blue text-white text-center p-4">
<nav class="flex justify-center space-x-4">
<a href="index.html" class="text-white hover:underline">Home</a>
<a href="about-us.html" class="text-white hover:underline">About Us</a>
<a href="course-catalog.html" class="text-white hover:underline">Course Catalog</a>
<a href="contact.html" class="text-white hover:underline">Contact</a>
</nav>
</header>

<div class="bg-white p-6 border-custom rounded mb-4">
<h2 class="text-2xl font-bold mb-4">Professional Experience</h2>
<textarea id="experience" name="experience" rows="4" placeholder="Briefly outline your professional experience." class="mb-2 block w-full"></textarea>
<div class="container">
<form>
<div class="form-group">
<label for="name" class="form-label">Name</label>
<input type="text" id="name" class="form-control" placeholder="Your name">
</div>

<div class="bg-white p-6 border-custom rounded mb-4">
<h2 class="text-2xl font-bold mb-4">Document Upload</h2>
<label for="resume">Upload Resume (PDF only):</label>
<input type="file" id="resume" name="resume" accept=".pdf" class="mb-2 block">
<div class="form-group">
<label for="email" class="form-label">Email</label>
<input type="email" id="email" class="form-control" placeholder="Your email">
</div>

<div class="bg-white p-6 border-custom rounded mb-4">
<h2 class="text-2xl font-bold mb-4">Agreements and Policies</h2>
<input type="checkbox" id="agreement" name="agreement" required>
<label for="agreement">I agree to the <a href="terms-and-conditions.pdf" target="_blank">Terms and Conditions</a>.</label>
<div class="form-group">
<label for="course" class="form-label">Course Interest</label>
<select id="course" class="form-control">
<option value="">Select a course...</option>
<!-- Add more course options here -->
</select>
</div>

<div class="text-center">
<button type="submit" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">Submit Onboarding Form</button>
</div>
<button type="submit" class="submit-btn">Submit</button>
</form>
</div>

<footer class="text-center p-4 text-white header-blue">
<p>&copy; 2024 Skunkworks. All rights reserved.</p>
<p>&copy; 2024 Skunkworks Academy. All rights reserved.</p>
</footer>

</body>
</html>
</html>

0 comments on commit b3c0b07

Please sign in to comment.