-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathportfolio.html
136 lines (130 loc) · 6.06 KB
/
portfolio.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
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Miami Nights | Портфолио</title>
<link rel="stylesheet" href="styles.css">
<link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
</head>
<body class="portfolio-page">
<div class="noise-overlay"></div>
<div class="language-selector">
<div class="language-links">
<a href="#" class="language-link" data-lang="ru">RU</a>
<span class="divider">|</span>
<a href="#" class="language-link" data-lang="en">EN</a>
<span class="divider">|</span>
<a href="#" class="language-link" data-lang="es">ES</a>
</div>
</div>
<div class="city-background">
<div class="glitch-bg"></div>
<div class="cyber-grid"></div>
<div class="neon-lines"></div>
<div class="holo-elements"></div>
<div class="noise-overlay"></div>
</div>
<header class="main-header">
<div class="header-content">
<div class="glitch-container">
<h1 class="cyber-glitch-title" data-text="MIAMI NIGHTS">MIAMI NIGHTS</h1>
</div>
<nav class="main-nav">
<ul class="neon-menu">
<li>
<a href="index.html" class="neon-link" data-translate="home">
<i class="fas fa-home"></i>
<span>ГЛАВНАЯ</span>
</a>
</li>
<li>
<a href="services.html" class="neon-link" data-translate="services">
<i class="fas fa-cogs"></i>
<span>УСЛУГИ</span>
</a>
</li>
<li>
<a href="portfolio.html" class="neon-link active" data-translate="portfolio">
<i class="fas fa-project-diagram"></i>
<span>ПОРТФОЛИО</span>
</a>
</li>
<li>
<a href="templates.html" class="neon-link" data-translate="templates">
<i class="fas fa-layer-group"></i>
<span>ШАБЛОНЫ</span>
</a>
</li>
<li>
<a href="contacts.html" class="neon-link" data-translate="contacts">
<i class="fas fa-network-wired"></i>
<span>КОНТАКТЫ</span>
</a>
</li>
</ul>
</nav>
</div>
</header>
<main class="portfolio-content">
<div class="portfolio-grid">
<!-- Проект 1 -->
<div class="portfolio-card">
<div class="vertical-line-left"></div>
<div class="vertical-line-right"></div>
<div class="portfolio-image">
<img src="path/to/project1.jpg" alt="Веб-разработка">
<div class="cyber-overlay"></div>
</div>
<div class="portfolio-info">
<h3 class="cyber-heading">Веб-разработка</h3>
<p class="cyber-text">Разработка современного веб-приложения с использованием React и Node.js</p>
<button class="cyber-button">
<span class="cyber-button-text">ПОДРОБНЕЕ</span>
<span class="cyber-button-glitch"></span>
</button>
</div>
</div>
<!-- Проект 2 -->
<div class="portfolio-card">
<div class="vertical-line-left"></div>
<div class="vertical-line-right"></div>
<div class="portfolio-image">
<img src="path/to/project2.jpg" alt="3D Моделирование">
<div class="cyber-overlay"></div>
</div>
<div class="portfolio-info">
<h3 class="cyber-heading">3D Моделирование</h3>
<p class="cyber-text">Создание персонажей и окружения для игрового проекта</p>
<button class="cyber-button">
<span class="cyber-button-text">ПОДРОБНЕЕ</span>
<span class="cyber-button-glitch"></span>
</button>
</div>
</div>
<!-- Проект 3 -->
<div class="portfolio-card">
<div class="vertical-line-left"></div>
<div class="vertical-line-right"></div>
<div class="portfolio-image">
<img src="path/to/project3.jpg" alt="UI/UX Дизайн">
<div class="cyber-overlay"></div>
</div>
<div class="portfolio-info">
<h3 class="cyber-heading">UI/UX Дизайн</h3>
<p class="cyber-text">Разработка интерфейса мобильного приложения в стиле киберпанк</p>
<button class="cyber-button">
<span class="cyber-button-text">ПОДРОБНЕЕ</span>
<span class="cyber-button-glitch"></span>
</button>
</div>
</div>
</div>
</main>
<div id="particles-js"></div>
<script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
<script src="scripts.js"></script>
</body>
</html>