-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
173 lines (140 loc) · 7.31 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Resume Generator</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container" id="cv-form">
<h1 class="text-center my-4">Resume Generator</h1>
<div class="row">
<div class="col-md-6">
<!-- personal information -->
<h2>Personal information</h2>
<div class="form-group fw-bold"> <!--placeholder for box text inner-->
<label for="nameField">Name</label>
<input type="text" id="nameField" placeholder="Enter here" class="form-control">
</div>
<!-- contact -->
<div class="form-group mt-2 fw-bold">
<label for="contactField">Contact</label>
<input type="text" id="contactField" placeholder="Enter here" class="form-control">
</div>
<!-- adress -->
<div class="form-group mt-2 fw-bold">
<label for="addressField">Address</label> <!-- textarea give you big space*/ -->
<textarea type="text" id="addressField" placeholder="Enter here" row="23"
class="form-control"></textarea>
</div>
<div class="form-group mt-4 fw-bold">
<label for="imgField">Chose picture</label>
<input id="imgField" type="file" class="form-controls">
</div>
<!-- social links -->
<p clas="text-secondary my-3 fw-bold">Important links</p> <!--my=margin y-->
<div class="form-group mt-2 fw-bold">
<label for="fbField">Facebook</label>
<input type="text" id="fbField" placeholder="Enter here" class="form-control">
</div>
<div class="form-group mt-2 fw-bold">
<label for="tweetField">Twitter</label>
<input type="text" id="tweetField" placeholder="Enter here" class="form-control">
</div>
<div class="form-group mt-2 fw-bold">
<label for="linkdField">Linkedin</label>
<input type="text" id="linkdField" placeholder="Enter here" class="form-control">
</div>
</div>
<div class="col-md-6 fw-bold">
<h2>Professional information </h2>
<div class="form-group mt-2 fw-bold">
<label for="">Objective</label>
<textarea type="text" id="objectiveField" placeholder="Enter here" row="4" class="form-control"></textarea>
</div>
<div class="form-group mt-1 fw-bold" id="we">
<label for="">Work Experience</label> <!-- textarea give you big space*/ -->
<textarea type="text" placeholder="Enter here" row="4" class="form-control weField"></textarea>
<!-- add class due to add many experience -->
<div class="container text-center" id="addNewBtn">
<button onclick="addNewEbtn()" class="btn btn-primary my-4">Add</button>
</div>
</div>
<div class="form-group mt-1 fw-bold" id="aq">
<label for="">Academic Qualification</label> <!-- textarea give you big space*/ -->
<textarea type="text" placeholder="Enter here" row="4" class="form-control aqField"></textarea>
<div class="container text-center" id="addNewBtn2">
<button onclick="addNewbox()" class="btn btn-primary my-4">Add</button>
</div>
</div>
</div>
<div class="container text-center mt-2" id="CV">
<button onclick="generateCV()" class="btn btn-primary">Generate CV</button>
</div>
</div>
</div>
</div>
<!-- CV template -->
<div class="container" id="cv-template">
<div class="row">
<!--first coloumn bio & picture-->
<div class="col-md-4 background fw-bold">
<img src="https://m.media-amazon.com/images/M/MV5BOTBhMTI1NDQtYmU4Mi00MjYyLTk5MjEtZjllMDkxOWY3ZGRhXkEyXkFqcGdeQXVyNzI1NzMxNzM@._V1_.jpg" alt="" class="img-fluid myimg" id="imgTemplate">
<div class="container background fw-bold">
<p id="nameT">Jhonny Deep</p>
<p id="contactT">+9223234234</p>
<p id="addressT">Gulshan e Iqbal karachi Sindh block ##3</p>
<hr>
<p><a id="fbT" href="#1">https://www.facebook.com/aamir</a></p>
<p><a id="linkedinT" href="#2">https://www.linkedin.com/aamir23</a></p>
<p><a id="twitterT" href="#3">https://www.twitter.com/aamir</a></p>
</div>
</div>
<div class="col-md-8">
<!-- second column -->
<h1 id="nameT2" class="text-center">Jhonny Deep</h1>
<div class="card my-5">
<div class="card-header background">
<h3>Objective</h3>
</div>
<div class="car-body my-3">
<p id="objectiveT">Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse soluta dignissimos non, vero incidunt repudiandae vel ex corrupti, totam magni perspiciatis, quae iste ipsa accusantium accusamus quisquam adipisci. Atque sed harum illum reiciendis! Placeat pariatur atque, nulla provident possimus quisquam iusto officiis consequatur maiores culpa numquam quae repudiandae! Cumque, quis?</p>
</div>
</div>
<!-- work Experience -->
<div class="card my-3">
<div class="card-header background">
<h3>Work Experience</h3>
</div>
<div class="car-body my-3">
<ul id="weT">
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Et, pariatur!</li>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Et, pariatur!</li>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Et, pariatur!</li>
</ul>
</div>
</div>
<!-- academic qualification -->
<div class="card my-3">
<div class="card-header background">
<h3>Academic Qualification</h3>
</div>
<div class="car-body my-3">
<ul id="aqT">
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Et, pariatur!</li>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Et, pariatur!</li>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Et, pariatur!</li>
</ul>
</div>
</div>
<div class="container text-center mt-3 background">
<button onclick="printCV()" class="btn"> Print CV</button>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<script src="script.js"></script>
</body>
</html>