Untitled
unknown
plain_text
2 years ago
8.4 kB
7
Indexable
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CV</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css"
integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<style>
header {
background-color: grey;
color: white;
}
#profileHeader {
padding: 2.5em;
}
.profileIcons {
display: flex;
flex-direction: row;
}
#profileDetails {
display: flex;
flex-direction: row;
margin-top: 2em;
}
#profileImage {
border-radius: 50%;
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
i {
margin-right: 1em;
}
.iconData {
margin-bottom: 0;
}
td, th{
text-align: center;
}
table{
width: 100%;
}
th{
background-color: lightgray;
}
tr{
height: 2.5em;
}
#workExpHeading{
font-weight: bold;
text-align: center;
background-color: gray;
width: 40%;
height: 2.5em;
display: table-cell;
line-height: 2em;
color: white;
}
#copyright{
text-decoration: underline;
font-weight: bold;
font-style: italic;
text-align: center;
margin-bottom: 0;
}
</style>
</head>
<body>
<header>
<div id="profileHeader">
<!-- Name -->
<div>
<h2 style="text-align: center;">JULIANA MARTINEZ</h2>
</div>
<hr>
<!-- Profile, image and links -->
<div id="profileDetails" class="row">
<!-- Profile -->
<div class="col-4">
<h4 style="text-align: center;">PROFILE</h4>
<hr>
<p style="text-align: justify;">Lorem ipsum dolor sit amet consectetur adipisicing elit. Ad nam
laborum aliquam expedita est porro saepe adipisci neque rerum labore recusandae minima dolores,
nostrum incidunt nesciunt sapiente a soluta error libero optio! Unde, facere?</p>
</div>
<!-- Image -->
<div class="col-4">
<img id="profileImage" src="https://picsum.photos/200" alt="Profile Image">
</div>
<!-- Links -->
<div class="col-4">
<div class="profileIcons">
<i class="fas fa-phone" style="color: #ffffff;"></i>
<p class="iconData">9669340800</p>
</div>
<hr>
<div class="profileIcons">
<i class="fas fa-envelope" style="color: #ffffff;"></i>
<p class="iconData">juliana@hotmail.com</p>
</div>
<hr>
<div class="profileIcons">
<i class="fas fa-home" style="color: #ffffff;"></i>
<p class="iconData">New York</p>
</div>
<hr>
<div class="profileIcons">
<i class="fab fa-linkedin-in"></i>
<p class="iconData">linkedin.com/you</p>
</div>
<hr>
</div>
</div>
</div>
</header>
<!-- Education, Expertise and Skills -->
<div class="row container-fluid" style="margin: 0; margin-top: 2em; margin-bottom: 2em;">
<!-- Education Details -->
<div class="col-4">
<table>
<tr>
<th>EDUCATION</th>
</tr>
<tr>
<td style="padding-top: 2em;">
<p style="font-weight: bold; margin: 0;">YOUR DEGREE/MAJOR</p>
New York University <br>
2008-2012
</td>
</tr>
<tr>
<td style="padding-top: 2em;">
<p style="font-weight: bold; margin: 0;">YOUR DEGREE/MAJOR</p>
New York University <br>
2008-2012
</td>
</tr>
</table>
</div>
<!-- Expertise -->
<div class="col-4">
<table>
<tr>
<th>EXPERTISE</th>
</tr>
<tr>
<td style="padding-top: 2em;">TRAINING AND DEVELOPMENT</td>
</tr>
<tr>
<td>PROJECT MANAGEMENT</td>
</tr>
</table>
</div>
<!-- Skills -->
<div class="col-4">
<table>
<tr>
<th>SKILLS</th>
</tr>
<tr>
<td style="padding-top: 2em;">WORD & EXCEL</td>
</tr>
<tr>
<td>WEB DESIGN</td>
</tr>
</table>
</div>
</div>
<!-- Work Experience -->
<div>
<!-- Heading -->
<div style="display: flex; justify-content: center;">
<p id="workExpHeading">WORK EXPERIENCE</p>
</div>
<!-- Work Experience-1 -->
<div style="margin-left: 2em; margin-right: 2em; margin-top: 2em;">
<p style="font-weight: bold;">YOUR POSITION TITLE HERE</p>
<div style="display: flex; justify-content: space-between;">
<p>Company Name here</p>
<p>2012-Present</p>
</div>
<div>
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Veniam cum, harum quaerat minus saepe provident distinctio nemo neque atque excepturi consequuntur, autem sint alias sed doloribus! Vero quos ab ipsum exercitationem molestiae. Dolor ipsam aut, voluptatem eum, nihil soluta laudantium aliquam incidunt dignissimos fugit ipsa repellat? Asperiores velit molestias laboriosam!
</div>
<ul>
<li>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Quia, a!</li>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem, dolor?</li>
</ul>
</div>
<!-- Work Experience-2 -->
<div style="margin-left: 2em; margin-right: 2em; margin-top: 2em;">
<p style="font-weight: bold;">YOUR POSITION TITLE HERE</p>
<div style="display: flex; justify-content: space-between;">
<p>Company Name here</p>
<p>2012-Present</p>
</div>
<div>
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Veniam cum, harum quaerat minus saepe provident distinctio nemo neque atque excepturi consequuntur, autem sint alias sed doloribus! Vero quos ab ipsum exercitationem molestiae. Dolor ipsam aut, voluptatem eum, nihil soluta laudantium aliquam incidunt dignissimos fugit ipsa repellat? Asperiores velit molestias laboriosam!
</div>
<ul>
<li>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Quia, a!</li>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem, dolor?</li>
</ul>
</div>
</div>
<footer style="margin-top: 2em; background-color: lightgray;">
<p id="copyright">© SkillAssure 2021</p>
</footer>
</body>
Editor is loading...