Skip to content

Commit

Permalink
Create careers-placements.html
Browse files Browse the repository at this point in the history 
Signed-off-by: Raydo Matthee <[email protected]>
  • Loading branch information
@burnt-exe
burnt-exe authored Aug 3, 2024
1 parent 4fa5949 commit 933d0f7
Showing 1 changed file with 387 additions and 0 deletions.
387 changes: 387 additions & 0 deletions careers/careers-placements.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,387 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8" />
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<meta name="description" content="Innovative Technology, Education Solutions, and Placement Services for Tomorrow's Businesses." />
<meta name="keywords" content="Technology, Education, Placement Services, Cloud Services, Software Development" />
<meta name="author" content="Skunkworks" />

<!-- Individual CSS Files -->
<link href="./css/footer.css" rel="stylesheet" />
<link href="./css/forms.css" rel="stylesheet" />
<link href="./css/header.css" rel="stylesheet" />
<link href="./css/main.css" rel="stylesheet" />
<link href="./css/sidebar.css" rel="stylesheet" />
<link href="./css/airbnb.css" rel="stylesheet" />
<link href="./css/arabic.css" rel="stylesheet" />
<link href="./css/bass-addons.css" rel="stylesheet" />
<link href="./css/bass.css" rel="stylesheet" />
<link href="./css/button.css" rel="stylesheet" />
<link href="./css/carbon-components.min_copy.css" rel="stylesheet" />
<link href="./css/carbon-components_copy.css" rel="stylesheet" />
<link href="./css/confetti.css" rel="stylesheet" />
<link href="./css/confirmDate.css" rel="stylesheet" />
<link href="./css/dark.css" rel="stylesheet" />
<link href="./css/example.css" rel="stylesheet" />
<link href="./css/flatpickr.css" rel="stylesheet" />
<link href="./css/flatpickr.min.css" rel="stylesheet" />
<link href="./css/fonts.css" rel="stylesheet" />
<link href="./css/github.css" rel="stylesheet" />
<link href="./css/ie.css" rel="stylesheet" />
<link href="./css/jasmine.css" rel="stylesheet" />
<link href="./css/light.css" rel="stylesheet" />
<link href="./css/manager.css" rel="stylesheet" />
<link href="./css/material_blue.css" rel="stylesheet" />
<link href="./css/material_green.css" rel="stylesheet" />
<link href="./css/material_orange.css" rel="stylesheet" />
<link href="./css/material_red.css" rel="stylesheet" />
<link href="./css/page.css" rel="stylesheet" />
<link href="./css/screen_copy.css" rel="stylesheet" />
<link href="./css/services.css" rel="stylesheet" />
<link href="./css/source-code-pro.css" rel="stylesheet" />
<link href="./css/style.css" rel="stylesheet" />
<link href="./css/styles.css" rel="stylesheet" />
<link href="./css/styles.min.css" rel="stylesheet" />
<link href="./css/tocbot.css" rel="stylesheet" />
<link href="./css/achievements.css" rel="stylesheet" />

<!-- Favicon -->
<link href="https://github.com/skunkworksza/www/blob/main/assets/skunkworks/logo-skunkworks-trans%2040%20%C3%97%2040%20px.png?raw=true" rel="icon" type="image/png" />

<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
line-height: 1.6;
background-color: #121212;
color: #fff;
}
header {
background-color: #333;
color: #fff;
padding: 10px 0;
text-align: center;
}
header img {
max-width: 100%;
height: auto;
}
nav ul {
list-style-type: none;
padding: 0;
margin: 0;
display: flex;
justify-content: center;
flex-wrap: wrap;
}
nav ul li {
margin: 0 15px;
position: relative;
}
nav ul li a {
color: #fff;
text-decoration: none;
display: block;
padding: 10px;
}
nav ul li ul {
display: none;
position: absolute;
top: 100%;
left: 0;
background-color: #333;
padding: 0;
margin: 0;
list-style-type: none;
z-index: 1000;
}
nav ul li:hover ul {
display: block;
}
nav ul li ul li a {
padding: 10px 15px;
}
.section {
padding: 20px;
margin: 20px 0;
}
.welcome-title {
color: #fff; /* White color */
margin-bottom: 20px; /* Adds spacing after the title */
}

.welcome-subtitle {
color: #fff; /* White color for the subtitle */
}
.welcome-section-content {
background-color: #000; /* Black background for contrast */
max-width: 800px;
margin: 0 auto;
padding: 30px; /* Increased padding for more spacing */
border: 2px solid #fff; /* White border for emphasis */
border-radius: 10px;
text-align: center; /* Center-align the text */
color: #fff; /* White text color */
}

.welcome-heading {
font-size: 1.8em; /* Larger font size for the heading */
margin-bottom: 25px; /* Spacing after heading */
color: #fff;
}

.intro-text {
font-size: 1.2em; /* Slightly larger intro text */
margin-bottom: 15px; /* Spacing after intro text */
color: #ddd;
}

.body-text {
margin-bottom: 20px; /* Consistent spacing after paragraphs */
line-height: 1.6; /* Improved line spacing for readability */
color: #ccc;
}

.contact-text {
font-weight: bold; /* Make contact info stand out */
margin-bottom: 30px; /* Extra spacing before the button */
color: #fff;
}

.cta-button {
background-color: #007bff; /* Primary color for the button */
color: #fff;
padding: 10px 20px;
border: none;
border-radius: 5px;
font-size: 1em;
cursor: pointer;
transition: background-color 0.3s ease, transform 0.3s ease;
}

.cta-button:hover {
background-color: #0056b3; /* Darker shade on hover */
transform: translateY(-2px); /* Subtle lift effect on hover */
}
.grid-container {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
form {
display: flex;
flex-direction: column;
max-width: 600px;
margin: 0 auto;
}
form input,
form textarea,
form button {
margin-bottom: 10px;
padding: 10px;
font-size: 1em;
width: 100%;
box-sizing: border-box;
}
footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px 0;
}
button {
background-color: #333;
color: #fff;
border: none;
padding: 10px 15px;
cursor: pointer;
transition: background-color 0.3s ease;
}
button:hover {
background-color: #555;
}
.partners-list {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
text-align: center;
}
.partner-item {
background-color: #ffffff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
}
.partner-item img {
max-width: 100%;
max-height: 100px;
object-fit: contain;
}
.statistics {
text-align: center;
margin-top: 20px;
}
.divider {
height: 2px;
background-color: #444;
margin: 20px 0;
}
.centered-container {
max-width: 800px;
margin: 0 auto;
background-color: #ffffff;
padding: 20px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
border-radius: 8px;
text-align: center;
color: #000;
}
.libutton {
display: flex;
flex-direction: column;
justify-content: center;
padding: 7px;
text-align: center;
outline: none;
text-decoration: none !important;
color: #ffffff !important;
width: 200px;
height: 32px;
border-radius: 16px;
background-color: #ffffff;
font-family: "SF Pro Text", Helvetica, sans-serif;
margin: 10px auto;
}
.icon {
width: 20px;
height: 20px;
margin-right: 5px;
}
.service-icon {
width: 40px;
height: 40px;
display: block;
margin: 0 auto 10px auto;
}
/* Mobile Styles */
@media (max-width: 768px) {
.grid-container {
grid-template-columns: 1fr;
}
nav ul {
flex-direction: column;
}
nav ul li {
margin: 10px 0;
}
.partners-list {
grid-template-columns: 1fr;
}
}
</style>
</head>

<body>
<header>
<nav>
<ul>
<li><a href="https://skunkworks.africa/index.html"><img alt="Home" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/application.svg" />Home</a></li>
<li>
<a href="https://courses.skunkworks.africa/"><img alt="Training" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/training.svg" />Training</a>
<ul>
<li><a href="https://skunkworks.africa/blended-learning.html"><img alt="Blended Learning" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/literature.svg" />Blended Learning</a></li>
<li><a href="https://skunkworks.africa/course-development.html"><img alt="Course Development" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/presentation.svg" />Course Development</a></li>
<li><a href="https://skunkworks.africa/project-mentoring.html"><img alt="Project Mentoring" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/presenter.svg" />Project Mentoring</a></li>
<li><a href="https://skunkworks.africa/performance-support.html"><img alt="Performance Support Tools" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/support--services.svg" />Performance Support Tools</a></li>
<li><a href="https://skunkworks.africa/training-programs.html"><img alt="Training Programs" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/professional--marketplace.svg" />Training Programs</a></li>
</ul>
</li>
<li>
<a href="#"><img alt="Services" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/automation--software.svg" />Services</a>
<ul>
<li><a href="https://skunkworks.africa/software-development.html"><img alt="Software Development" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/software.svg" />Software Development</a></li>
<li><a href="https://skunkworks.africa/hardware-software.html"><img alt="Hardware and Software" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/server--rack.svg" />HW/SW Solutions</a></li>
<li><a href="https://skunkworks.africa/managed-cloud.html"><img alt="Managed Cloud Services" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/bd6b329933add88d1b2fbd81339a6a2cf0683aaa/carbon/cloud--managed--services.svg" />Managed Cloud</a></li>
<li><a href="https://skunkworks.africa/technical-support.html"><img alt="Technical Support Services" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/support--services.svg" />Technical Support</a></li>
<li><a href="https://skunkworks.africa/placement-recruitment.html"><img alt="Placements" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/global--partner%20(1).svg" />Placements</a></li>
</ul>
</li>
<li>
<a href="#careers"><img alt="Careers" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/briefcase.svg" />Careers</a>
<ul>
<li><a href="https://skunkworks.africa/careers-openings.html"><img alt="Current Openings" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/calendar.svg" />Current Openings</a></li>
<li><a href="https://skunkworks.africa/careers-internships.html"><img alt="Internship Programs" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/education.svg" />Internship Programs</a></li>
<li><a href="https://skunkworks.africa/careers-placements.html"><img alt="Placements" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/global--partner.svg" />Placements</a></li>
<li><a href="https://skunkworks.africa/careers-jobs.html"><img alt="Jobs" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/calendar.svg" />Jobs</a></li>
<li><a href="https://skunkworks.africa/careers-mentorship.html"><img alt="Mentorship" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/presenter.svg" />Mentorship</a></li>
<li><a href="https://skunkworks.africa/careers-development.html"><img alt="Employee Development" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/development.svg" />Employee Development</a></li>
<li><a href="https://skunkworks.africa/careers-culture.html"><img alt="Our Culture" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/team.svg" />Our Culture</a></li>
<li><a href="https://skunkworks.africa/careers-testimonials.html"><img alt="Employee Testimonials" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/thumbs-up.svg" />Employee Testimonials</a></li>
<li><a href="https://skunkworks.africa/careers-apply.html"><img alt="How to Apply" class="icon" src="https://raw.githubusercontent.com/skunkworksza/Media/0b53a76fb034583714f1660a8f0dfe6c405928b6/carbon/send-alt.svg" />How to Apply</a></li>
</ul>
</li>
</ul>
</nav>
</header><br>

<section class="section">
<div class="welcome-section-content">
<h1 class="welcome-heading">Placements</h1>
<p class="intro-text">At Skunkworks, we are dedicated to helping our clients find the best talent and helping our candidates find the best opportunities. Our placements division focuses on aligning the right people with the right roles to ensure a perfect match for long-term success.</p>
<p class="body-text">We specialize in technology, education, and cloud services, placing highly skilled professionals in roles that make a difference. Our partnerships with leading companies ensure that we can provide our candidates with access to exciting career opportunities that match their skills and aspirations.</p>
<p class="body-text">Whether you are a job seeker looking to advance your career or a company looking to fill critical roles, our placements team is here to support you every step of the way.</p>
</div>
</section>

<footer>
<p>© 2024 Skunkworks. All rights reserved.</p>
<p><a href="https://blog.skunkworks.africa/" target="_blank">Visit our blog</a></p>
</footer>

<!-- Individual JavaScript Files -->
<script src="./js/formHandler.js"></script>
<script src="./js/partnerSearchFilter.js"></script>
<script src="./js/mobileDropdown.js"></script>
<script src="./js/main.js"></script>

<script>
// JavaScript for mobile dropdown functionality
document.addEventListener('DOMContentLoaded', function () {
var dropdowns = document.querySelectorAll('nav ul li');
dropdowns.forEach(function (dropdown) {
dropdown.addEventListener('click', function (event) {
if (window.innerWidth <= 768) {
var submenu = this.querySelector('ul');
if (submenu) {
event.preventDefault();
submenu.style.display = submenu.style.display === 'block' ? 'none' : 'block';
}
}
});
});
});

// JavaScript for partner search filter
function filterPartners() {
var input = document.getElementById('partnerSearch');
var filter = input.value.toLowerCase();
var nodes = document.getElementsByClassName('partner-item');

for (i = 0; i < nodes.length; i++) {
if (nodes[i].innerText.toLowerCase().includes(filter)) {
nodes[i].style.display = "block";
} else {
nodes[i].style.display = "none";
}
}
}
</script>
</body>

</html>

0 comments on commit 933d0f7

Please sign in to comment.