-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
308 lines (283 loc) · 25.6 KB
/
index.html
File metadata and controls
308 lines (283 loc) · 25.6 KB
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
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
<!DOCTYPE html>
<html lang="az">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cavid | Developer</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<nav class="navbar">
<div class="nav-container">
<div class="nav-logo">
<a href="index.html" class="logo-link">
<span class="logo-box">C</span>
Cavid | Developer
</a>
</div>
<div class="nav-menu">
<a href="#hero" class="nav-link">Ana Səhifə</a>
<a href="#about" class="nav-link">Haqqımda</a>
<a href="#contact" class="nav-link">Əlaqə</a>
<button id="theme-toggle" class="theme-toggle" aria-label="Toggle theme">
<svg class="sun-icon" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="5"></circle>
<line x1="12" y1="1" x2="12" y2="3"></line>
<line x1="12" y1="21" x2="12" y2="23"></line>
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
<line x1="1" y1="12" x2="3" y2="12"></line>
<line x1="21" y1="12" x2="23" y2="12"></line>
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
</svg>
<svg class="moon-icon" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
</svg>
</button>
</div>
</div>
</nav>
<main>
<section id="hero" class="hero-section">
<div class="blob blob-1"></div>
<div class="blob blob-2"></div>
<div class="blob blob-3"></div>
<div class="hero-container">
<div class="hero-content">
<h1 class="hero-title">
Creative <br>
<span class="gradient-text">Developer</span>
</h1>
<p class="hero-description">
Salam, mən <strong>Cavid</strong>. Müasir veb texnologiyaları ilə vizual olaraq cəlbedici və funksional rəqəmsal həllər yaradıram. Next.js, React və arxa fon sistemləri üzrə ixtisaslaşmışam.
</p>
<div class="hero-buttons">
<a href="#contact" class="btn btn-primary">
Mənimlə İşlə
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="5" y1="12" x2="19" y2="12"></line>
<polyline points="12 5 19 12 12 19"></polyline>
</svg>
</a>
<a href="#about" class="btn btn-secondary">Haqqımda Daha Çox</a>
</div>
<div class="social-links">
<a href="https://github.com/Cavid0" target="_blank" class="social-link" aria-label="GitHub">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
</svg>
</a>
<a href="https://www.linkedin.com/in/cavid-shukurov-2129152b2/" target="_blank" class="social-link" aria-label="LinkedIn">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z"/>
</svg>
</a>
<a href="mailto:cavidwukurov917@gmail.com" class="social-link" aria-label="Email">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
<polyline points="22,6 12,13 2,6"></polyline>
</svg>
</a>
</div>
</div>
<div class="hero-visual">
<div class="visual-card">
<div class="visual-noise"></div>
<div class="visual-gradient"></div>
<div class="visual-content">
<svg class="code-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="0.5">
<polyline points="16 18 22 12 16 6"></polyline>
<polyline points="8 6 2 12 8 18"></polyline>
</svg>
<div class="placeholder-lines">
<div class="placeholder-line"></div>
<div class="placeholder-line short"></div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="tech-stack-section">
<div class="tech-container">
<div class="skill-badge skill-javascript">
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0zm22.034 18.276c-.175-1.095-.888-2.015-3.003-2.873-.736-.345-1.554-.585-1.797-1.14-.091-.33-.105-.51-.046-.705.15-.646.915-.84 1.515-.66.39.12.75.42.976.9 1.034-.676 1.034-.676 1.755-1.125-.27-.42-.404-.601-.586-.78-.63-.705-1.469-1.065-2.834-1.034l-.705.089c-.676.165-1.32.525-1.71 1.005-1.14 1.291-.811 3.541.569 4.471 1.365 1.02 3.361 1.244 3.616 2.205.24 1.17-.87 1.545-1.966 1.41-.811-.18-1.26-.586-1.755-1.336l-1.83 1.051c.21.48.45.689.81 1.109 1.74 1.756 6.09 1.666 6.871-1.004.029-.09.24-.705.074-1.65l.046.067zm-8.983-7.245h-2.248c0 1.938-.009 3.864-.009 5.805 0 1.232.063 2.363-.138 2.711-.33.689-1.18.601-1.566.48-.396-.196-.597-.466-.83-.855-.063-.105-.11-.196-.127-.196l-1.825 1.125c.305.63.75 1.172 1.324 1.517.855.51 2.004.675 3.207.405.783-.226 1.458-.691 1.811-1.411.51-.93.402-2.07.397-3.346.012-2.054 0-4.109 0-6.179l.004-.056z"/>
</svg>
<span>JavaScript</span>
</div>
<div class="skill-badge skill-typescript">
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
<path d="M1.125 0C.502 0 0 .502 0 1.125v21.75C0 23.498.502 24 1.125 24h21.75c.623 0 1.125-.502 1.125-1.125V1.125C24 .502 23.498 0 22.875 0zm17.363 9.75c.612 0 1.154.037 1.627.111a6.38 6.38 0 0 1 1.306.34v2.458a3.95 3.95 0 0 0-.643-.361 5.093 5.093 0 0 0-.717-.26 5.453 5.453 0 0 0-1.426-.2c-.3 0-.573.028-.819.086a2.1 2.1 0 0 0-.623.242c-.17.104-.3.229-.393.374a.888.888 0 0 0-.14.49c0 .196.053.373.156.529.104.156.252.304.443.444s.423.276.696.41c.273.135.582.274.926.416.47.197.892.407 1.266.628.374.222.695.473.963.753.268.279.472.598.614.957.142.359.214.776.214 1.253 0 .657-.125 1.21-.373 1.656a3.033 3.033 0 0 1-1.012 1.085 4.38 4.38 0 0 1-1.487.596c-.566.12-1.163.18-1.79.18a9.916 9.916 0 0 1-1.84-.164 5.544 5.544 0 0 1-1.512-.493v-2.63a5.033 5.033 0 0 0 3.237 1.2c.333 0 .624-.03.872-.09.249-.06.456-.144.623-.25.166-.108.29-.234.373-.38a1.023 1.023 0 0 0-.074-1.089 2.12 2.12 0 0 0-.537-.5 5.597 5.597 0 0 0-.807-.444 27.72 27.72 0 0 0-1.007-.436c-.918-.383-1.602-.852-2.053-1.405-.45-.553-.676-1.222-.676-2.005 0-.614.123-1.141.369-1.582.246-.441.58-.804 1.004-1.089a4.494 4.494 0 0 1 1.47-.629 7.536 7.536 0 0 1 1.77-.201zm-15.113.188h9.563v2.166H9.506v9.646H6.789v-9.646H3.375z"/>
</svg>
<span>TypeScript</span>
</div>
<div class="skill-badge skill-react">
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
<path d="M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z"/>
</svg>
<span>React</span>
</div>
<div class="skill-badge skill-nextjs">
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
<path d="M11.572 0c-.176 0-.31.001-.358.007a19.76 19.76 0 0 1-.364.033C7.443.346 4.25 2.185 2.228 5.012a11.875 11.875 0 0 0-2.119 5.243c-.096.659-.108.854-.108 1.747s.012 1.089.108 1.748c.652 4.506 3.86 8.292 8.209 9.695.779.25 1.6.422 2.534.525.363.04 1.935.04 2.299 0 1.611-.178 2.977-.577 4.323-1.264.207-.106.247-.134.219-.158-.02-.013-.9-1.193-1.955-2.62l-1.919-2.592-2.404-3.558a338.739 338.739 0 0 0-2.422-3.556c-.009-.002-.018 1.579-.023 3.51-.007 3.38-.01 3.515-.052 3.595a.426.426 0 0 1-.206.214c-.075.037-.14.044-.495.044H7.81l-.108-.068a.438.438 0 0 1-.157-.171l-.049-.106.005-4.703.007-4.705.072-.092a.645.645 0 0 1 .174-.143c.096-.047.134-.051.54-.051.478 0 .558.018.682.154.035.038 1.337 1.999 2.895 4.361a10760.433 10760.433 0 0 0 4.735 7.17l1.9 2.879.096-.063a12.317 12.317 0 0 0 2.466-2.163 11.944 11.944 0 0 0 2.824-6.134c.096-.66.108-.854.108-1.748 0-.893-.012-1.088-.108-1.747-.652-4.506-3.859-8.292-8.208-9.695a12.597 12.597 0 0 0-2.499-.523A33.119 33.119 0 0 0 11.573 0zm4.069 7.217c.347 0 .408.005.486.047a.473.473 0 0 1 .237.277c.018.06.023 1.365.018 4.304l-.006 4.218-.744-1.14-.746-1.14v-3.066c0-1.982.01-3.097.023-3.15a.478.478 0 0 1 .233-.296c.096-.05.13-.054.5-.054z"/>
</svg>
<span>Next.js</span>
</div>
<div class="skill-badge skill-tailwind">
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
<path d="M12.001,4.8c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 C13.666,10.618,15.027,12,18.001,12c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C16.337,6.182,14.976,4.8,12.001,4.8z M6.001,12c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 c1.177,1.194,2.538,2.576,5.512,2.576c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C10.337,13.382,8.976,12,6.001,12z"/>
</svg>
<span>CSS</span>
</div> <div class="skill-badge skill-html">
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
<path d="M1.5 0h21l-1.91 21.563L11.977 24l-8.565-2.438L1.5 0zm7.031 9.75l-.232-2.718 10.059.003.23-2.622L5.412 4.41l.698 8.01h9.126l-.326 3.426-2.91.804-2.955-.81-.188-2.11H6.248l.33 4.171L12 19.351l5.379-1.443.744-8.157H8.531z"/>
</svg>
<span>HTML</span>
</div> <div class="skill-badge skill-ruby">
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
<path d="M20.156.083c3.033.525 3.893 2.598 3.829 4.77L24 4.822 22.635 22.71 4.89 23.926h.016C3.433 23.864.15 23.729 0 19.139l1.645-3 2.819 6.586.503 1.172 2.805-9.144-.03.007.016-.03 9.255 2.956-1.396-5.431-.99-3.9 8.82-.569-.615-.51L16.5 2.114 21.2 1.5l-.69-1.417h-.354z"/>
</svg>
<span>Ruby</span>
</div>
<div class="skill-badge skill-sql">
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
<path d="M12 3C7.58 3 4 4.79 4 7v10c0 2.21 3.59 4 8 4s8-1.79 8-4V7c0-2.21-3.58-4-8-4zm6 14c0 .55-2.69 2-6 2s-6-1.45-6-2v-2.23c1.61.78 3.72 1.23 6 1.23s4.39-.45 6-1.23V17zm0-4.55c-1.3.95-3.58 1.55-6 1.55s-4.7-.6-6-1.55V9.64C7.47 10.47 9.61 11 12 11s4.53-.53 6-1.36v2.81zM12 9C8.69 9 6 7.55 6 7s2.69-2 6-2 6 1.45 6 2-2.69 2-6 2z"/>
</svg>
<span>SQL</span>
</div>
<div class="skill-badge skill-c">
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
<path d="M16.5921 9.1962C17.1521 9.6362 17.5821 10.1962 17.8821 10.8762C18.1921 11.5462 18.3521 12.2662 18.3521 13.0462C18.3521 13.8262 18.1921 14.5562 17.8721 15.2262C17.5621 15.9062 17.1321 16.4662 16.5821 16.8962C16.0321 17.3362 15.4021 17.6662 14.6921 17.8762C13.9821 18.0862 13.2321 18.1962 12.4421 18.1962H7.1621V5.8062H12.4421C13.2221 5.8062 13.9721 5.9062 14.6921 6.1162C15.4021 6.3262 16.0321 6.6662 16.5821 7.1062C17.1321 7.5462 17.5621 8.1062 17.8721 8.7762C18.1821 9.4462 18.3421 10.2362 18.3421 11.1462C18.3421 11.5562 18.3021 11.9562 18.2121 12.3362C18.1221 12.7162 17.9921 13.0762 17.8121 13.4262C17.6221 13.7662 17.3921 14.0862 17.1121 14.3862C16.8321 14.6862 16.5021 14.9562 16.1321 15.1962C16.4821 15.3862 16.8021 15.6062 17.0821 15.8562C17.3721 16.1062 17.6221 16.3962 17.8321 16.7162C18.0521 17.0362 18.2221 17.3862 18.3521 17.7662C18.4821 18.1462 18.5521 18.5462 18.5521 18.9662V19.1962H15.9321V18.9662C15.9321 18.5562 15.8621 18.1762 15.7221 17.8262C15.5821 17.4762 15.3821 17.1762 15.1221 16.9162C14.8621 16.6562 14.5421 16.4562 14.1721 16.3162C13.8021 16.1762 13.3821 16.1062 12.9121 16.1062H9.7821V18.1962H7.1621V5.8062H9.7821V13.9062H12.9121C13.3821 13.9062 13.8021 13.8362 14.1721 13.6962C14.5421 13.5562 14.8621 13.3562 15.1221 13.0962C15.3821 12.8362 15.5821 12.5362 15.7221 12.1862C15.8621 11.8362 15.9321 11.4562 15.9321 11.0462C15.9321 10.6362 15.8621 10.2562 15.7221 9.9062C15.5821 9.5562 15.3821 9.2562 15.1221 8.9962C14.8621 8.7362 14.5421 8.5362 14.1721 8.3962C13.8021 8.2562 13.3821 8.1862 12.9121 8.1862H9.7821V5.8062H12.4421C13.2221 5.8062 13.9721 5.9062 14.6921 6.1162C15.4021 6.3262 16.0321 6.6662 16.5821 7.1062Z"/>
</svg>
<span>C</span>
</div>
</div>
</section>
<section id="about" class="about-section">
<div class="about-container">
<div class="section-header">
<h2 class="section-title">Haqqımda</h2>
<div class="title-underline"></div>
</div>
<div class="about-grid">
<div class="about-text">
<p>
Mən proqramlaşdırma dünyasına böyük marağı olan bir gəncəm. Kod yazmaq mənim üçün sadəcə iş deyil, kompleks problemləri həll etmək sənətidir.
</p>
<p>
Hər yeni layihədə özümü inkişaf etdirməyə çalışıram. Frontend dizayndan tutmuş Backend arxitekturaya qədər hər detala diqqət yetirirəm.
</p>
<ul class="about-list">
<li>
<span class="list-dot"></span>
Full Stack Development
</li>
<li>
<span class="list-dot"></span>
UI/UX Design Principles
</li>
<li>
<span class="list-dot"></span>
Database Optimization
</li>
<li>
<span class="list-dot"></span>
Vibe Coding
</li>
</ul>
</div>
<div class="about-cards">
<div class="feature-card">
<svg class="feature-icon" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<rect x="4" y="4" width="16" height="16" rx="2" ry="2"></rect>
</svg>
<h3 class="feature-title">Yaradıcı Yanaşma</h3>
<p class="feature-description">Standart qəliblərdən kənara çıxaraq, hər layihəyə unikal vizual üslub və funksionallıq qatıram.</p>
</div>
<div class="feature-card">
<svg class="feature-icon feature-icon-pink" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<polyline points="4 17 10 11 4 5"></polyline>
<line x1="12" y1="19" x2="20" y2="19"></line>
</svg>
<h3 class="feature-title">Təmiz Kod</h3>
<p class="feature-description">Oxunaqlı, saxlanıla bilən və optimal performanslı kod yazmaq mənim əsas prinsiplərimdəndir.</p>
</div>
</div>
</div>
</div>
</section>
<section class="projects-section">
<div class="projects-container">
<div class="projects-header">
<div>
<h2 class="section-title">GitHub Repozitoriyaları</h2>
<p class="section-subtitle">Son zamanlarda üzərində işlədiyim açıq qaynaqlı layihələr.</p>
</div>
<a href="https://github.com/Cavid0" target="_blank" class="view-all-link">
Hamısına bax
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="5" y1="12" x2="19" y2="12"></line>
<polyline points="12 5 19 12 12 19"></polyline>
</svg>
</a>
</div>
<div id="github-repos" class="repos-grid">
<div class="loading-message">GitHub repozitoriyaları yüklənir...</div>
</div>
</div>
</section>
<section id="contact" class="contact-section">
<div class="contact-container">
<h2 class="contact-title">Birgə nəsə yaradaq?</h2>
<p class="contact-description">
Layihələriniz və ya əməkdaşlıq təklifləriniz üçün hər zaman açığım.
</p>
<div class="contact-cards">
<a href="mailto:cavidwukurov917@gmail.com" class="contact-card">
<div class="contact-icon contact-icon-red">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
<polyline points="22,6 12,13 2,6"></polyline>
</svg>
</div>
<div class="contact-info">
<p class="contact-label">Email</p>
<p class="contact-value">cavidwukurov917@gmail.com</p>
</div>
</a>
<a href="https://github.com/Cavid0" target="_blank" class="contact-card">
<div class="contact-icon contact-icon-gray">
<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
</svg>
</div>
<div class="contact-info">
<p class="contact-label">GitHub</p>
<p class="contact-value">@Cavid0</p>
</div>
</a>
<a href="https://www.linkedin.com/in/cavid-shukurov-2129152b2/" target="_blank" class="contact-card">
<div class="contact-icon contact-icon-blue">
<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
<path d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z"/>
</svg>
</div>
<div class="contact-info">
<p class="contact-label">LinkedIn</p>
<p class="contact-value">Cavid Shukurov</p>
</div>
</a>
</div>
</div>
</section>
</main>
<footer class="footer">
<div class="footer-container">
<p>© 2026 Cavid. Bütün hüquqlar qorunur.</p>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>