diff --git a/source/_layouts/default.html.twig b/source/_layouts/default.html.twig
index 2419d09..54748c7 100644
--- a/source/_layouts/default.html.twig
+++ b/source/_layouts/default.html.twig
@@ -5,9 +5,10 @@
+
{% if page.title is defined %}
- {{ page.title }} - {{ page.title }}
+ {{ page.title }} - {{ site.title }}
{% else %}
{{ site.title }}
{% endif %}
@@ -15,7 +16,7 @@
</head>
<body>
<main class="content">
- {% block content %}{% endblock %}
+ {% block content %}{% endblock %}
</main>
{% include 'counters.twig' %}
</body>
diff --git a/source/about/me.html.twig b/source/about/me.html.twig
new file mode 100644
index 0000000..ad0dd29
--- /dev/null
+++ b/source/about/me.html.twig
@@ -0,0 +1,45 @@
+---
+layout: default
+title: Обо мне
+---
+
+{% block content %}
+
+ <section class="about-me">
+ <div class="about-me__content">
+
+ <div class="about-me__note" id="about-me-note">Я люблю шоколад.</div>
+
+ <ul class="about-me__links">
+ <li class="about-me__link">
+ <a href="">Узнать чуть лучше</a>
+ </li>
+ <li class="about-me__link">
+ <a href="/">На главную</a>
+ </li>
+ </ul>
+
+ </div>
+ </section>
+
+ <script type="text/javascript">
+ window.addEventListener('DOMContentLoaded', function() {
+ var notes = [
+ 'Люблю шоколад.',
+ 'Сделал этот сайт.',
+ 'Работаю программистом.',
+ 'Люблю кататься на велосипеде.',
+ 'Проехал на велосипеде 200 километров за день.',
+ 'Мой любимый фильм "Три идиота".',
+ 'Люблю читать фантастические книги.',
+ 'Предпочитаю ходить в кино на 2D-сеансы.',
+ 'Не люблю пьяных людей.',
+ 'Хотел бы побывать в горах.',
+ 'На день рождения ко мне можно прийти без подарка.',
+ ];
+ var note = notes[Math.floor(Math.random() * notes.length)];
+ document.getElementById('about-me-note').innerHTML = note;
+ });
+ </script>
+
+{% endblock %}
diff --git a/source/index.html.twig b/source/index.html.twig
index e18243b..235d3d0 100644
--- a/source/index.html.twig
+++ b/source/index.html.twig
@@ -34,6 +34,9 @@ layout: default
<li>
<a href="https://anwinged.blogspot.ru" target="_blank">заброшенный блог</a>
</li>
+ <li>
+ <a href="/about/me">немного фактов обо мне</a>
+ </li>
</ul>
<h2 class="heading">Похвалить</h2>
diff --git a/source/styles/about-me.css b/source/styles/about-me.css
new file mode 100644
index 0000000..cf827ab
--- /dev/null
+++ b/source/styles/about-me.css
@@ -0,0 +1,28 @@
+.about-me {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 100vh;
+}
+
+.about-me__note {
+ text-align: center;
+ font-size: 120%;
+ max-width: 400px;
+ min-height: 3em;
+}
+
+.about-me__links {
+ padding: 0;
+ margin-top: 4em;
+ list-style: none;
+ text-align: center;
+}
+
+.about-me__link {
+ display: inline-block;
+}
+
+.about-me__link + .about-me__link {
+ margin-left: 1em;
+}