-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
205 lines (204 loc) · 13.2 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
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-50..200" />
<!-- FavIcon -->
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<!-- Font Coiny -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Coiny&display=swap" rel="stylesheet">
<!-- Styles -->
<link rel="stylesheet" href="/css/style.css">
<title>Xackspel - PHP Developer</title>
<!--Open Graph Meta Tags-->
<meta property="og:title" content="Xackspel - PHP Developer" />
<meta property="og:description" content="PHP software developer" />
<meta property="og:url" content="https://xackspel.github.io/" />
<meta property="og:type" content="website">
<meta property="og:image" content="https://xackspel.github.io/android-chrome-512x512.png" />
<!-- Twitter Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta property="twitter:domain" content="xackspel.github.io">
<meta property="twitter:url" content="https://xackspel.github.io/">
<meta name="twitter:title" content="Xackspel - PHP Developer">
<meta name="twitter:description" content="PHP software developer">
<meta name="twitter:image" content="https://xackspel.github.io/android-chrome-512x512.png">
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-S7K79DKBSJ"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-S7K79DKBSJ');
</script>
<!--Banner confirmation-->
<script type="text/javascript" data-cmp-ab="1" src="https://cdn.consentmanager.net/delivery/autoblocking/a9ae9f4ed1c5d.js" data-cmp-host="a.delivery.consentmanager.net" data-cmp-cdn="cdn.consentmanager.net" data-cmp-codesrc="16"></script>
</head>
<body style="background-image: url('/img/white_brick_wall.png');">
<header>
<div class="container-fluid shadow-lg" id="navigation">
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container-fluid">
<a class="navbar-brand" href="/">Xackspel</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0 nav-underline" role="tablist">
<li class="nav-item">
<a class="nav-link active" aria-current="page" id="home-tab" data-bs-toggle="tab" data-bs-target="#home" role="tab" aria-controls="home" aria-selected="true" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" id="about-tab" data-bs-toggle="tab" data-bs-target="#about" role="tab" aria-controls="about" aria-selected="true">About</a>
</li>
<li class="nav-item">
<a class="nav-link" id="cv-tab" data-bs-toggle="tab" data-bs-target="#cv" role="tab" aria-controls="cv" aria-selected="true">CV</a>
</li>
<li class="nav-item">
<a class="nav-link" id="contact-tab" data-bs-toggle="tab" data-bs-target="#contact" role="tab" aria-controls="contact" aria-selected="true">Contact</a>
</li>
</ul>
<form class="d-flex" role="search">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div>
</div>
</nav>
</div>
</header>
<main>
<br>
<div class="container-fluid">
<div class="container-fluid tab-content">
<div class="tab-pane shadow-lg active" id="home" role="tabpanel" aria-labelledby="home-tab" tabindex="0">
<div class="container px-4 py-5">
<h2 class="pb-2 border-bottom font-monospace">Welcome!</h2>
<p class="font-monospace">
I'm web developer, and best with PHP, JavaScript, CSS, HTML. Also I'm familiar with Python.
</p>
<p class="font-monospace">
This is my showroom =). Yes, it's sounds strange but this website showing my experience and skills. Here I'm showing personal achivements, portfolio and curriculum vitae.
</p>
<p class="font-monospace">
Web development help make our dreams a true.
Programming is a way to improve process, increase speed, support users and make this world a little bit better.
Also helping us support connections with other people and give them a chance make thier rock as a wall with their dreams.
From beggining people drawing on the walls of rocks, and I'm think it's was a first websites).
</p>
</div>
</div>
<div class="tab-pane shadow-lg" id="about" role="tabpanel" aria-labelledby="about-tab" tabindex="0">
<div class="container px-4 py-5" id="icon-grid">
<h2 class="pb-2 border-bottom">I'm fimilar wtith next technologies:</h2>
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4 g-4 py-5">
<div class="col d-flex align-items-start">
<i class="bi-filetype-php text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">PHP</h3>
<p>Main program language which I'm using everyday.</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi-filetype-python text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">Python</h3>
<p>In learning, but I have did a telegram bot, and small script which sorting elements in filegit.</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi-filetype-js text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">JavaScript</h3>
<p>Powerful program language, which extend website possibility.</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi-bootstrap text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">Bootstrap v5.3</h3>
<p>This is my first framework I have learned.</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi-filetype-css text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">CSS 3.0</h3>
<p>Design and beauty.</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi-filetype-html text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">HTML 5</h3>
<p>Hyper Text Markup Language.</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi-git text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">GIT</h3>
<p>Version control system.</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi-github text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">GitHub</h3>
<p>One of the most popular service for developing software. And host it.</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi-ubuntu text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">Linux: Ubuntu v22.04</h3>
<p>Open source operation system.</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi-server text-body-secondary flex-shrink-0 me-3" style="font-size: 2rem; color: cornflowerblue;"></i>
<div>
<h3 class="fw-bold mb-0 fs-4 text-body-emphasis">LAMP webserver</h3>
<p>Linux Apache MySQL PHP webserver on local laptop.</p>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane shadow-lg" id="cv" role="tabpanel" aria-labelledby="cv-tab" tabindex="0">
<div class="container px-4 py-5" id="icon-grid">
<h2 class="pb-2 border-bottom">CV Page in development</h2>
<a href="/docs/CV_PHP_Oleksii_Zhmud_CV_PHP_Web_Developer.pdf" download="/docs/CV_PHP_Oleksii_Zhmud_CV_PHP_Web_Developer.pdf"><button type="button" class="btn btn-primary col-2">Donwload CV</button></a>
<a href="/docs/CV_PHP_Oleksii_Zhmud_CV_PHP_Web_Developer.pdf">
<button type="button" class="btn btn-primary col-2">Open CV</button>
</a>
</div>
</div>
<div class="tab-pane shadow-lg" id="contact" role="tabpanel" aria-labelledby="contact-tab" tabindex="0">
<div class="container px-4 py-5" id="icon-grid">
<h2 class="pb-2 border-bottom">Contact Page in development</h2>
</div>
</div>
</div>
</div>
</main>
<footer class="fixed-bottom">
<p class="text-center font-monospace">Xackspel | GitHub pages | 2023</p>
</footer>
<script src="/js/main_js.js"></script>
</body>
</html>