afiqzudinhadi/the-heartbroken-dev-tier-1
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #50 from Arpita-s-h/master

Browse source 
added Arpita's resume
This commit is contained in:
wlfmnstr 2024-04-21 19:22:59 -05:00 • committed by GitHub
commit 1345af1455
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 448 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
student-resumes/Arpita-resume/images/Online_shop.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 70 KiB

BIN
student-resumes/Arpita-resume/images/bg1.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 289 KiB

BIN
student-resumes/Arpita-resume/images/coffe_shop.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 194 KiB

BIN
student-resumes/Arpita-resume/images/ecommerce.jpeg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 47 KiB

BIN
student-resumes/Arpita-resume/images/img2.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.3 MiB

BIN
student-resumes/Arpita-resume/images/logo1.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 21 KiB

BIN
student-resumes/Arpita-resume/images/travel.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 361 KiB

165
student-resumes/Arpita-resume/index.html Normal file
View file

@ -0,0 +1,165 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Portfolio</title>
<link rel="stylesheet" href="style.css">
<script src="https://kit.fontawesome.com/fbdbc269e8.js" crossorigin="anonymous"></script>
</head>
<body>
<div id="header">
<div class="container">
<nav>
<img src="images/logo1.png" class="logo">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
<div class="header-text">
<p>Aspiring software developer....</p>
<h1>Hi, I'm <span>Arpita</span><br> from India</h1>
</div>
</div>
</div>
<div id="about">
<div class="container">
<div class="row">
<div class="about-col-1">
<img src="images/img2.jpg" alt="">
</div>
<div class="about-col-2">
<h1 class="sub-title">About Me</h1>
<p>Dedicated computer application graduate with 1.8 years of experience in java development seeking
a position as a junior java developer to leverage skills in Java, spring boot & MySQL.
</p>
<div class="tab-titles">
<p class="tab-links active-link" onclick="opentab('skills')">Skills</p>
<p class="tab-links" onclick="opentab('experience')">Experience</p>
<p class="tab-links" onclick="opentab('education')">Education</p>
</div>
<div class="tab-contents active-tab" id="skills">
<ul>
<li>Java</li>
<li>Spring boot</li>
<li>MySQL</li>
<li>CSS</li>
<li>HTML</li>
<li>Git</li>
</ul>
</div>
<div class="tab-contents" id="experience">
<ul>
<li>Company name - System Associate [2022 Aug - 2023 Oct]
- Haven’t got any chance to work on any projects due to lack of experience/projects in
the company. Eventually got laid off.</li>
<li>Company name - System associate trainee [2022 Mar – 2023 Jul]
- Successfully completed training which covered fundamentals of Java(OOPS), spring Boot,
REST API’s, MySQL, HTML, CSS, Git & software engineering practices.</li>
</ul>
</div>
<div class="tab-contents" id="education">
<ul>
<li><span>2021</span><br>Bachelor's of computer application from xxx college</li>
<li><span>2018</span><br>Pre-university from xxx college</li>
<li><span>2016</span><br>High school from xxx school</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!------------------------services---------------------------->
<div id="services">
<div class="container">
<h1 class="sub-title">My Projects</h1>
<div class="services-list">
<div>
<i class="fa-solid fa-code"></i>
<h2>Project 1</h2>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quae laborum sapiente, autem
consequatur itaque, ullam laudantium et dignissimos enim, eum facere ipsum harum sit! Error
reiciendis repudiandae vel totam harum ullam expedita hic dolores sed!</p>
<a href="#">Learn more</a>
</div>
<div>
<i class="fa-solid fa-crop"></i>
<h2>Project 2</h2>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quae laborum sapiente, autem
consequatur itaque, ullam laudantium et dignissimos enim, eum facere ipsum harum sit! Error
reiciendis repudiandae vel totam harum ullam expedita hic dolores sed!</p>
<a href="#">Learn more</a>
</div>
<div>
<i class="fa-brands fa-app-store"></i>
<h2>Project 3</h2>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quae laborum sapiente, autem
consequatur itaque, ullam laudantium et dignissimos enim, eum facere ipsum harum sit!
Error
reiciendis repudiandae vel totam harum ullam expedita hic dolores sed!</p>
<a href="#">Learn more</a>
</div>
</div>
</div>
</div>
<!-----------------------------------portfolio------------------------------>
<div id="portfolio">
<div class="container">
<h1 class="sub-title">My Work</h1>
<div class="work-list">
<div class="work">
<img src="images/coffe_shop.jpg" alt="">
<div class="layer">
<h3>Coffee Shop</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet distinctio laudantium
repellendus consequatur iusto vel enim commodi perspiciatis quia quis.</p>
<a href="#"><i class="fa-solid fa-arrow-up-right-from-square"></i></a>
</div>
</div>
<div class="work">
<img src="images/travel.jpg" alt="">
<div class="layer">
<h3>Travel Website</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet distinctio laudantium
repellendus consequatur iusto vel enim commodi perspiciatis quia quis.</p>
<a href="#"><i class="fa-solid fa-arrow-up-right-from-square"></i></a>
</div>
</div>
<div class="work">
<img src="images/Online_shop.jpg" alt="">
<div class="layer">
<h3>Online Shopping</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet distinctio laudantium
repellendus consequatur iusto vel enim commodi perspiciatis quia quis.</p>
<a href="#"><i class="fa-solid fa-arrow-up-right-from-square"></i></a>
</div>
</div>
</div>
</div>
</div>
<script>
var tablinks = document.getElementsByClassName("tab-links");
var tabcontents = document.getElementsByClassName("tab-contents");
function opentab(tabname) {
for (tablink of tablinks) {
tablink.classList.remove("active-link");
}
for (tabcontent of tabcontents) {
tabcontent.classList.remove("active-tab");
}
event.currentTarget.classList.add("active-link");
document.getElementById(tabname).classList.add("active-tab");
}
</script>
</body>
</html>

283
student-resumes/Arpita-resume/style.css Normal file
View file

@ -0,0 +1,283 @@
* {
margin: 0;
padding: 0;
font-family: sans-serif;
box-sizing: border-box;
}
body {
background: #551818;
}
#header {
width: 100%;
height: 100vh;
background-image: url(images/bg1.jpg);
background-size: cover;
background-position: center;
}
.contanier {
padding: 10px 10px;
}
nav {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.logo {
width: 80px;
margin: 6px 0px 0px 58px;
}
nav ul li {
display: inline-block;
list-style: none;
margin: 10px 5px;
}
nav ul li a {
color: rgb(255, 255, 255);
text-decoration: none;
font-size: 30px;
background: #000;
border-radius: 10px;
padding: 4px;
position: relative;
text-shadow: #1b0c0c;
}
nav ul li a::after {
content: '';
width: 0;
height: 6px;
background: rgb(200, 5, 5);
position: absolute;
left: 0;
bottom: -6px;
transition: 0.5s;
}
nav ul li a:hover::after {
width: 100%;
}
.header-text {
margin-top: 10%;
font-size: 35px;
}
.header-text h1 {
font-size: 65px;
margin-top: 25px;
}
.header-text h1 span {
color: rgb(10, 19, 116);
}
/*------------------about-------------------*/
#about {
padding: 80px 0;
color: aliceblue;
}
.row {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.about-col-1 {
flex-basis: 35%;
}
.about-col-1 img {
width: 100%;
border-radius: 20px;
}
.about-col-2 {
flex-basis: 60%;
}
p {
font-size: 20px;
color: rgb(252, 251, 250);
}
.sub-title {
font-size: 60px;
font-weight: bolder;
color: aliceblue;
}
.tab-titles {
display: flex;
margin: 20px 0 40px;
}
.tab-links {
margin-right: 50px;
font-size: 40px;
font-weight: 500;
cursor: pointer;
position: relative;
}
.tab-links::after {
content: '';
width: 0;
height: 6px;
background: rgb(15, 155, 64);
position: absolute;
left: 0;
bottom: -6px;
transition: 0.5s;
}
.tab-links.active-link:hover::after {
width: 50%;
}
.tab-contents ul li {
list-style: none;
margin: 10px 0;
}
.tab-contents ul span {
font-size: 20px;
color: rgb(83, 170, 228);
}
.tab-contents {
display: none;
}
.tab-contents.active-tab {
display: block;
}
/* ------------------services---------------- */
#services {
pad: 30px 0;
}
.services-list {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
grid-gap: 200px;
margin-top: 50px;
}
.services-list div {
background: #634a17;
padding: 40px;
font-size: 13px;
font-weight: 300;
border-radius: 10px;
transition: background 0.5s, transform 0.5s;
}
.services-list div i {
font-size: 50px;
margin-bottom: 30px;
}
.services-list div h2 {
font-size: 30px;
font-weight: 500;
margin-bottom: 15px;
}
.services-list div a {
text-decoration: none;
color: #be9494;
font-size: 12px;
margin-top: 20px;
display: inline-block;
}
.services-list div:hover {
background: #64b2df;
transform: translateY(-10px);
}
/* -------------------------portfolio----------------------------- */
#portfolio {
padding: 50px 0;
}
.work-list {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
grid-gap: 200px;
margin-top: 80px;
}
.work {
border-radius: 10px;
position: relative;
overflow: hidden;
}
.work img {
width: 100%;
border-radius: 10px;
display: block;
transition: transfrom 0.5s;
}
.layer {
width: 100%;
height: 0;
background: linear-gradient(rgba(0, 0, 0, 0.6), #ff004f);
border-radius: 10px;
position: absolute;
left: 0;
bottom: 0;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
padding: 0 40px;
text-align: center;
font-size: 15px;
transition: height 0.5s;
}
.layer h3 {
color: whitesmoke;
font-weight:bolder;
margin-bottom: 20px;
}
.layer a {
margin-top: 20px;
color: #5e2b2b;
text-decoration: none;
font-size: 18px;
line-height: 60px;
background: white;
width: 60px;
height: 60px;
}
.work:hover img {
transform: scale(1.1);
}
.work:hover .layer {
height: 100%;
}