-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
158 lines (147 loc) · 7.87 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My CV</title>
<link rel="stylesheet" href="./styles/styles.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="stylesheet" href="https://fonts.gstatic.com" crossoring>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Monserratital,whht@0,100;0,200;0.300;0,400;0">
</head>
<body>
<!-- Our App -->
<div class="app-wrapper">
<!-- Right side container -->
<div class="right-side-container">
<!-- About me section -->
<div>
<h4 class="about-me-profession">Front-End Developer</h4>
<h1 class="about-me-name">John Doe</h1>
<p class="about-me-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Quis ipsum suspendisse ultrices gravida.
Risus commodo viverra maecenas accumsan lacus vel facilisis.</p>
</div>
<!-- Projects sections -->
<div class="projects-section">
<h3 class="project-header">Projects</h3>
<ol class="projects-list">
<li>
<a href="https://barbershop.goit.global/" class="project-name">https://barbershop.goit.global/</a>
<span class="project-info">........................</span>
<span class="project-info">[ HTml5, CSS3 ]</span>
</li>
<li>
<a href="https://cryptohub.goit.global/" class="project-name">https://cryptohub.goit.global/</a>
<span class="project-info">........................</span>
<span class="project-info">[ JavaScript ]</span>
</li>
<li>
<a href="https://kidslike.goit.global/" class="project-name">https://kidslike.goit.global/</a>
<span class="project-info">.......................</span>
<span class="project-info">[ React.js, Node.js ]</span>
</li>
</ol>
</div>
<!-- Work experience sections -->
<div class="work-experience-section">
<h3 class="work-experience-header">Work Experience</h3>
<!-- 1st company -->
<div class="company-container">
<h4 class="company-name">Front-End Developer
<span class="company-info">Freelance</span>
</h4>
<p class="company-time">March 2022 - up to now | Country</p>
<ul class="company-elements-list">
<li>Dezvoltare de site-uri și aplicații mobile</li>
<li>Remedieri de erori și îmbunătățiri ale funcționalității existente</li>
<li>Creșterea productivității site-urilor SPA și statice</li>
<li>Refactorizarea șabloanelor și programelor existente</li>
</ul>
</div>
<!-- 2nd company -->
<div class="company-container">
<h4 class="company-name">Front-End Developer
<span class="company-info">Freelance</span>
</h4>
<p class="company-time">October 2019 - up to now | Country</p>
<ul class="company-elements-list">
<li>Dezvoltare de site-uri și aplicații mobile</li>
<li>Remedieri de erori și îmbunătățiri ale funcționalității existente</li>
<li>Creșterea productivității site-urilor SPA și statice</li>
<li>Refactorizarea șabloanelor și programelor existente</li>
</ul>
</div>
<!-- 3nd company -->
<div class="company-container">
<h4 class="company-name">Manager Glory
<span class="company-info">LLC</span>
</h4>
<p class="company-time">June 2014 - February 2015 | Country</p>
<ul class="company-elements-list">
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
<li>Quis ipsum suspendisse ultrices gravida</li>
<li>Risus commodo viverra maecenas.</li>
</ul>
</div>
</div>
<!-- Education section -->
<div class="education-section">
<h3 class="education-header">Education</h3>
<!-- 1st education -->
<div class="education-container">
<h4 class="education-name">National University</h4>
<span class="education-info">Management</span>
<p class="education-time">September 2009 - June 2014 | Country</p>
</div>
<!-- 2st education -->
<div class="education-container">
<h4 class="education-name">GoIT</h4>
<span class="education-info">Fullstack Online</span>
<p class="education-time">January 2019 - October 2019 | Country</p>
</div>
</div>
</div>
<!-- Sidebar section -->
<aside class="sidebar-section">
<img src="images/photo.png" alt="profile picture" width="370" class="sidebar-image">
<!-- Contacts information -->
<div class="contacts-container">
<h3 class="contacts-header">Contacts</h3>
<div class="contacts-element">
<span class="contacts-item">C:</span>
<a href="tel:+111111111111" class="contacts-phone">+1 111 1111 11 11</a>
</div>
<div>
<span class="contacts-item">E:</span>
<a href="mailto:johndoe@gmail.com" class="contacts-email">johndoe@gmail.com</a>
</div>
</div>
<!-- Tech skills section -->
<div class="tech-skills-section">
<h3 class="tech-skills-header">Tech skills</h3>
<ul class="tech-skills-list">
<li>HTML5</li>
<li>CSS3</li>
<li>GIT</li>
<li>WebPack</li>
<li>JavaScript</li>
<li>React.js</li><li>HTML5</li>
<li>Node.js</li>
</ul>
</div>
<!-- Soft skills section -->
<div class="soft-skills-section">
<h3 class="soft-skills-header">Soft skills</h3>
<ul class="soft-skills-list">
<li>Scrum</li>
<li>Agile</li>
<li>GTD</li>
<li>Teamwork</li>
</ul>
</div>
</aside>
</div>
</body>
</html>