-
Notifications
You must be signed in to change notification settings - Fork 0
/
portfolio.html
160 lines (160 loc) · 6.55 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
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<!DOCTYPE html>
<html lang="uk">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Портфоліо</title>
<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=Raleway:wght@700&family=Roboto:wght@400;500;700;900&display=swap"
rel="stylesheet"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/modern-normalize/1.1.0/modern-normalize.min.css"
integrity="sha512-wpPYUAdjBVSE4KJnH1VR1HeZfpl1ub8YT/NKx4PuQ5NmX2tKuGu6U/JRp5y+Y8XG2tV+wKQpNHVUX03MfMFn9Q=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<link rel="stylesheet" href="./css/styles.css" />
</head>
<body>
<!-- Шапка -->
<header class="header">
<div class="conteiner header-div">
<nav class="flex nav-header">
<a href="./index.html" class="logo"> <span class="web">Web</span>Studio </a>
<ul class="list flex">
<li>
<a href="./index.html" class="header-link">Студія</a>
</li>
<li>
<a href="./portfolio.html" class="header-link">Портфоліо</a>
</li>
<li>
<a href="/" class="header-link">Контакти</a>
</li>
</ul>
</nav>
<ul class="list flex head-ul">
<!-- Посилання на почту -->
<li class="li-header">
<a href="mailto:[email protected]" class="header-tel">[email protected]</a>
</li>
<!-- Посилання на телефон -->
<li><a href="tel:+380961111111" class="header-tel">+38 096 111 11 11</a></li>
</ul>
</div>
</header>
<!-- Меин -->
<main>
<section class="section">
<div class="conteiner">
<h1 hidden>Список</h1>
<ul class="list flex portfo-btn">
<li><button type="button" class="portfolio-btn">Усі</button></li>
<li><button type="button" class="portfolio-btn">Веб-сайти</button></li>
<li><button type="button" class="portfolio-btn">Додатки</button></li>
<li><button type="button" class="portfolio-btn">Дизайн</button></li>
<li><button type="button" class="portfolio-btn">Маркетинг</button></li>
</ul>
<ul class="list flex wrap">
<li>
<img src="./images/Технокряк.jpg" alt="Технокряк" width="370" height="294" />
<div class="cont-wrap">
<h2 class="portfolio-tittle">Технокряк</h2>
<p class="portfolio-text">Веб-сайт</p>
</div>
</li>
<li>
<img src="./images/Постер.jpg" alt="Баскетбольний постер" width="370" height="294" />
<div class="cont-wrap">
<h2 class="portfolio-tittle">Постер New Orlean vs Golden Star</h2>
<p class="portfolio-text">Дизайн</p>
</div>
</li>
<li>
<img
src="./images/Ресторан.jpg"
alt="Ресторан морскої їжі"
width="370"
height="294"
/>
<div class="cont-wrap">
<h2 class="portfolio-tittle">Ресторан Seafood</h2>
<p class="portfolio-text">Додаток</p>
</div>
</li>
<li>
<img src="./images/Навушники.jpg" alt="Навушники" width="370" height="294" />
<div class="cont-wrap">
<h2 class="portfolio-tittle">Проєкт Prime</h2>
<p class="portfolio-text">Маркетинг</p>
</div>
</li>
<li>
<img src="./images/Коробки.jpg" alt="Коробки" width="370" height="294" />
<div class="cont-wrap">
<h2 class="portfolio-tittle">Проєкт Boxes</h2>
<p class="portfolio-text">Додаток</p>
</div>
</li>
<li>
<img src="./images/Монітор.jpg" alt="Монітор" width="370" height="294" />
<div class="cont-wrap">
<h2 class="portfolio-tittle">Inspiration has no Borders</h2>
<p class="portfolio-text">Веб-сайт</p>
</div>
</li>
<li>
<img src="./images/Журнал.jpg" alt="Журнал" width="370" height="294" />
<div class="cont-wrap">
<h2 class="portfolio-tittle">Видання Limited Edition</h2>
<p class="portfolio-text">Дизайн</p>
</div>
</li>
<li>
<img src="./images/Бірка.jpg" alt="Бірка" width="370" height="294" />
<div class="cont-wrap">
<h2 class="portfolio-tittle">Проєкт LAB</h2>
<p class="portfolio-text">Маркетинг</p>
</div>
</li>
<li>
<img src="./images/Ноутбук.jpg" alt="Ноутбук" width="370" height="294" />
<div class="cont-wrap">
<h2 class="portfolio-tittle">Growing Business</h2>
<p class="portfolio-text">Додаток</p>
</div>
</li>
</ul>
</div>
</section>
</main>
<!-- Футер -->
<footer class="basement">
<div class="conteiner">
<a href="https://vanvalera.github.io/goit-markup-hw-02/index.html" class="logo-footer">
<span class="web">Web</span>Studio
</a>
<address class="style-address">
<ul class="list">
<li class="item-footer">
<a href="https://goo.gl/maps/cJ9QzEwfVTvkRfvY8" class="list-address"
>м. Київ, пр-т Лесі Українки, 26</a
>
</li>
<li class="item-footer">
<a href="mailto:[email protected]" class="list-tel">[email protected]</a>
</li>
<li class="item-footer">
<a href="tel:+380961111111" class="list-tel">+38 096 111 11 11</a>
</li>
</ul>
</address>
</div>
</footer>
</body>
</html>