Skip to content

Commit

Permalink
Added Job finding website (#525)
Browse files Browse the repository at this point in the history
* Added Project

* Update README.md

* Delete Frontend-Projects/Job Finding Website/LICENSE
  • Loading branch information
apu52 authored Nov 8, 2023
1 parent 9145497 commit 0e689f2
Show file tree
Hide file tree
Showing 21 changed files with 2,269 additions and 0 deletions.
30 changes: 30 additions & 0 deletions Frontend-Projects/Job Finding Website/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
# Career-Crafters

## Introduction 🌟

"Career-Crafters" is a powerful platform designed to simplify the process of job hunting, career development, and education exploration. It offers a range of features to assist job seekers, students, and professionals in their journey towards success. 🌐💼

# About Career-Crafters 🚀

"Career-crafters" is your one-stop destination for career growth and education exploration. Our mission is to empower job seekers, students, and professionals with access to job opportunities, internships, company insights, and valuable resources.

🎯 Discover job listings, internships, and company profiles.
📈 Track your application progress and receive job notifications.
📚 Personalize your experience with bookmarks and user accounts.

## Screenshot


![WhatsApp Image 2023-10-08 at 18 41 41](https://github.com/5h0ov/Career-Crafters/assets/114172928/beb39c0d-6534-4d62-839e-fe1be00973bd)


## Features 🎯

- **Job Search:** Easily find job opportunities at leading MNCs by location, title, and company. 🔍
- **Internship Listings:** Discover internships tailored to your field of interest. 🎓
- **Company Profiles:** Access comprehensive company profiles with information about branches, culture, and job openings. 🏢
- **Performance Tracking:** Keep tabs on your job applications, interviews, and offers. 📈
- **Bookmarks and Notifications:** Bookmark favorite jobs and receive email notifications for new postings. 📚📬
- **User Accounts:** Create personalized accounts to manage preferences and performance records. 👤
- **Mobile Responsiveness:** Enjoy a seamless experience on various devices, including mobile phones and tablets. 📱

15 changes: 15 additions & 0 deletions Frontend-Projects/Job Finding Website/app.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
$(".card").on("click", function(){
$(".detail").addClass("active");
});

$(".close-detail").on("click",function(){
$(".detail").removeClass("active")
});

$(".menu-bar").on("click",function(){
$(".sidebar").addClass("active")
});

$(".logo").on("click",function(){
$(".sidebar").removeClass("active")
});
84 changes: 84 additions & 0 deletions Frontend-Projects/Job Finding Website/assets/bookmarks.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./css/bookmarks.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css" />
<title>JobsPlace - Bookmarks</title>
</head>
<body class="full-background">
<div class="back">
<button onclick="goBack()"><i class="fas fa-arrow-left"></i> Back To Home</button>
</div>

<script>
function goBack() {
window.history.back();
}
</script>
<div class="full">
<div class="header">
<h1>Here are Your Bookmarked Jobs</h1>
</div>

<div class="wrapper">
<!--google-->
<div class="card">
<div class="card-left blue-bg">
<img src="../images/google.png">
</div>
<div class="card-center">
<h3>Google</h3>
<p class="card-detail">Data Science, Data Engineer(Onsite)</p>
<p class="card-loc"><ion-icon name="location-outline"></ion-icon>Bengaluru,Karnataka</p>
<div class="card-sub">
<p><ion-icon name="today-outline"></ion-icon>1 mins ago</p>
<p><ion-icon name="hourglass-outline"></ion-icon>Full-time</p>
<p><ion-icon name="people-outline"></ion-icon>200 Applications</p>
</div>
</div>
<div class="card-right">
<div class="card-tag">
<h5>Division</h5>
<a href="#">Data Engineer</a>
</div>
<div class="card-salary">
<p><b>$350k</b><span>/Year</span></p>
</div>
</div>
</div>
<!--tiktok-->
<div class="card">
<div class="card-left yellow-bg">
<img src="../images/tik-tok.png">
</div>
<div class="card-center">
<h3>Tiktok</h3>
<p class="card-detail">Data Analyst , Product Analyst</p>
<p class="card-loc"><ion-icon name="location-outline"></ion-icon>Los Angeles,California</p>
<div class="card-sub">
<p><ion-icon name="today-outline"></ion-icon>10 mins ago</p>
<p><ion-icon name="hourglass-outline"></ion-icon>Full-time</p>
<p><ion-icon name="people-outline"></ion-icon>130 Applications</p>
</div>
</div>
<div class="card-right">
<div class="card-tag">
<h5>Division</h5>
<a href="#">Data Science</a>
</div>
<div class="card-salary">
<p><b>$200k</b><span>/Year</span></p>
</div>
</div>
</div>

<!--facebook-->
</div>

</div>


</body>
</html>
68 changes: 68 additions & 0 deletions Frontend-Projects/Job Finding Website/assets/contact.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
<!DOCTYPE html>
<!-- Website - www.codingnepalweb.com -->
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8" />
<title>JobPlace - Contact Us</title>
<link rel="stylesheet" href="./css/contact.css" />
<!-- Fontawesome CDN Link -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<div class="back">
<button onclick="goBack()"><i class="fas fa-arrow-left"></i> Back To Home</button>
</div>

<script>
function goBack() {
window.history.back();
}
</script>
<section id="main">
<div class="container">
<div class="content">
<div class="left-side">
<div class="address details">
<i class="fas fa-map-marker-alt"></i>
<div class="topic">Address</div>
<div class="text-one">Earth</div>
<div class="text-two">Earth</div>
</div>
<div class="phone details">
<i class="fas fa-phone-alt"></i>
<div class="topic">Phone</div>
<div class="text-one">+0123 4567 890</div>
<div class="text-two">+0123 4567 890</div>
</div>
<div class="email details">
<i class="fas fa-envelope"></i>
<div class="topic">Email</div>
<div class="text-one">[email protected]</div>
<div class="text-two">[email protected]</div>
</div>
</div>
<div class="right-side">
<div class="topic-text">Send us a message</div>
<p>If you have any queries related to our website, you can send a message from here. It's our pleasure to help you.</p>

<form action="#">
<div class="input-box">
<input type="text" placeholder="Enter your name" />
</div>
<div class="input-box">
<input type="text" placeholder="Enter your email" />
</div>
<div class="input-box message-box">
<textarea placeholder="Enter your message"></textarea>
</div>
<div class="button">
<input type="button" value="Send Now" />
</div>
</form>
</div>
</div>
</div>
</section>
</body>
</html>
153 changes: 153 additions & 0 deletions Frontend-Projects/Job Finding Website/assets/css/bookmarks.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,153 @@
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Young+Serif&display=swap');
:root{
--primaryColor: #4c50d3;
--secondaryColor:#50c2d8;;
--fontColor: #1e1e1e;
--whiteColor: #fff;
--greyColor: #e7e7e7;
--darkgreyColor: #5f5f5f;
--sofPurple: #e7e8ff;
--softBlue: #c3e1ff;
--softyellow: #fff5cc;
--softRed: #ffcbc8;
}

/* BACK BUTTON */
button{
margin-left: 10px;
font-size: 15px;
color: white;
border-radius: 6px;
background-color: #4C50D3;
padding: 5px;
cursor: pointer;
transition: all 0.3s ease;
}
button:hover{
background-color: #5029bc;
}

.full-background{
background-color: #E7E8FF;
}
.header h1{
font-family: 'Young Serif', serif;
text-align: center;
}
html{
overflow-x: hidden;
}
body {
width: 100%;
height: 100vh;
display: flex;
}
.wrapper{
width: 100%;
display: flex;
flex-direction: column;
padding: 1rem 0;
gap: 1rem;
}

.full{
margin: auto;
}

.card{
display: flex;
flex-wrap: wrap;
flex-direction: row;
align-items: flex-start;
padding: 3%;
margin: 0 1%;
background-color: var(--whiteColor);
line-height: 1.5;
gap: 1.5rem;
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
border-radius: 10px;
cursor: pointer;
}

.card:hover{
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 8px;
}

.card-left{
width: 10%;
min-width: 50px;
display: flex;
justify-content: center;
border-radius: 20%;
}

.card-left img{
width: 100%;
height: auto;
min-width: 60px;
padding: 1rem;
}

.card-center {
width: 50%;
}

.card-loc, .card-sub{
font-size: 13px;
color: var(--darkGreyColor);
}

.card-sub{
display: flex;
flex-wrap: wrap;
}

.card-sub p{
display: flex;
padding: 0 0.5rem 0 0;
align-items: center;
}

.card-right{
width: 15%;
}

.card-tag a{
color: var(--fontColor);
font-size: 13px;
}

.card-salary{
padding: 0.5rem 0;
color: var(--primaryColor);
}

.card-salary span{
color: var(--fontColor);
font-size: 13px;
}

/* SCROLLBAR */
/* width */
::-webkit-scrollbar {
width: 10px;
background-color: rgba(85, 84, 84, 0.364);
}

/* Track */
::-webkit-scrollbar-track {
background: #161616fb;
box-shadow: inset 0 0 5px grey;
border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
background: #4c50d3;
border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #1b0093
}
Loading

0 comments on commit 0e689f2

Please sign in to comment.