-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathportfolio.html
137 lines (137 loc) · 6.37 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
<!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=Montserrat:wght@400;700&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 head">
<nav class="nav-header">
<a href="./index.html" class="logo"> <span class="web">Web</span>Studio </a>
<ul class="list flex">
<li class="item">
<a href="./index.html" class="header-link">Студія</a>
</li>
<li class="item">
<a href="./portfolio.html" class="header-link">Портфоліо</a>
</li>
<li class="item">
<a href="/" class="header-link">Контакти</a>
</li>
</ul>
</nav>
<ul class="list flex">
<!-- Посилання на почту -->
<li class="nav-mail">
<a href="mailto:[email protected]" class="header-tel">[email protected]</a>
</li>
<!-- Посилання на телефон -->
<li class="nav-mail">
<a href="tel:+380961111111" class="header-tel">+38 096 111 11 11</a>
</li>
</ul>
</div>
</header>
<!-- Меин -->
<main>
<section class="section">
<div class="conteiner">
<div class="list-buttons">
<h1 hidden>Список</h1>
<ul class="list flex">
<li class="list-portfolio-btn"><button type="button" class="portfolio-btn">Усі</button></li>
<li class="list-portfolio-btn"><button type="button" class="portfolio-btn">Веб-сайти</button></li>
<li class="list-portfolio-btn"><button type="button" class="portfolio-btn">Додатки</button></li>
<li class="list-portfolio-btn"><button type="button" class="portfolio-btn">Дизайн</button></li>
<li class="list-portfolio-btn"><button type="button" class="portfolio-btn">Маркетинг</button></li>
</ul>
</div>
<ul class="list flex cards">
<li class="cards-img">
<img src="./images/Технокряк.jpg" alt="Технокряк" width="370" height="294" />
<div class="cards-border"><h2 class="portfolio-tittle">Технокряк</h2>
<p class="portfolio-text">Веб-сайт</p> </div>
</li>
<li class="cards-img">
<img src="./images/Постер.jpg" alt="Баскетбольний постер" width="370" height="294" />
<div class="cards-border"><h2 class="portfolio-tittle">Постер New Orlean vs Golden Star</h2>
<p class="portfolio-text">Дизайн</p></div>
</li>
<li class="cards-img">
<img src="./images/Ресторан.jpg" alt="Ресторан морскої їжі" width="370" height="294" />
<div class="cards-border"><h2 class="portfolio-tittle">Ресторан Seafood</h2>
<p class="portfolio-text">Додаток</p></div>
</li>
<li class="cards-img">
<img src="./images/Навушники.jpg" alt="Навушники" width="370" height="294" />
<div class="cards-border"><h2 class="portfolio-tittle">Проєкт Prime</h2>
<p class="portfolio-text">Маркетинг</p></div>
</li>
<li class="cards-img">
<img src="./images/Коробки.jpg" alt="Коробки" width="370" height="294" />
<div class="cards-border"><h2 class="portfolio-tittle">Проєкт Boxes</h2>
<p class="portfolio-text">Додаток</p></div>
</li>
<li class="cards-img">
<img src="./images/Монітор.jpg" alt="Монітор" width="370" height="294" />
<div class="cards-border"><h2 class="portfolio-tittle">Inspiration has no Borders</h2>
<p class="portfolio-text">Веб-сайт</p></div>
</li>
<li class="cards-img pading">
<img src="./images/Журнал.jpg" alt="Журнал" width="370" height="294" />
<div class="cards-border"><h2 class="portfolio-tittle">Видання Limited Edition</h2>
<p class="portfolio-text">Дизайн</p></div>
</li>
<li class="cards-img pading">
<img src="./images/Бірка.jpg" alt="Бірка" width="370" height="294" />
<div class="cards-border"><h2 class="portfolio-tittle">Проєкт LAB</h2>
<p class="portfolio-text">Маркетинг</p></div>
</li>
<li class="cards-img pading">
<img src="./images/Ноутбук.jpg" alt="Ноутбук" width="370" height="294" />
<div class="cards-border"><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="./index.html" class="logo-footer"> <span class="web">Web</span>Studio </a>
<address>
<ul class="list">
<li>
<a href="https://goo.gl/maps/cJ9QzEwfVTvkRfvY8" class="list-address">м. Київ, пр-т Лесі Українки, 26</a>
</li>
<li>
<a href="mailto:[email protected]" class="list-tel">[email protected]</a>
</li>
<li>
<a href="tel:+380961111111" class="list-tel">+38 096 111 11 11</a>
</li>
</ul>
</address>
</div>
</footer>
</body>
</html>