Skip to content

Commit

Permalink
Merge pull request #798 from Mohitranag18/buildResume
Browse files Browse the repository at this point in the history
Add 3-Step Resume Builder Feature with PDF Download Capability
  • Loading branch information
GarimaSingh0109 authored Oct 21, 2024
2 parents 64ec0b3 + c2d2dc3 commit 874ec9f
Show file tree
Hide file tree
Showing 10 changed files with 885 additions and 521 deletions.
194 changes: 194 additions & 0 deletions Resume.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,194 @@
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 20px;
}

.form-container {
width: 90%;
margin: auto;
background: #f4f4f4;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

h2, h3 {
color: #333;
}
h2{
font-size: 2.5rem;
margin-bottom: 2rem;
}
h3{
font-size: 2rem;
margin-bottom: 1rem;
}

.section {
margin-bottom: 20px;
}

label {
font-size: 1.5rem;
display: block;
margin-bottom: 5px;
font-weight: bold;
}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],

textarea {
width: 100%;
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 4px;
}
textarea {
resize: vertical;
}

button {
padding: 10px 15px;
border: none;
background-color: #007bff;
color: white;
border-radius: 4px;
cursor: pointer;
margin-top: 10px;
transition: background-color 0.3s, transform 0.3s; /* Added transition for scaling effect */
}

button:hover {
background-color: #0056b3;
transform: scale(1.05); /* Added scaling effect on hover */
}

button:focus {
outline: none; /* Remove default outline */
box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.5); /* Add custom focus style */
}

/* Step 2 CSS */
#step-2{
width: 90%;
margin: auto;
background: #f4f4f4;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.template-section {
display: flex;
flex-wrap: wrap; /* Allow wrapping on smaller screens */
justify-content: space-around;
margin-top: 20px;
}

.template-card {
border: 1px solid #ccc;
padding: 20px;
border-radius: 10px;
text-align: center;
width: 25%;
cursor: pointer;
transition: transform 0.3s, box-shadow 0.3s; /* Added box-shadow transition */
}

.template-card:hover {
transform: scale(1.05);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); /* Added shadow on hover */
}

.template-card img {
max-width: 100%;
height: auto;
margin-bottom: 10px;
}

.buttons {
margin-top: 20px;
display: flex;
justify-content: space-between;
}

.buttons button {
padding: 10px 20px;
background-color: #007bff;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}

.buttons button:hover {
background-color: #0056b3;
}

/* Step 3 Styles */
#step-3{
width: 90%;
margin: auto;
background: #f4f4f4;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.step-section {
padding: 20px;
border: 1px solid #ccc;
border-radius: 8px;
background-color: #f9f9f9;
margin-top: 20px;
}

#resume-display {
margin-top: 20px;
padding: 10px;
border: 1px solid #ddd;
border-radius: 8px;
background-color: #fff;
}

#resume-display h1 {
font-size: 2em;
margin-bottom: 10px;
}

#resume-display h2 {
font-size: 1.5em;
margin: 15px 0 5px;
}

#resume-display h3 {
font-size: 1.2em;
margin: 10px 0 5px;
}

#resume-display p {
margin: 5px 0;
}

/* Button Styles */
button {
margin: 10px 5px;
padding: 10px 15px;
font-size: 1em;
border: none;
border-radius: 5px;
cursor: pointer;
}

#prev-step-3 {
background-color: #f0ad4e; /* Bootstrap warning color */
color: white;
}

#download-resume {
background-color: #5cb85c; /* Bootstrap success color */
color: white;
}
Loading

0 comments on commit 874ec9f

Please sign in to comment.