Skip to content

Commit 6f89cef

Browse files
juwainjuwain
committed
Merge remote-tracking branch 'htmlacademy/master'
2 parents 12b72b6 + ab16fb3 commit 6f89cef

33 files changed

+148
-67
lines changed

‎Readme.md

Lines changed: 41 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,42 @@
1-
# Стиль кодирования Академии HTML
1+
# Стиль кода Академии HTML
2+
3+
[![dependency status][dependency-image]][dependency-url]
4+
[![devDependency status][devdependency-image]][devdependency-url]
25

36
_TBD_
47

8+
## Сервер для разработки
9+
10+
Для запуска лайв-сервера нужна минимум 0.12 версия [Node.js](https://nodejs.org).
11+
12+
### Установка
13+
14+
```bash
15+
$ git clone https://github.com/htmlacademy/codeguide.git
16+
$ cd codeguide
17+
$ npm i
18+
```
19+
20+
### Запуск
21+
22+
```bash
23+
$ npm start
24+
```
25+
26+
После выполнения команды, откройте в браузере `http://127.0.0.1:3000`.
27+
28+
### Тестирование
29+
30+
```bash
31+
$ npm test
32+
```
33+
34+
Для проверки скриптов используется [ESLint](http://eslint.org).
35+
36+
## Нашли ошибку?
37+
38+
Пожалуйста, [создайте тикет](https://github.com/htmlacademy/codeguide/issues).
39+
540
## Благодарности
641

742
* [Code Guide](http://codeguide.co) by @mdo
@@ -12,3 +47,8 @@ _TBD_
1247
## Лицензия
1348

1449
Лицензия MIT, смотрите файл `License.md`.
50+
51+
[dependency-image]: https://david-dm.org/htmlacademy/codeguide.svg?style=flat-square
52+
[dependency-url]: https://david-dm.org/htmlacademy/codeguide
53+
[devdependency-image]: https://david-dm.org/htmlacademy/codeguide/dev-status.svg?style=flat-square
54+
[devdependency-url]: https://david-dm.org/htmlacademy/codeguide#info=devDependencies

‎app/css/chapter.css

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,6 @@
3636
}
3737

3838
& + .chapter-part-col {
39-
background-color: var(--light-subtle-color);
4039
border-top: 1px solid var(--subtle-color);
4140

4241
@media (--viewport-large) {
@@ -52,3 +51,7 @@
5251
max-width: 32rem;
5352
}
5453
}
54+
55+
.gray-bgcolor {
56+
background-color: var(--light-subtle-color);
57+
}

‎app/css/footer.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,5 +63,5 @@ footer {
6363
width: 91px;
6464
height: 16px;
6565

66-
background-image: resolve("copyright.svg");
66+
background-image: resolve("github.svg");
6767
}

‎app/css/header.css

Lines changed: 18 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,35 @@
11
header {
2-
padding: 3rem 1rem 6rem;
2+
padding: 1rem 1rem 6rem;
33

44
text-align: center;
55

66
background-color: var(--brand-color);
7+
background-image:
8+
repeating-linear-gradient(150deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.06) 1px, transparent 0, transparent 41px),
9+
repeating-linear-gradient(-150deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.06) 1px, transparent 0, transparent 41px);
710

811
@media (--viewport-medium) {
9-
padding-top: 4rem;
10-
padding-bottom: 8rem;
12+
padding-bottom: 4rem;
1113
}
1214

1315
h1 {
14-
margin: 1rem 0 0.25rem;
16+
margin: 0 0 0.25rem;
1517

1618
color: var(--light-color);
1719
}
20+
21+
p {
22+
margin-top: 0;
23+
24+
font-size: 1.2rem;
25+
}
26+
27+
a:any-link {
28+
color: var(--light-color);
29+
}
1830
}
1931

2032
.logo {
21-
width: 100px;
22-
height: 127px;
33+
width: 300px;
34+
height: 300px;
2335
}

‎app/css/variables.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
--base-px-size: 16px;
33
--large-px-size: calc(var(--base-px-size) * 1.25);
44

5-
--brand-color: #2e3191;
5+
--brand-color: #312785;
66
--brand-color-dark: #2d2d44;
77

88
--dark-color: #5a5a5a;

‎app/files/.editorconfig

Lines changed: 0 additions & 17 deletions
This file was deleted.

‎app/img/bane.svg

Lines changed: 1 addition & 0 deletions
Loading

‎app/img/copyright.svg renamed to ‎app/img/github.svg

File renamed without changes.

‎app/img/og.png

50.6 KB
Loading

‎app/templates/index.hbs

Lines changed: 41 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,54 @@
22
<html lang="ru">
33
<head>
44
<meta charset="utf-8">
5-
<title>Стиль кодирования Академии HTML</title>
5+
<title>Стиль кода Академии HTML</title>
66
<link rel="stylesheet" href="{{resolve 'style.css'}}">
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+
<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>
715
</head>
816
<body>
917

1018
<main>
1119
{{~> header ~}}
1220

21+
<section class="chapter">
22+
<h2>Оглавление</h2>
23+
<article class="chapter-part">
24+
<div class="chapter-part-col">
25+
<h4>HTML</h4>
26+
<ul>
27+
<li><a href="#html-syntax">Синтаксис</a></li>
28+
<li><a href="#html-validator">Валидность</a></li>
29+
<li><a href="#html-doctype">HTML-доктайп</a></li>
30+
<li><a href="#html-encoding">Кодировка символов</a></li>
31+
<li><a href="#html-style-includes">Подключение стилей</a></li>
32+
<li><a href="#html-js-includes">Подключение скриптов</a></li>
33+
<li><a href="#html-attribute-order">Порядок атрибутов</a></li>
34+
<li><a href="#html-boolean">Логические атрибуты</a></li>
35+
<li><a href="#html-form-labels">Подписи полей ввода</a></li>
36+
<li><a href="#html-img-sizes">Размеры картинок</a></li>
37+
<li><a href="#html-language">Атрибут языка</a></li>
38+
</ul>
39+
</div>
40+
<div class="chapter-part-col">
41+
<h4>CSS</h4>
42+
<ul>
43+
<li><a href="#css-syntax">Синтаксис</a></li>
44+
<li><a href="#css-order">Порядок свойств</a></li>
45+
<li><a href="#css-class-names">Имена классов</a></li>
46+
<li><a href="#css-import">Правило @import</a></li>
47+
<li><a href="#css-font-variant">Варианты шрифта</a></li>
48+
</ul>
49+
</div>
50+
</article>
51+
</section>
52+
1353
<section class="chapter">
1454
<h2>HTML</h2>
1555
{{~> html/html-rules ~}}

‎app/templates/partials/css/css-rules.hbs

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div class="chapter-part-col">
33
{{~> css/rules/css-syntax ~}}
44
</div>
5-
<div class="chapter-part-col">
5+
<div class="chapter-part-col gray-bgcolor">
66
<figure>
77
<pre><code class="language-css">
88
{{~> css/examples/css-syntax-example ~}}
@@ -15,7 +15,7 @@
1515
<div class="chapter-part-col">
1616
{{~> css/rules/css-order ~}}
1717
</div>
18-
<div class="chapter-part-col">
18+
<div class="chapter-part-col gray-bgcolor">
1919
<figure>
2020
<pre><code class="language-css">
2121
{{~> css/examples/css-order-example ~}}
@@ -28,7 +28,7 @@
2828
<div class="chapter-part-col">
2929
{{~> css/rules/css-class-names ~}}
3030
</div>
31-
<div class="chapter-part-col">
31+
<div class="chapter-part-col gray-bgcolor">
3232
<figure>
3333
<pre><code class="language-css">
3434
{{~> css/examples/css-class-names-example ~}}
@@ -41,7 +41,7 @@
4141
<div class="chapter-part-col">
4242
{{~> css/rules/css-import ~}}
4343
</div>
44-
<div class="chapter-part-col">
44+
<div class="chapter-part-col gray-bgcolor">
4545
<figure>
4646
<pre><code class="language-markup">
4747
{{~> css/examples/css-import-example ~}}
@@ -54,7 +54,7 @@
5454
<div class="chapter-part-col">
5555
{{~> css/rules/css-font-variant ~}}
5656
</div>
57-
<div class="chapter-part-col">
57+
<div class="chapter-part-col gray-bgcolor">
5858
<figure>
5959
<pre><code class="language-css">
6060
{{~> css/examples/css-font-variant-example ~}}

‎app/templates/partials/css/rules/css-class-names.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<h4>Имена классов</h4>
1+
<h4 id="css-class-names">Имена классов</h4>
22
<ul>
33
<li>Имена классов пишутся строчными буквами, используется дефис (но&nbsp;не&nbsp;знаки нижнего подчёркивания или camelCase). Дефисы служат разделителями во&nbsp;взаимосвязанных классах (например, <code>.button</code> и <code>.button-danger</code>).</li>
44
<li>Имена классов должны быть такими, чтобы по&nbsp;ним можно было быстро понять какому элементу страницы задан класс: избегайте сокращений (единственное исключение&nbsp;&mdash; <code>.btn</code> для кнопок), но&nbsp;не&nbsp;делайте их&nbsp;слишком длинными (более трёх слов).</li>

‎app/templates/partials/css/rules/css-font-variant.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<h4>Варианты шрифта</h4>
1+
<h4 id="css-font-variant">Варианты шрифта</h4>
22
<p>
33
Альтернативные варианты шрифта и&nbsp;тип семейства указываются в&nbsp;конце перечисления <code>font-family</code>.
44
</p>

‎app/templates/partials/css/rules/css-import.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<h4>Правило <code>@import</code></h4>
1+
<h4 id="css-import">Правило <code>@import</code></h4>
22
<p>
33
Правило <code>@import</code> работает медленнее, чем тег <code>&lt;link&gt;</code>. В&nbsp;стилях <code>@import</code> не&nbsp;должен использоваться.
44
</p>

‎app/templates/partials/css/rules/css-order.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<h4>Порядок свойств</h4>
1+
<h4 id="css-order">Порядок свойств</h4>
22
<p>
33
Объявления логически связанных свойств группируются в&nbsp;следующем порядке:
44
</p>

‎app/templates/partials/css/rules/css-syntax.hbs

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
<h4>Синтаксис</h4>
1+
<h4 id="css-syntax">Синтаксис</h4>
22
<ul>
33
<li>После значения свойства обязательно ставится точка с&nbsp;запятой.</li>
4-
<li>Для отступов внутри правил используются два пробела. Для правильного форматирования используйте файл <a href="https://github.com/htmlacademy/codeguide/blob/master/app/files/.editorconfig" target="_blank">.editorconfig</a> в&nbsp;вашем редакторе.</li>
4+
<li>Для отступов внутри правил используются два пробела. Для правильного форматирования используйте файл <a href="https://github.com/htmlacademy/codeguide/blob/master/.editorconfig" target="_blank">.editorconfig</a> в&nbsp;вашем редакторе.</li>
55
<li>Шестнадцатеричное значение цвета не&nbsp;сокращается, а&nbsp;пишется полностью из&nbsp;всех шести символов. Для записи используются строчные буквы. Например, <code>#f5f5f5</code>.</li>
66
<li>Названия тегов и&nbsp;свойств в&nbsp;правилах пишутся строчными буквами.</li>
77
<li>Начальный ноль для значений не&nbsp;сокращается (например, <code>.5</code> вместо <code>0.5</code>).</li>
@@ -17,5 +17,5 @@
1717
</code></pre></li>
1818
<li>Закрывающая фигурная скобка пишется на&nbsp;новой строке и&nbsp;без отступа. Следующее после этого правило отделяется пустой строкой.</li>
1919
<li>Единицы измерения не&nbsp;пишутся, там где в&nbsp;них нет необходимости. Например, <code>border:&nbsp;0</code>.</li>
20-
<li>Для автоматического применения этих правил используйте файл конфигурации <a href="https://github.com/htmlacademy/codeguide/blob/master/app/files/csscomb.json" target="_blank">csscomb.json</a> для настройки <a href="http://csscomb.com" target="_blank">CSSComb</a>.</li>
20+
<li>Для автоматического применения этих правил используйте файл конфигурации <a href="https://github.com/htmlacademy/codeguide/blob/master/csscomb.json" target="_blank">csscomb.json</a> для настройки <a href="http://csscomb.com" target="_blank">CSSComb</a>.</li>
2121
</ul>

‎app/templates/partials/css/rules/css-vertical-align.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<h4>Указание <code>vertical-align</code></h4>
1+
<h4 id="css-vertical-align">Указание <code>vertical-align</code></h4>
22
<p>
33
Значение <code>vertical-align</code> должно быть <i>явно</i> указано для блоков с <code>display: inline-block</code>.
44
</p>

‎app/templates/partials/footer.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<footer>
22
<div class="contacts">
33
<a class="logo-full" href="https://htmlacademy.ru">
4-
<img src="{{resolve 'logo-full.svg'}}" width="161" height="55" alt="HTML Academy">
4+
<img src="{{resolve 'logo-full.svg'}}" width="161" height="55" alt="HTML Academy" title="HTML Academy">
55
</a>
66
<div class="social-icons">
77
<a class="icon icon-vk" href="https://vk.com/htmlacademy" target="_blank">

‎app/templates/partials/header.hbs

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<header>
22
<a href="https://htmlacademy.ru" target="_blank">
3-
<img class="logo" src="{{resolve 'logo.svg'}}" width="100" height="127" alt="HTML Academy">
3+
<img class="logo" src="{{resolve 'bane.svg'}}" width="300" height="300" alt="HTML Academy" title="HTML Academy">
44
</a>
5-
<h1>Стиль кодирования Академии HTML</h1>
5+
<h1>Стиль кода Академии HTML</h1>
6+
<p><a href="https://github.com/htmlacademy/codeguide">github.com/htmlacademy/codeguide</a></p>
67
</header>

0 commit comments

Comments
 (0)