Skip to content

Commit 6dbdbc6

Browse files
juwainjuwain
committed
Добавляет разметку главной страницы
1 parent aca8be8 commit 6dbdbc6

File tree

8 files changed

+146
-36
lines changed

8 files changed

+146
-36
lines changed

‎css/style.css

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,35 @@ header a:visited {
111111
color: #ffffff;
112112
}
113113

114+
.visually-hidden {
115+
position: absolute;
116+
117+
width: 1px;
118+
height: 1px;
119+
margin: -1px;
120+
padding: 0;
121+
overflow: hidden;
122+
123+
border: 0;
124+
125+
clip: rect(0, 0, 0, 0);
126+
clip-path: inset(100%);
127+
}
128+
129+
.logo-list {
130+
max-width: 550px;
131+
margin: 50px auto;
132+
}
133+
134+
.logo-list ul {
135+
display: flex;
136+
justify-content: space-between;
137+
margin: 0;
138+
padding: 0;
139+
140+
list-style: none;
141+
}
142+
114143
.logo {
115144
width: 300px;
116145
height: 300px;

‎html-css.html

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -20,15 +20,15 @@
2020
</head>
2121
<body>
2222

23-
<main>
24-
<header>
25-
<a href="https://htmlacademy.ru" target="_blank">
26-
<img class="logo" src="img/bane.svg" width="300" height="300" alt="HTML Academy" title="HTML Academy">
27-
</a>
28-
<h1>Стиль кода Академии HTML</h1>
29-
<p><a href="https://github.com/htmlacademy/codeguide">github.com/htmlacademy/codeguide</a></p>
30-
</header>
23+
<header>
24+
<a href="https://htmlacademy.ru" target="_blank">
25+
<img class="logo" src="img/bane.svg" width="300" height="300" alt="HTML Academy" title="HTML Academy">
26+
</a>
27+
<h1>Стиль кода Академии HTML</h1>
28+
<p><a href="https://github.com/htmlacademy/codeguide">github.com/htmlacademy/codeguide</a></p>
29+
</header>
3130

31+
<main>
3232
<section class="chapter">
3333
<h2>Оглавление</h2>
3434
<article class="chapter-part">
@@ -538,34 +538,34 @@ <h4 id="css-font-variant">Варианты шрифта</h4>
538538
</div>
539539
</article>
540540
</section>
541+
</main>
541542

542-
<footer>
543-
<div class="contacts">
544-
<a class="logo-full" href="https://htmlacademy.ru">
545-
<img src="img/logo-full.svg" width="161" height="55" alt="HTML Academy" title="HTML Academy">
543+
<footer>
544+
<div class="contacts">
545+
<a class="logo-full" href="https://htmlacademy.ru">
546+
<img src="img/logo-full.svg" width="161" height="55" alt="HTML Academy" title="HTML Academy">
547+
</a>
548+
<div class="social-icons">
549+
<a class="icon icon-vk" href="https://vk.com/htmlacademy" target="_blank">
550+
Вконтакте
551+
</a>
552+
<a class="icon icon-fb" href="https://www.facebook.com/htmlacademy" target="_blank">
553+
Facebook
554+
</a>
555+
<a class="icon icon-tw" href="https://twitter.com/htmlacademy_ru" target="_blank">
556+
Twitter
557+
</a>
558+
<a class="icon icon-ig" href="https://instagram.com/htmlacademy" target="_blank">
559+
Instagram
546560
</a>
547-
<div class="social-icons">
548-
<a class="icon icon-vk" href="https://vk.com/htmlacademy" target="_blank">
549-
Вконтакте
550-
</a>
551-
<a class="icon icon-fb" href="https://www.facebook.com/htmlacademy" target="_blank">
552-
Facebook
553-
</a>
554-
<a class="icon icon-tw" href="https://twitter.com/htmlacademy_ru" target="_blank">
555-
Twitter
556-
</a>
557-
<a class="icon icon-ig" href="https://instagram.com/htmlacademy" target="_blank">
558-
Instagram
559-
</a>
560-
</div>
561-
<div class="github">
562-
<a class="github-link" href="https://github.com/htmlacademy" target="_blank">
563-
GitHub
564-
</a>
565-
</div>
566561
</div>
567-
</footer>
568-
</main>
562+
<div class="github">
563+
<a class="github-link" href="https://github.com/htmlacademy" target="_blank">
564+
GitHub
565+
</a>
566+
</div>
567+
</div>
568+
</footer>
569569

570570
<script src="js/prism.js"></script>
571571
</body>

‎img/bane.svg

Lines changed: 1 addition & 1 deletion
Loading

‎img/github.svg

Lines changed: 1 addition & 1 deletion
Loading

‎img/logo-full.svg

Lines changed: 1 addition & 1 deletion
Loading

‎img/logo-html.svg

Lines changed: 1 addition & 0 deletions
Loading

‎img/logo-js.svg

Lines changed: 1 addition & 0 deletions
Loading

‎index.html

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
<!DOCTYPE html>
2+
<html lang="ru">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Стиль кода Академии HTML</title>
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<meta name="twitter:card" content="summary_large_image">
8+
<meta name="twitter:site" content="@htmlacademy_ru">
9+
<meta name="twitter:image" content="https://htmlacademy.github.io/codeguide/img/og.png">
10+
<meta property="og:type" content="website">
11+
<meta property="og:url" content="https://htmlacademy.github.io/codeguide/">
12+
<meta property="og:title" itemprop="name" content="Стиль кода Академии HTML">
13+
<meta property="og:image" itemprop="image" content="https://htmlacademy.github.io/codeguide/img/og.png">
14+
15+
<link rel="stylesheet" href="css/normalize.css">
16+
<link rel="stylesheet" href="css/prism.css">
17+
<link rel="stylesheet" href="css/style.css">
18+
19+
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create','UA-29640059-7','auto');ga('send','pageview');</script>
20+
</head>
21+
<body>
22+
23+
<header>
24+
<a href="https://htmlacademy.ru" target="_blank">
25+
<img class="logo" src="img/bane.svg" width="300" height="300" alt="HTML Academy" title="HTML Academy">
26+
</a>
27+
<h1>Стиль кода Академии HTML</h1>
28+
<p><a href="https://github.com/htmlacademy/codeguide">github.com/htmlacademy/codeguide</a></p>
29+
</header>
30+
31+
<main>
32+
<nav class="logo-list">
33+
34+
<h2 class="visually-hidden">Разделы стиля кода</h2>
35+
36+
<ul>
37+
<li>
38+
<a href="html-css.html">
39+
<img src="img/logo-html.svg" alt="Логотип HTML">
40+
</a>
41+
</li>
42+
<li>
43+
<a href="javascript.html">
44+
<img src="img/logo-js.svg" alt="Логотип JavaScript">
45+
</a>
46+
</li>
47+
</ul>
48+
49+
</nav>
50+
</main>
51+
52+
<footer>
53+
<div class="contacts">
54+
<a class="logo-full" href="https://htmlacademy.ru">
55+
<img src="img/logo-full.svg" width="161" height="55" alt="HTML Academy" title="HTML Academy">
56+
</a>
57+
<div class="social-icons">
58+
<a class="icon icon-vk" href="https://vk.com/htmlacademy" target="_blank">
59+
Вконтакте
60+
</a>
61+
<a class="icon icon-fb" href="https://www.facebook.com/htmlacademy" target="_blank">
62+
Facebook
63+
</a>
64+
<a class="icon icon-tw" href="https://twitter.com/htmlacademy_ru" target="_blank">
65+
Twitter
66+
</a>
67+
<a class="icon icon-ig" href="https://instagram.com/htmlacademy" target="_blank">
68+
Instagram
69+
</a>
70+
</div>
71+
<div class="github">
72+
<a class="github-link" href="https://github.com/htmlacademy" target="_blank">
73+
GitHub
74+
</a>
75+
</div>
76+
</div>
77+
</footer>
78+
</body>
79+
</html>

0 commit comments

Comments
 (0)