diff --git a/.gitignore b/.gitignore
index d3d5b96..15e9da4 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,31 +1,3 @@
-# Numerous always-ignore extensions
-*.diff
-*.err
-*.orig
-*.log
-*.rej
-*.swo
-*.swp
-*.vi
-*~
-*.sass-cache
-
-# OS or Editor folders
-.DS_Store
-.cache
-.project
-.settings
-.tmproj
-nbproject
-Thumbs.db
-
-# NPM packages folder.
-node_modules/
-
-# Brunch folder for temporary files.
-tmp/
-
-# Bower stuff.
-bower_components/
-
-public
+_site
+.sass-cache
+Gemfile.lock
\ No newline at end of file
diff --git a/CNAME b/CNAME
new file mode 100644
index 0000000..cf7dcfe
--- /dev/null
+++ b/CNAME
@@ -0,0 +1 @@
+codehipsters.com
\ No newline at end of file
diff --git a/Gemfile b/Gemfile
new file mode 100644
index 0000000..3a1ebf3
--- /dev/null
+++ b/Gemfile
@@ -0,0 +1,2 @@
+source 'https://rubygems.org'
+gem 'github-pages'
\ No newline at end of file
diff --git a/README.md b/README.md
index b434fb8..e69de29 100644
--- a/README.md
+++ b/README.md
@@ -1,40 +0,0 @@
-Code Hipsters website
----------------------
-This repo contains the source code of [codehipsters.com](http://codehipsters.com) website.
-The website is intended to be a collection of resources related to the Code Hipsters team.
-
-### Who are they?
-**Code Hipsters** (or CH) — is a non-profit IT-community with a mission to spread knowledge about brand cutting-edge trends in
-open-source tools, modern *front/back/devops* development, art and design. The community was originally founded back in **2014** in
-Rostov-on-Don and currently consists of:
-
- * [Eugeny Pshenichniy](https://github.com/ujenjt)
- * [Victor Suzdalev](https://github.com/kadmil)
- * [Alexey Taktarov](https://github.com/molefrog)
- * [Tikhon Belousko](https://github.com/dazzz)
-
-Although these are the people who were there from the very beginning, but the whole project wouldn't be possible without
-help of [Benjamin Tambourine](https://github.com/vtambourine), [Sam Kozin](https://github.com/skozin) and others.
-
-### Some thoughts on code-style
-Please, remove trailing spaces in files, use 2-space indent and prefer removing code instead of commenting it.
-Use comments to outline things that are not obvious, put links to Stack Overflow or other resources if you
-found an interesting bug.
-
-We use [BEM](http://getbem.com/) methodology in our styles. The JavaScript codebase is written according to [Standard](http://standardjs.com/) code style. Please, install linter in your text editor and avoid commiting code with warnings.
-
-### How to build and deploy the website
-The website uses Brunch plus a few of custom scripts for compiling static templates. In order to start development
-server run `npm run start`.
-
-The deployment process is dumb and simple, but it works ok for this kind of the website. When you're ready to deploy first build templates with `npm run build`, commit built files (this step is messy, but
-this is the only way to deploy to `gh-pages`) and finally run `npm run deploy`. The deployment is possible by [this tool](https://www.npmjs.com/package/gh-pages-deploy) so there is no need to always keep two equal branches.
-
-### License
-Copyright 2017, Code Hipsters
-
-Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
diff --git a/_config.yml b/_config.yml
new file mode 100644
index 0000000..f217798
--- /dev/null
+++ b/_config.yml
@@ -0,0 +1,12 @@
+# Site settings
+title: Code Hipsters
+email:
+description: >
+ Code Hipsters — это квинтэссенция людей и технологий, призванная разрушать стереотипы.
+baseurl: "" # the subpath of your site, e.g. /blog/
+url: "http://codehipsters.com" # the base hostname & protocol for your site
+twitter_username:
+github_username: codehipsters
+
+# Build settings
+markdown: kramdown
diff --git a/_includes/footer.html b/_includes/footer.html
new file mode 100644
index 0000000..849ba6c
--- /dev/null
+++ b/_includes/footer.html
@@ -0,0 +1,23 @@
+
diff --git a/_includes/head.html b/_includes/head.html
new file mode 100644
index 0000000..7aa7537
--- /dev/null
+++ b/_includes/head.html
@@ -0,0 +1,24 @@
+
diff --git a/posts/2014-11-27-sitnik-interview/post.md b/_posts/2014-11-27-sitnik-interview.md
similarity index 97%
rename from posts/2014-11-27-sitnik-interview/post.md
rename to _posts/2014-11-27-sitnik-interview.md
index 9635fed..97d5572 100755
--- a/posts/2014-11-27-sitnik-interview/post.md
+++ b/_posts/2014-11-27-sitnik-interview.md
@@ -1,3 +1,11 @@
+---
+layout: post
+title: "Андрей Ситник: «Будущее за CSS постпроцессорами!»"
+author: Витя Суздалев
+description: Редакция Code Hipsters поговорила с фронтендером Evil Martians и автором PostCSS Андреем Ситником о пост-процессинге CSS и трендах фронтент-разработки.
+localized_date: 27 ноября 2014
+share_image: /images/sitnik-header.jpg
+---
Всем привет! Редакция [Code Hipsters](https://vk.com/codehipsters) поговорила с фронтендером [Evil Martians](https://evilmartians.com/) и автором [PostCSS](https://github.com/postCSS/postCSS) [Андреем Ситником](http://sitnik.ru/) о пре- и пост-процессинге CSS, трендах фронтент-разработки и планах на будущее.
**Code Hipsters:** Добрый день, Андрей! Если коротко, то зачем пересобирать CSS-ки? Все же давно и надолго радуются Sass и Less.
@@ -5,7 +13,7 @@
**Андрей Ситник:** Кому нужна пост-обработка — формально всем фронтенд-разработчикам. PostCSS служит как замена Sass, LESS, Stylus. Кроме этого он нужен для линтеров, минификаторов, плагинов для редакторов. В общем, если тебе нужно как-то изменить CSS, то проще всего это сделать через PostCSS, так как он даст тебе карты кода, API, и парсер. Теперь вопрос, чем лучше Sass и т.д. Собственно, первую идею постпроцессора предложил TJ и сделал свой Rework, вот [тут он пишет зачем](http://tjholowaychuk.tumblr.com/post/44267035203/modu). Если вкратце: препроцессоры сложные и медленные и дают мало функций. Теперь подробнее. Сложные, потому что они монолитные. Есть только один тип переменных, встроенный в язык. Есть парсер особого языка программирования прямо в CSS,
всё это усложняет разработку препроцессоров. Очень мало кто коммитил в Sass, потому что это трудно. PostCSS — это просто парсер и стрингифаер. Все функции (переменные, примеси, префиксы) — это подключаемые JS-модули. Много кто разрабатывает такие плагины, потому что это очень просто.
-
+
Во-вторых, PostCSS не имет какого-то языка программирования внутри CSS. Вся магия (например, разворачивание префиксов) написана в JS-коде. В плагине Автопрефиксер нет `@if`, `@for` и т.п. Можно написать плагин, который будет это добавлять, но тьюринг-полного языка конструкций нет и вряд ли будет, так как проще написать узкозаточенный под бизнес-логику плагин на JS, чем писать вычисления «на Sass». Одна из реализаций переменных [предложена здесь](https://github.com/postCSS/postCSS-custom-properties) (это на самом деле полифил к новой спеке CSS-переменных).
@@ -50,7 +58,7 @@
**Code Hipsters:** Понял.
-
+
**Андрей Ситник:** Третий плюс про мощность. Проблема Sass в том, что всю магию можно сделать только на примесях, переменных или функциях. Единственный способ сделать префиксы — добавить свою библиотеку примесей. Но что если я не хочу помнить о том, где нужно использовать примесь, а где нет? У Автопрефиксера очень крутой UI — ты просто забываешь о префиксах, такого UI нельзя сделать в препроцессорах. То же самое с полифилами — хочется, чтобы они просто «магически» работали.
@@ -76,7 +84,7 @@
**Code Hipsters:** То есть на него сильно сложные задачи ложатся? Но он же простой?
-
+
**Андрей Ситник:** В проекте CSS кода может быть больше чем всего остального, когда его очень много, он не поддерживаемый. Поэтому мы меняем простоту на сокращение размера и увеличение поддерживаемости.
@@ -185,7 +193,7 @@ Webpack тут лучше Sprockets, так как в Sprockets дерево з
Есть ли какая-то фронтенд-технология, которая тебя занимает больше остальных, если не говорить про PostCSS, конечно? Как тебе кажется, что из всего зоопарка будет мейнстримом через какое-то время?
-
+
**Андрей Ситник:** Меня интересует три вещи:
diff --git a/posts/2015-01-14-indutny-interview/post.md b/_posts/2015-01-14-indutny-interview.md
similarity index 94%
rename from posts/2015-01-14-indutny-interview/post.md
rename to _posts/2015-01-14-indutny-interview.md
index 6d7f72c..19abf93 100644
--- a/posts/2015-01-14-indutny-interview/post.md
+++ b/_posts/2015-01-14-indutny-interview.md
@@ -1,7 +1,14 @@
-
+---
+layout: post
+title: "Фёдор Индутный, io.js и столовые приборы"
+author: Витя Суздалев
+description: Code Hipsters связались с Фёдором Индутным и распросили его про io.js.
+localized_date: 14 января 2015
+share_image: /images/indutny-header.png
+---
[Code Hipsters](https://vk.com/codehipsters) связались с [Фёдором Индутным](https://blog.indutny.com/) из Яндекса и распросили его про [io.js](https://iojs.org/), поднявшего столько шума в конце прошлого года.
-
+
**Code Hipsters:** Добрый день, Фёдор! Об [io.js](https://iojs.org/), наверное, все очевидные вопросы уже задали; можете объяснить для тех, кто все еще не понял, что на самом деле произошло?
@@ -19,7 +26,7 @@
**Code Hipsters:** Является ли io.js восстанием против тирании Joyent, и есть ли эта тирания?
-
+
**Фёдор Индутный:** Я достаточно далек от «политики» и стараюсь не участвовать в дискуссиях об отношении Joyent к проекту.
@@ -35,7 +42,7 @@
**Фёдор Индутный:** В Яндексе я занимаюсь разработкой различных инструментов-помощников для других программистов. io.js занимает огромное количество времени. К моей большой радости, руководство к этому относится очень положительно и отзывчиво.
-
+
**Code Hipsters:** Какие серверные JavaScript технологии и подходы, по вашему мнению, будут в тренде в 2015? С чем надо разбираться как можно скорее, чтобы не отстать?
@@ -69,7 +76,7 @@
**Фёдор Индутный:** Кофе варить можно будет разве что в прямом смысле. Планов перехода на CoffeeScript нет.
-
+
**Code Hipsters:** Под «варить кофе» я имел в виду настоящий кофе.
diff --git a/_sass/_base.scss b/_sass/_base.scss
new file mode 100644
index 0000000..ce6aa0c
--- /dev/null
+++ b/_sass/_base.scss
@@ -0,0 +1,209 @@
+/**
+ * Reset some basic elements
+ */
+body, h1, h2, h3, h4, h5, h6,
+p, blockquote, pre, hr,
+dl, dd, ol, ul, figure {
+ margin: 0;
+ padding: 0;
+}
+
+a {
+ color: #ee6e83;
+}
+
+
+/**
+ * Basic styling
+ */
+body {
+ font-family: $base-font-family;
+ font-size: $base-font-size;
+ line-height: $base-line-height;
+ font-weight: 300;
+ color: $text-color;
+ background-color: $background-color;
+ -webkit-text-size-adjust: 100%;
+}
+
+
+
+/**
+ * Set `margin-bottom` to maintain vertical rhythm
+ */
+h1, h2, h3, h4, h5, h6,
+p, blockquote, pre,
+ul, ol, dl, figure,
+%vertical-rhythm {
+ margin-bottom: $spacing-unit / 2;
+}
+
+
+
+/**
+ * Images
+ */
+img {
+ max-width: 100%;
+ vertical-align: middle;
+}
+
+
+
+/**
+ * Figures
+ */
+figure > img {
+ display: block;
+}
+
+figcaption {
+ font-size: $small-font-size;
+}
+
+
+
+/**
+ * Lists
+ */
+ul, ol {
+ margin-left: $spacing-unit;
+}
+
+li {
+ > ul,
+ > ol {
+ margin-bottom: 0;
+ }
+}
+
+
+
+/**
+ * Headings
+ */
+h1, h2, h3, h4, h5, h6 {
+ font-weight: 500;
+ font-family: 'Fira Sans', sans-serif;
+ letter-spacing: 1px;
+}
+
+
+
+/**
+ * Links
+ */
+a {
+ color: #ee6e83;
+ text-decoration: none;
+
+ &:visited {
+ color: #ee6e83;
+ }
+
+ &:hover {
+ color: $text-color;
+ text-decoration: underline;
+ }
+}
+
+
+
+/**
+ * Blockquotes
+ */
+blockquote {
+ color: $grey-color;
+ border-left: 4px solid $grey-color-light;
+ padding-left: $spacing-unit / 2;
+ font-size: 18px;
+ letter-spacing: -1px;
+ font-style: italic;
+
+ > :last-child {
+ margin-bottom: 0;
+ }
+}
+
+
+
+/**
+ * Code formatting
+ */
+pre,
+code {
+ font-size: 15px;
+ border: 1px solid $grey-color-light;
+ border-radius: 3px;
+ background-color: #eef;
+}
+
+code {
+ padding: 1px 5px;
+}
+
+pre {
+ padding: 8px 12px;
+ overflow-x: scroll;
+
+ > code {
+ border: 0;
+ padding-right: 0;
+ padding-left: 0;
+ }
+}
+
+
+
+/**
+ * Wrapper
+ */
+.wrapper {
+ max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit} * 2));
+ max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));
+ margin-right: auto;
+ margin-left: auto;
+ padding-right: $spacing-unit;
+ padding-left: $spacing-unit;
+ @extend %clearfix;
+
+ @include media-query($on-laptop) {
+ max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit}));
+ max-width: calc(#{$content-width} - (#{$spacing-unit}));
+ padding-right: $spacing-unit / 2;
+ padding-left: $spacing-unit / 2;
+ }
+}
+
+
+
+/**
+ * Clearfix
+ */
+%clearfix {
+
+ &:after {
+ content: "";
+ display: table;
+ clear: both;
+ }
+}
+
+
+
+/**
+ * Icons
+ */
+.icon {
+
+ > svg {
+ display: inline-block;
+ width: 16px;
+ height: 16px;
+ vertical-align: middle;
+
+ path {
+ fill: $grey-color;
+ }
+ }
+}
diff --git a/_sass/_fonts.scss b/_sass/_fonts.scss
new file mode 100644
index 0000000..d87a472
--- /dev/null
+++ b/_sass/_fonts.scss
@@ -0,0 +1,10 @@
+@font-face {
+ font-family: 'fontello';
+ src: url('fonts/icons/fontello.eot?20439182');
+ src: url('fonts/icons/fontello.eot?20439182#iefix') format('embedded-opentype'),
+ url('fonts/icons/fontello.woff?20439182') format('woff'),
+ url('fonts/icons/fontello.ttf?20439182') format('truetype'),
+ url('fonts/icons/fontello.svg?20439182#fontello') format('svg');
+ font-weight: normal;
+ font-style: normal;
+}
\ No newline at end of file
diff --git a/_sass/_layout.scss b/_sass/_layout.scss
new file mode 100644
index 0000000..7947b55
--- /dev/null
+++ b/_sass/_layout.scss
@@ -0,0 +1,345 @@
+/**
+ * Main page header
+ */
+.main-page-header {
+ width: 100%;
+ // background: white;
+ // border-bottom: 1px solid #FF4254;
+ position: relative;
+}
+
+/**
+ * Site header
+ */
+.site-header {
+ min-height: 65px;
+ background: #FF4254;
+ // Positioning context for the mobile navigation icon
+ position: relative;
+
+ .header-wrapper {
+ max-width: 1200px;
+ padding: 0 20px;
+ margin: 0 auto;
+ }
+
+}
+
+.site-logo {
+ width: 48px;
+ height: 60px;
+ background: url(images/ch-logo.png);
+ background-size: cover;
+ background-repeat: no-repeat;
+ position: absolute;
+ bottom: -22px;
+ left: 0px;
+}
+
+.site-logo-text {
+ width: 260px;
+ height: 18px;
+ background: url(images/ch-logo-text.png);
+ background-size: contain;
+ background-repeat: no-repeat;
+ background-position: 60px 0px;
+ position: absolute;
+ bottom: 22px;
+ left: 50px;
+
+ @include media-query($on-palm) {
+ left: 50%;
+ margin-left: (-260px / 2);
+ }
+}
+
+.site-title {
+ font-size: 26px;
+ line-height: 56px;
+ letter-spacing: -1px;
+ margin-bottom: 0;
+ text-transform: uppercase;
+ &,
+ &:visited {
+ color: white;
+ }
+}
+
+.site-nav {
+ float: right;
+ line-height: 56px;
+
+ .menu-icon {
+ display: none;
+ }
+
+ .page-link {
+ color: $text-color;
+ line-height: $base-line-height;
+
+ // Gaps between nav items, but not on the first one
+ &:not(:first-child) {
+ margin-left: 20px;
+ }
+ }
+
+ @include media-query($on-palm) {
+ position: absolute;
+ top: 9px;
+ right: 30px;
+ background-color: $background-color;
+ border: 1px solid $grey-color-light;
+ border-radius: 5px;
+ text-align: right;
+
+ .menu-icon {
+ display: block;
+ float: right;
+ width: 36px;
+ height: 26px;
+ line-height: 0;
+ padding-top: 10px;
+ text-align: center;
+
+ > svg {
+ width: 18px;
+ height: 15px;
+
+ path {
+ fill: $grey-color-dark;
+ }
+ }
+ }
+
+ .trigger {
+ clear: both;
+ display: none;
+ }
+
+ &:hover .trigger {
+ display: block;
+ padding-bottom: 5px;
+ }
+
+ .page-link {
+ display: block;
+ padding: 5px 10px;
+ }
+ }
+}
+
+
+
+/**
+ * Site footer
+ */
+.site-footer {
+ font-family: 'Fira Sans';
+ padding: 20px 0 0 0;
+ text-align: center;
+ background: #333540;
+ width: 100%;
+ box-sizing: border-box;
+
+ .who-we-are {
+ width: 50%;
+ opacity: 0.8;
+ float: left;
+
+ @include media-query($on-palm) {
+ width: 100%;
+ }
+
+ .logo {
+ $logo-width: 200px;
+ width: $logo-width;
+ height: ($logo-width / 4.25);
+ background: url(images/ch-footer-logo.png);
+ background-size: contain;
+ }
+
+ .text {
+ margin-top: 10px;
+ text-align: left;
+ font-family: 'Fira Sans';
+ font-size: 12px;
+ font-weight: 300;
+ color: #FFF;
+ max-width: 300px;
+ }
+ }
+
+ .socials {
+ float: left;
+ width: 50%;
+
+ @include media-query($on-palm) {
+ width: 100%;
+ margin-top: 30px;
+ }
+
+ .network {
+ display: block;
+ padding-left: 40px;
+ margin-top: 10px;
+ text-align: left;
+ font-size: 12px;
+ font-weight: 300;
+ color: #FFF;
+ position: relative;
+ margin-top: 20px;
+ cursor: pointer;
+
+ &:before {
+ content: 'v';
+ display: block;
+ font-family: 'fontello';
+ font-size: 16px;
+ -webkit-font-smoothing: anitaliased;
+ position: absolute;
+ left: 0px;
+ top: -8px;
+ width: 30px;
+ height: 30px;
+ border-radius: 30px;
+ line-height: 30px;
+ background: #FF4254;
+ text-align: center;
+ color: #333540;
+ opacity: 0.8;
+ }
+
+ &:hover:before {
+ opacity: 1;
+ }
+
+ &.vk:before {
+ content: 'v';
+ }
+
+ &.github:before {
+ content: 'g';
+ }
+
+ &.twitter:before {
+ content: 't'
+ }
+ }
+ }
+
+ .clearfix {
+ clear: both;
+ }
+
+ .copyright {
+ clear: both;
+ width: 100%;
+ margin-top: 50px;
+ font-size: 12px;
+ color: rgba(255,255,255, 0.6);
+ padding: 5px 0;
+ }
+}
+
+
+/**
+ * Page content
+ */
+.page-content {
+ padding: $spacing-unit 0;
+ overflow: hidden;
+}
+
+.page-heading {
+ font-size: 20px;
+}
+
+.post-list {
+ margin-left: 0;
+ list-style: none;
+
+ > li {
+ margin-bottom: $spacing-unit;
+ text-align: center;
+ }
+}
+
+.post-meta {
+ font-size: $small-font-size;
+ color: $grey-color;
+ font-family: 'Lora';
+}
+
+.post-link {
+ display: block;
+ font-size: 24px;
+ padding: 2px 15px;
+ &:hover {
+ color: white;
+ background-color: #ee6e83;
+ text-decoration: none;
+ }
+}
+
+
+
+/**
+ * Posts
+ */
+.post-header {
+ margin-bottom: $spacing-unit;
+}
+
+.post-title {
+ font-size: 42px;
+ letter-spacing: -1px;
+ line-height: 1;
+
+ @include media-query($on-laptop) {
+ font-size: 36px;
+ }
+
+ @include media-query($on-palm) {
+ font-size: 30px;
+ }
+}
+
+.post-author {
+ margin-bottom: $spacing-unit;
+ font-family: 'Tinos', serif;
+ font-size: 18px;
+ font-style: italic;
+ font-weight: 400;
+ color: #777777;
+}
+
+.post-content {
+ margin-bottom: $spacing-unit;
+ font-family: 'Lora', serif;
+ font-size: 18px;
+
+ h2 {
+ font-size: 32px;
+
+ @include media-query($on-laptop) {
+ font-size: 28px;
+ }
+ }
+
+ h3 {
+ font-size: 26px;
+
+ @include media-query($on-laptop) {
+ font-size: 22px;
+ }
+ }
+
+ h4 {
+ font-size: 20px;
+
+ @include media-query($on-laptop) {
+ font-size: 18px;
+ }
+ }
+}
+
diff --git a/_sass/_syntax-highlighting.scss b/_sass/_syntax-highlighting.scss
new file mode 100644
index 0000000..e36627d
--- /dev/null
+++ b/_sass/_syntax-highlighting.scss
@@ -0,0 +1,67 @@
+/**
+ * Syntax highlighting styles
+ */
+.highlight {
+ background: #fff;
+ @extend %vertical-rhythm;
+
+ .c { color: #998; font-style: italic } // Comment
+ .err { color: #a61717; background-color: #e3d2d2 } // Error
+ .k { font-weight: bold } // Keyword
+ .o { font-weight: bold } // Operator
+ .cm { color: #998; font-style: italic } // Comment.Multiline
+ .cp { color: #999; font-weight: bold } // Comment.Preproc
+ .c1 { color: #998; font-style: italic } // Comment.Single
+ .cs { color: #999; font-weight: bold; font-style: italic } // Comment.Special
+ .gd { color: #000; background-color: #fdd } // Generic.Deleted
+ .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific
+ .ge { font-style: italic } // Generic.Emph
+ .gr { color: #a00 } // Generic.Error
+ .gh { color: #999 } // Generic.Heading
+ .gi { color: #000; background-color: #dfd } // Generic.Inserted
+ .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific
+ .go { color: #888 } // Generic.Output
+ .gp { color: #555 } // Generic.Prompt
+ .gs { font-weight: bold } // Generic.Strong
+ .gu { color: #aaa } // Generic.Subheading
+ .gt { color: #a00 } // Generic.Traceback
+ .kc { font-weight: bold } // Keyword.Constant
+ .kd { font-weight: bold } // Keyword.Declaration
+ .kp { font-weight: bold } // Keyword.Pseudo
+ .kr { font-weight: bold } // Keyword.Reserved
+ .kt { color: #458; font-weight: bold } // Keyword.Type
+ .m { color: #099 } // Literal.Number
+ .s { color: #d14 } // Literal.String
+ .na { color: #008080 } // Name.Attribute
+ .nb { color: #0086B3 } // Name.Builtin
+ .nc { color: #458; font-weight: bold } // Name.Class
+ .no { color: #008080 } // Name.Constant
+ .ni { color: #800080 } // Name.Entity
+ .ne { color: #900; font-weight: bold } // Name.Exception
+ .nf { color: #900; font-weight: bold } // Name.Function
+ .nn { color: #555 } // Name.Namespace
+ .nt { color: #000080 } // Name.Tag
+ .nv { color: #008080 } // Name.Variable
+ .ow { font-weight: bold } // Operator.Word
+ .w { color: #bbb } // Text.Whitespace
+ .mf { color: #099 } // Literal.Number.Float
+ .mh { color: #099 } // Literal.Number.Hex
+ .mi { color: #099 } // Literal.Number.Integer
+ .mo { color: #099 } // Literal.Number.Oct
+ .sb { color: #d14 } // Literal.String.Backtick
+ .sc { color: #d14 } // Literal.String.Char
+ .sd { color: #d14 } // Literal.String.Doc
+ .s2 { color: #d14 } // Literal.String.Double
+ .se { color: #d14 } // Literal.String.Escape
+ .sh { color: #d14 } // Literal.String.Heredoc
+ .si { color: #d14 } // Literal.String.Interpol
+ .sx { color: #d14 } // Literal.String.Other
+ .sr { color: #009926 } // Literal.String.Regex
+ .s1 { color: #d14 } // Literal.String.Single
+ .ss { color: #990073 } // Literal.String.Symbol
+ .bp { color: #999 } // Name.Builtin.Pseudo
+ .vc { color: #008080 } // Name.Variable.Class
+ .vg { color: #008080 } // Name.Variable.Global
+ .vi { color: #008080 } // Name.Variable.Instance
+ .il { color: #099 } // Literal.Number.Integer.Long
+}
diff --git a/app/assets/2014/11/27/sitnik-interview.html b/app/assets/2014/11/27/sitnik-interview.html
deleted file mode 100644
index f9229b6..0000000
--- a/app/assets/2014/11/27/sitnik-interview.html
+++ /dev/null
@@ -1,13 +0,0 @@
-
-
-
-
-
-
- Page Moved - Code Hipsters
-
-
-
-
diff --git a/app/assets/2015/01/14/indutny-interview.html b/app/assets/2015/01/14/indutny-interview.html
deleted file mode 100644
index 6daf4d7..0000000
--- a/app/assets/2015/01/14/indutny-interview.html
+++ /dev/null
@@ -1,13 +0,0 @@
-
-
-
-
-
-
- Page Moved - Code Hipsters
-
-
-
-
diff --git a/app/assets/CNAME b/app/assets/CNAME
deleted file mode 100644
index 1c2d66f..0000000
--- a/app/assets/CNAME
+++ /dev/null
@@ -1 +0,0 @@
-codehipsters.com
diff --git a/app/assets/images/birth-venus.jpg b/app/assets/images/birth-venus.jpg
deleted file mode 100644
index 821a246..0000000
Binary files a/app/assets/images/birth-venus.jpg and /dev/null differ
diff --git a/app/assets/images/ch-horiz-white.svg b/app/assets/images/ch-horiz-white.svg
deleted file mode 100644
index 687ef7c..0000000
--- a/app/assets/images/ch-horiz-white.svg
+++ /dev/null
@@ -1,32 +0,0 @@
-
-
\ No newline at end of file
diff --git a/app/assets/images/favicon-16.png b/app/assets/images/favicon-16.png
deleted file mode 100644
index ea7d65a..0000000
Binary files a/app/assets/images/favicon-16.png and /dev/null differ
diff --git a/app/assets/images/favicon-32.png b/app/assets/images/favicon-32.png
deleted file mode 100644
index 8e025d6..0000000
Binary files a/app/assets/images/favicon-32.png and /dev/null differ
diff --git a/app/assets/images/poisson.png b/app/assets/images/poisson.png
deleted file mode 100644
index 6ed4988..0000000
Binary files a/app/assets/images/poisson.png and /dev/null differ
diff --git a/app/assets/images/rails-club-sticker.png b/app/assets/images/rails-club-sticker.png
deleted file mode 100644
index d4dd9d0..0000000
Binary files a/app/assets/images/rails-club-sticker.png and /dev/null differ
diff --git a/app/components/banner.js b/app/components/banner.js
deleted file mode 100644
index fcd83b0..0000000
--- a/app/components/banner.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import Velocity from 'velocity-animate'
-const { Image } = window
-
-import Slogatto from './slogatto'
-
-// Waits until the image is loaded
-const loadImage = (src, done) => {
- const image = new Image()
- image.addEventListener('load', done)
- image.src = src
-}
-
-const SLOGANS = [
- 'Постмодерн умер, а веб — еще нет',
- 'Подливаем смузи в ваш Virtual DOM с 2014',
- 'Табы или пробелы? Главное, чтобы ты хорошо учился!',
- 'Code Ergo Sum',
- 'Кладем усталость от джаваскрипта на лопатки и щекочем'
-]
-
-class Banner {
- constructor (el, options = {}) {
- this.el = el
-
- this.images = options.images || []
- this.imageIdx = 0
- this.changeInterval = options.interval || 4000
-
- this.slides = [
- this.el.querySelector('.banner__image--first'),
- this.el.querySelector('.banner__image--second')
- ]
-
- this.start()
- }
-
- swapSlide () {
- const currentImage = this.images[this.imageIdx]
-
- loadImage(currentImage, () => {
- const slides = this.slides
- const [previous, current] = slides
-
- current.style.backgroundImage = `url(${currentImage})`
-
- // slow appear
- Velocity(current, 'stop')
- Velocity(current, { scale: 1.0, translateY: '0px' },
- { duration: 0 })
- Velocity(current, { scale: 1.3, translateY: '-150px' },
- { duration: 36000, easing: 'linear' })
-
- // Fade in/out slides
- previous.classList.remove('banner__image--active')
- current.classList.add('banner__image--active')
-
- this.imageIdx = (this.imageIdx + 1) % this.images.length
- this.slides = [slides[1], slides[0]]
-
- setTimeout(this.swapSlide.bind(this), this.changeInterval)
- })
- }
-
- start () {
- const logo = this.el.querySelector('.banner__logo')
-
- if (logo) {
- Velocity(logo, { opacity: 0, translateY: 30, scale: 0.98 })
- Velocity(logo, { opacity: 1, translateY: 0, scale: 1 }, {
- easing: 'easeOutQuint',
- duration: 2000 })
- }
-
- setTimeout(() => {
- const sloganEl = this.el.querySelector('.banner__slogan')
-
- if (sloganEl) {
- this.slogatto = new Slogatto(sloganEl, {
- slogans: SLOGANS,
- interval: 6000
- })
-
- this.slogatto.start()
- }
-
- this.swapSlide()
- }, 500)
- }
-}
-
-export default Banner
-
diff --git a/app/components/poissonator.js b/app/components/poissonator.js
deleted file mode 100644
index 08dfaa3..0000000
--- a/app/components/poissonator.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import makeSampler from 'components/utils/poisson-sampler'
-
-function Poissonator (canvas) {
- const context = canvas.getContext('2d')
-
- const width = canvas.width
- const height = canvas.height
-
- const radius = 4
- const distance = 18
-
- let sampler = makeSampler(width, height, distance)
- let points = []
-
- function drawPoints () {
- for (let i = 0; i < 1000; ++i) {
- const point = sampler()
- if (!point) {
- break
- }
-
- points.push({ x: point[0], y: point[1] })
- }
-
- context.clearRect(0, 0, width, height)
- context.beginPath()
-
- points.forEach((p) => {
- context.moveTo(p.x, p.y)
- context.arc(p.x, p.y, radius, 0, 2 * Math.PI)
- })
-
- context.fillStyle = 'black'
- context.fill()
- }
-
- drawPoints()
-}
-
-export default Poissonator
diff --git a/app/components/slogatto.js b/app/components/slogatto.js
deleted file mode 100644
index 72cd717..0000000
--- a/app/components/slogatto.js
+++ /dev/null
@@ -1,94 +0,0 @@
-import Velocity from 'velocity-animate'
-
-/*
- * Animated text slideshow
- */
-class Slogatto {
- constructor (el, options = {}) {
- this.el = el
-
- this.slogans = options.slogans || []
- this.interval = options.interval || 4000
-
- this.currentIndex = 0
-
- options.autostart && this.start()
- }
-
- /*
- * Performs exit animation and calls callback
- * on complete
- */
- unanimateSlogan (done) {
- const words = this.el.querySelectorAll('.slogatto__word')
- if (!words || !words.length) return done()
-
- const durationFn = x => 600
- const delayFn = x => 50 * x
-
- words.forEach((word, idx) => {
- Velocity(word, { opacity: 0, translateY: -60 },
- {
- delay: delayFn(idx),
- duration: durationFn(idx),
- easing: 'easeInOutQuint'
- })
- })
-
- setTimeout(done, delayFn(words.length - 1) + durationFn(words.length - 1))
- }
-
- changeSlogan () {
- this.unanimateSlogan(() => {
- const phrase = this.slogans[this.currentIndex]
-
- // Clear the text and change it to new one
- this.el.innerHTML = ''
- this.spanified(phrase)
- .forEach(s => this.el.appendChild(s))
-
- const words = this.el.querySelectorAll('.slogatto__word')
-
- words.forEach((word, idx) => {
- Velocity(word, { translateY: 30 },
- { duration: 0 })
-
- Velocity(word, { translateY: 0 },
- {
- delay: 30 * idx,
- duration: 1000 + 65 * Math.pow(idx, 1.5),
- easing: 'easeInOutQuint'
- })
- })
-
- this.currentIndex = (this.currentIndex + 1) % this.slogans.length
-
- // Schedule slogan change after `interval` ms
- setTimeout(this.changeSlogan.bind(this), this.interval)
- })
- }
-
- start () {
- this.el && this.changeSlogan()
- }
-
- /*
- * Returns corresponding markup for a slogan phrase
- */
- spanified (phrase) {
- return phrase.split(' ').map((word) => {
- const wrapper = document.createElement('span')
- const span = document.createElement('span')
-
- span.textContent = word + ' '
- span.className = 'slogatto__word'
- wrapper.className = 'slogatto__wrapper'
-
- wrapper.appendChild(span)
- return wrapper
- })
- }
-}
-
-export default Slogatto
-
diff --git a/app/components/utils/poisson-sampler.js b/app/components/utils/poisson-sampler.js
deleted file mode 100644
index 669e7ec..0000000
--- a/app/components/utils/poisson-sampler.js
+++ /dev/null
@@ -1,74 +0,0 @@
-/* eslint-disable */
-
-// Based on https://www.jasondavies.com/poisson-disc/
-function poissonDiscSampler(width, height, radius) {
- var k = 30, // maximum number of samples before rejection
- radius2 = radius * radius,
- R = 3 * radius2,
- cellSize = radius * Math.SQRT1_2,
- gridWidth = Math.ceil(width / cellSize),
- gridHeight = Math.ceil(height / cellSize),
- grid = new Array(gridWidth * gridHeight),
- queue = [],
- queueSize = 0,
- sampleSize = 0;
-
- return function() {
- if (!sampleSize) return sample(Math.random() * width, Math.random() * height);
-
- // Pick a random existing sample and remove it from the queue.
- while (queueSize) {
- var i = Math.random() * queueSize | 0,
- s = queue[i];
-
- // Make a new candidate between [radius, 2 * radius] from the existing sample.
- for (var j = 0; j < k; ++j) {
- var a = 2 * Math.PI * Math.random(),
- r = Math.sqrt(Math.random() * R + radius2),
- x = s[0] + r * Math.cos(a),
- y = s[1] + r * Math.sin(a);
-
- // Reject candidates that are outside the allowed extent,
- // or closer than 2 * radius to any existing sample.
- if (0 <= x && x < width && 0 <= y && y < height && far(x, y)) return sample(x, y);
- }
-
- queue[i] = queue[--queueSize];
- queue.length = queueSize;
- }
- };
-
- function far(x, y) {
- var i = x / cellSize | 0,
- j = y / cellSize | 0,
- i0 = Math.max(i - 2, 0),
- j0 = Math.max(j - 2, 0),
- i1 = Math.min(i + 3, gridWidth),
- j1 = Math.min(j + 3, gridHeight);
-
- for (j = j0; j < j1; ++j) {
- var o = j * gridWidth;
- for (i = i0; i < i1; ++i) {
- if (s = grid[o + i]) {
- var s,
- dx = s[0] - x,
- dy = s[1] - y;
- if (dx * dx + dy * dy < radius2) return false;
- }
- }
- }
-
- return true;
- }
-
- function sample(x, y) {
- var s = [x, y];
- queue.push(s);
- grid[gridWidth * (y / cellSize | 0) + (x / cellSize | 0)] = s;
- ++sampleSize;
- ++queueSize;
- return s;
- }
-}
-
-export default poissonDiscSampler;
diff --git a/app/initialize.js b/app/initialize.js
deleted file mode 100644
index 7979b89..0000000
--- a/app/initialize.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import Banner from 'components/banner'
-import Poissonator from 'components/poissonator'
-
-const images = [
- '/images/birth-venus.jpg',
- 'https://media.giphy.com/media/l41lSeYuUleD8vG2Q/giphy.gif',
- 'http://i.giphy.com/3o6EhOYMhOTANYgHMk.gif'
-]
-
-document.addEventListener('DOMContentLoaded', function () {
- // Init banner slideshow
- const bannerEl = document.querySelector('.banner')
- bannerEl && new Banner(bannerEl, { images })
-})
-
diff --git a/app/styles/_colors.scss b/app/styles/_colors.scss
deleted file mode 100644
index a0f0cab..0000000
--- a/app/styles/_colors.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-$textGray: #373737;
-$pink: #FD789C;
-
-$gray-10: #FEFEFE;
-$gray-50: #FAFAFA;
-$gray-100: #F5F5F5;
-$gray-200: #EEEEEE;
-$gray-300: #E0E0E0;
-$gray-400: #BDBDBD;
-$gray-500: #9E9E9E;
-$gray-600: #757575;
-$gray-700: #616161;
-$gray-800: #424242;
-$gray-900: #212121;
diff --git a/app/styles/_media-queries.scss b/app/styles/_media-queries.scss
deleted file mode 100644
index 817786b..0000000
--- a/app/styles/_media-queries.scss
+++ /dev/null
@@ -1,30 +0,0 @@
-
-@mixin hdpi($ratio: 1.3) {
- @media only screen and (-webkit-min-device-pixel-ratio: $ratio),
- only screen and (min-resolution: #{round($ratio*96)}dpi) {
- @content;
- }
-}
-
-// Breakpoints
-@mixin breakpoint($class) {
- @if $class == xs {
- @media (max-width: 767px) { @content; }
- }
-
- @else if $class == sm {
- @media (max-width: 991px) { @content; }
- }
-
- @else if $class == md {
- @media (max-width: 1199px) { @content; }
- }
-
- @else if $class == lg {
- @media (min-width: 1200px) { @content; }
- }
-
- @else {
- @warn "Breakpoint mixin supports: xs, sm, md, lg";
- }
-}
diff --git a/app/styles/banner.scss b/app/styles/banner.scss
deleted file mode 100644
index 5989221..0000000
--- a/app/styles/banner.scss
+++ /dev/null
@@ -1,110 +0,0 @@
-@import 'media-queries';
-
-.banner {
- height: 240px;
- margin: 0 auto;
- position: relative;
- overflow: hidden;
- background: black;
-
- background-size: cover;
- background-position: center center;
-
- @include breakpoint(sm) {
- height: 220px;
- }
-}
-
-.banner--mini {
- height: 160px;
-}
-
-.banner__image,
-.banner__content {
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
-}
-
-/*
- * Image layer
- */
-.banner__image {
- background-color: black;
- z-index: 13;
-
- background-size: cover;
- background-position: center center;
- opacity: 0;
-
- // Little bit more than the height of container
- height: 350px;
- transition: opacity 1s ease;
-}
-
-.banner__image--active {
- opacity: 1.0;
-}
-
-.banner__content {
- background-color: rgba(0,0,0,0.5);
- z-index: 1337;
-
- padding: 14px 40px;
-}
-
-/*
- * Logo and slogan
- */
-.banner__slogan {
- text-align: center;
- font-weight: 500;
- color: white;
- line-height: 1.05;
-
- max-width: 640px;
- margin: 0 auto;
-
- font-size: 22px;
-
- @include breakpoint(sm) {
- font-size: 20px;
- }
-
- @include breakpoint(xs) {
- font-size: 18px;
- }
-
- .banner--mini & {
- font-size: 20px;
-
- @include breakpoint(xs) {
- font-size: 16px;
- }
- }
-}
-
-.banner__logo-wrap {
- text-align: center;
- padding-top: 52px;
-
- margin: 0 auto;
- margin-bottom: 14px;
-
- @include breakpoint(xs) {
- max-width: 400px;
- }
-
- .banner--mini & {
- padding-top: 36px;
- max-width: 320px;
- }
-}
-
-.banner__logo {
- opacity: 0;
- max-width: 100%;
-}
-
diff --git a/app/styles/post.scss b/app/styles/post.scss
deleted file mode 100644
index ded2f1c..0000000
--- a/app/styles/post.scss
+++ /dev/null
@@ -1,68 +0,0 @@
-@import 'colors';
-@import 'media-queries';
-
-/**
- * Posts
- */
-.post {
- max-width: 800px;
- margin: 0 auto;
- padding: 14px;
-}
-
-.post__header {
-}
-
-.post__title {
- font-size: 38px;
- line-height: 1.1;
- letter-spacing: -1px;
-
- @include breakpoint(sm) {
- font-size: 32px;
- }
-}
-
-.post__author {
- margin-bottom: 22px;
- font-size: 18px;
- font-weight: 400;
- color: #777777;
-
- @include breakpoint(sm) {
- font-size: 16px;
- }
-}
-
-.post__content {
- line-height: 1.67;
- margin-bottom: 22px;
- font-size: 17px;
- color: $textGray;
-
- margin-bottom: 90px;
-
- img {
- width: 100%;
- margin: 20px 0;
- }
-
- a {
- color: $textGray;
- border-bottom: 2px solid $pink;
- text-decoration: none;
- font-weight: 500;
- }
-
- h2 {
- font-size: 32px;
- }
-
- h3 {
- font-size: 26px;
- }
-
- h4 {
- font-size: 20px;
- }
-}
diff --git a/app/styles/project-card.scss b/app/styles/project-card.scss
deleted file mode 100644
index fdb0e88..0000000
--- a/app/styles/project-card.scss
+++ /dev/null
@@ -1,38 +0,0 @@
-@import './colors';
-
-.projects {
- margin-bottom: 48px;
-}
-
-.projects__grid {
- display: flex;
- flex-flow: row nowrap;
-}
-
-.project-card {
- margin-right: 48px;
-}
-
-.project-card__thumb {
- width: 200px;
- height: 120px;
-
- border-radius: 4px;
- margin-bottom: 8px;
-
- background-size: cover;
-}
-
-.project-card__name {
- font-size: 18px;
- text-decoration: underline;
- display: inline-block;
- margin-bottom: 6px;
- max-width: 240px;
-}
-
-.project-card__description {
- color: $textGray;
- font-size: 15px;
- max-width: 300px;
-}
diff --git a/app/styles/sections.scss b/app/styles/sections.scss
deleted file mode 100644
index 98a7f0c..0000000
--- a/app/styles/sections.scss
+++ /dev/null
@@ -1,209 +0,0 @@
-@import 'colors';
-@import 'media-queries';
-
-// ----
-// Base section
-// ----
-.section {
- margin-bottom: 82px;
-}
-
-.section__header {
- font-weight: bold;
- font-size: 28px;
- margin-bottom: 22px;
-}
-
-// ----
-// Posts
-// ----
-.post-grid__row {
- display: flex;
- flex-flow: row nowrap;
-
- @include breakpoint(xs) {
- display: block;
- }
-}
-
-.post-grid__item {
- width: 33.3%;
- padding: 0 32px;
- margin-bottom: 64px;
-
- &:first-child { padding-left: 0; }
- &:last-child { padding-right: 0; }
-
- @include breakpoint(xs) {
- width: 100%;
- padding: 0;
- margin-bottom: 32px;
- }
-}
-
-.post-preview {
-}
-
-.post-preview__title {
- font-size: 18px;
- font-weight: 500;
- margin-bottom: 6px;
-
- color: black;
- text-decoration: none;
- display: block;
-}
-
-.post-preview__title-text {
- display: inline;
- border-bottom: 5px solid #F4B6BF;
-
- .post-preview--1 & { border-color: #F4B6BF; }
- .post-preview--2 & { border-color: #FDFA49; }
- .post-preview--3 & { border-color: #6EDDA4; }
- .post-preview--4 & { border-color: #82bcff; }
- .post-preview--5 & { border-color: #000000; }
-}
-
-.post-preview__date {
- font-size: 13px;
- color: $gray-800;
- margin-bottom: 6px;
-}
-
-.post-preview__summary {
- font-size: 14px;
- color: $textGray;
-}
-
-// ---
-// Post stub
-// ---
-.post-stub {
- height: 180px;
- border-radius: 4px;
-
- background-image: url(/images/poisson.png);
- background-size: cover;
-
- display: flex;
- flex-flow: row nowrap;
- align-items: center;
- justify-content: center;
-
- position: relative;
- overflow: hidden;
-
- @include breakpoint(xs) {
- height: 130px;
- }
-}
-
-.post-stub__text-wrap {
- text-align: center;
- max-width: 65%;
- line-height: 1.2;
- z-index: 133;
-}
-
-.post-stub__text {
- display: inline;
- background-color: white;
- font-weight: bold;
- font-size: 19px;
- padding: 3px;
-}
-
-.post-stub__poisson-wrap {
- position: absolute;
- top: 0;
- bottom: 0;
- right: 0;
- left: 0;
-
- z-index: 0;
-}
-
-.post-stub__poisson {
- width: 300px;
- height: 200px;
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
-}
-
-// ----
-// About section
-// ----
-.section.section--about {
- display: flex;
- flex-flow: row nowrap;
-
- @include breakpoint(xs) {
- display: block;
- }
-}
-
-.site__about {
- width: 75%;
- padding-right: 58px;
-
- @include breakpoint(xs) {
- width: 100%;
- padding-right: 0;
- }
-}
-
-.site__team {
- width: 25%;
- align-self: center;
-
- @include breakpoint(xs) {
- width: 100%;
- text-align: center;
- margin-top: 32px;
- }
-}
-
-.site__postmark {
- width: 220px;
-}
-
-.team__header {
- font-weight: bold;
- font-size: 20px;
- padding-top: 40px;
- margin-bottom: 8px;
-}
-
-.site__postmark-label {
- font-size: 13px;
- margin-top: 6px;
- color: $gray-600;
- padding: 0 12px;
-}
-
-.team__member {
- margin-bottom: 4px;
- font-size: 17px;
-}
-
-.about__header {
- font-weight: bold;
- font-size: 24px;
- margin-bottom: 20px;
-}
-
-.about__text {
- color: $textGray;
- font-size: 17px;
-}
-
-.about__link {
- font-weight: 500;
-
- color: $textGray;
- border-bottom: 2px solid $textGray;
- text-decoration: none;
-}
diff --git a/app/styles/site.scss b/app/styles/site.scss
deleted file mode 100644
index 0f7220d..0000000
--- a/app/styles/site.scss
+++ /dev/null
@@ -1,22 +0,0 @@
-@import 'sanitize';
-
-@import './colors';
-@import './media-queries';
-
-// Add fancy text selection styles
-::selection {
- color: white;
- background-color: $pink;
-}
-
-.site {
- font-family: Rubik, sans-serif;
- -webkit-font-smoothing: antialiased;
-}
-
-// Main site content centered and limited in width
-.site__content {
- max-width: 960px;
- margin: 0 auto;
- padding: 48px 15px;
-}
diff --git a/app/styles/slogatto.scss b/app/styles/slogatto.scss
deleted file mode 100644
index f7183f8..0000000
--- a/app/styles/slogatto.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-/*
- * Slogatto component
- */
-
-.slogatto__word {
- display: inline-block;
-}
-
-.slogatto__wrapper {
- display: inline-block;
- margin-right: 5px;
- overflow: hidden;
-
- // webkit hack
- border: 1px solid transparent;
-}
diff --git a/app/templates/includes/ya-metrika.html b/app/templates/includes/ya-metrika.html
deleted file mode 100644
index 73f0267..0000000
--- a/app/templates/includes/ya-metrika.html
+++ /dev/null
@@ -1,29 +0,0 @@
-
-
-
-
diff --git a/app/templates/layout.pug b/app/templates/layout.pug
deleted file mode 100644
index f3ddb12..0000000
--- a/app/templates/layout.pug
+++ /dev/null
@@ -1,31 +0,0 @@
-doctype html
-html(lang="ru")
- head
- meta(charset="utf-8")
- meta(name="viewport" content="initial-scale=1.0, user-scalable=no")
-
- meta(
- name="description"
- content=((page && page.description) || "Code Hipsters — сообщество программистов и цифровых дизайнеров из Ростова-на-Дону"))
-
- meta(name="keywords" contet="code hipsters,кодохипстеры,код хипстеры,сообщество в ростове,ит-сообщество,митапы,смузи,братишки,фикус")
-
- title
- = (page && page.title && page.title + ' · Code Hipsters') || 'Code Hipsters'
-
- //- Favicons
- link(rel='icon' type='image/png' href='/images/favicon-16.png' sizes='16x16')
- link(rel='icon' type='image/png' href='/images/favicon-32.png' sizes='32x32')
-
- meta(name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height")
-
- link(href="https://fonts.googleapis.com/css?family=Rubik:300,400,500,500i,700&subset=cyrillic" rel="stylesheet")
- link(rel="stylesheet" href="/app.css")
-
- script(src="/app.js")
- script.
- require('initialize');
-
- body.site
- block content
- include includes/ya-metrika.html
diff --git a/app/templates/main.pug b/app/templates/main.pug
deleted file mode 100644
index dfe067d..0000000
--- a/app/templates/main.pug
+++ /dev/null
@@ -1,103 +0,0 @@
-extends layout.pug
-
-block content
- //---
- //- Banner
- //---
- .banner
- .banner__image.banner__image--first
- .banner__image.banner__image--second
- .banner__content
- a(href="/")
- .banner__logo-wrap
- img.banner__logo(src='/images/ch-horiz-white.svg')
- .banner__slogan
-
- .site__content
-
- //---
- //- About section
- //---
- .section.section--about
- .site__about
- .section__header Кто такие Code Hipsters?
- .about__text
- p
- | Код хипстеры — сообщество программистов и цифровых дизайнеров из Ростова-на-Дону. Мы исследуем зарождающиеся паттерны и стили эпохи ИТ-ренессанса и веб-модерна, а результаты изысканий публикуем в
- = ' '
- a.about__link(href='http://vk.com/codehipsters') социальных
- = ' '
- a.about__link(href='http://twitter.com/codehipsters') сетях
- | и
- = ' '
- a.about__link(href='http://telegram.me/codehipsters') Телеграме
- | . Ищем новые идеи повсюду, от последних исследований в сфере искусственного интеллекта до Чинквеченто, ревущих двадцатых, комикс-культуры и рейв-движения.
- p
- | С радостью делимся опытом и новостями на конференциях и митапах. Чтобы делать запоминающиеся презентации и общаться с публикой, разработали
- = ' '
- a.about__link(href='http://ficus.io') ficus.io
- | .
- .site__team
- img.site__postmark(src='/images/rails-club-sticker.png')
- .site__postmark-label
- | свои крестовые походы на конференции отмечаем
- | выпуском тематических стикеров-марок.
-
- //---
- //- Blog section
- //---
- .section.section--posts
- .section__header
- | Пишем
-
- .section__content
- .post-grid__row
- .post-grid__item
- .post-stub
-
- //-.post-stub__poisson-wrap
- //- canvas.post-stub__poisson(width="600" height="400")
- .post-stub__text-wrap: .post-stub__text Время от времени мы публикуем полнометражные истории
-
-
- .post-grid__item
- .post-preview.post-preview--1
- a.post-preview__title(href="https://medium.com/@mlfrg/rules-of-parsing-dates-with-date-parse-c5a73525a72e")
- .post-preview__title-text Правила безопасности с Date.parse
- .post-preview__date 30 ноября 2016
- .post-preview__summary
- | Когда часовые пояса выстреливают в ногу.
-
- .post-grid__item
- .post-preview.post-preview--2
- a.post-preview__title(href="https://medium.com/@kadmil/promised-way-to-async-flows-with-redux-43977eef9f46#.uz7fga7tde")
- .post-preview__title-text Promised way to async flows with Redux
- .post-preview__date 30 мая 2016
- .post-preview__summary
- | Рассказываем, как просто начать работать с асинхронными действиями в Редаксе.
-
- .post-grid__row
- .post-grid__item
- .post-preview.post-preview--3
- a.post-preview__title(href="https://medium.com/@kadmil/css-modules-to-the-rescue-jsx-ded2db874d34#.x44q7dy52")
- .post-preview__title-text CSS Modules to the rescue.jsx
- .post-preview__date 9 мая 2016
- .post-preview__summary
- | Настраиваем цсс-модули на вебпаке и попутно рассказываем, зачем это делать.
-
- .post-grid__item
- .post-preview.post-preview--4
- a.post-preview__title(href="/b/indutny-fork/")
- .post-preview__title-text Фёдор Индутный, io.js и столовые приборы
- .post-preview__date 14 января 2015
- .post-preview__summary
- | Интервью по горячим следам форка Node.js в 2014.
-
- .post-grid__item
- .post-preview.post-preview--5
- a.post-preview__title(href="/b/sitnik/")
- .post-preview__title-text Андрей Ситник: «Будущее за CSS постпроцессорами!»
- .post-preview__date 27 ноября 2014
- .post-preview__summary
- | Познакомились с Ситником и разобрались с ПостЦсс до того, как это стало мейнстримом.
-
diff --git a/app/templates/post.pug b/app/templates/post.pug
deleted file mode 100644
index 36cf2bb..0000000
--- a/app/templates/post.pug
+++ /dev/null
@@ -1,29 +0,0 @@
-extends layout.pug
-
-block content
- //---
- //- Banner
- //---
- .banner.banner--mini
- .banner__image.banner__image--first
- .banner__image.banner__image--second
- .banner__content
- a(href="/")
- .banner__logo-wrap
- img.banner__logo(src='/images/ch-horiz-white.svg')
-
- .banner__slogan
-
- .post
- header.post__header
- h1.post__title
- = post.title
-
- .post__meta
- .post__author
- = post.author
- = ' · '
- = post.localized_date
-
- article.post__content
- | !{post.content}
diff --git a/brunch-config.js b/brunch-config.js
deleted file mode 100644
index 1630140..0000000
--- a/brunch-config.js
+++ /dev/null
@@ -1,22 +0,0 @@
-// See http://brunch.io for documentation.
-module.exports = {
- files: {
- javascripts: {joinTo: 'app.js'},
- stylesheets: {joinTo: 'app.css'},
- templates: {joinTo: 'app.js'}
- },
-
- plugins: {
- babel: {
- presets: ['es2015']
- },
- postcss: {
- processors: [require('autoprefixer')]
- },
- sass: {
- options: {
- includePaths: ['node_modules/sanitize.css/']
- }
- }
- }
-}
diff --git a/compile.js b/compile.js
deleted file mode 100644
index 2c537c0..0000000
--- a/compile.js
+++ /dev/null
@@ -1,88 +0,0 @@
-const pug = require('pug')
-const path = require('path')
-const mkdirp = require('mkdirp')
-const fs = require('fs')
-const marked = require('marked')
-const glob = require('glob')
-const ncp = require('ncp').ncp
-
-const isProduction = process.env.NODE_ENV === 'production'
-
-const templatesPath = path.join(__dirname, 'app', 'templates')
-const publicPath = path.join(__dirname, 'public')
-
-const pugOptions = {
- basedir: path.join(__dirname, 'app'),
- pretty: !isProduction
-}
-
-/*
- * Compile static pages
- * TODO: move to brunch
- */
-const staticPages = {
- 'main.pug': 'index.html'
-}
-
-for (const page in staticPages) {
- const filename = path.join(templatesPath, page)
- const html = pug.renderFile(filename, pugOptions)
-
- const outputFile = path.join(publicPath, staticPages[page])
-
- mkdirp(path.dirname(outputFile), () => {
- fs.writeFile(outputFile, html)
- console.log(`-> ${outputFile}`)
- })
-}
-
-/*
- * Compiles a post within a given dir
- */
-const compilePost = (postPath, onDone) => {
- const postConfig = require(path.join(postPath, 'post.json'))
-
- fs.readFile(path.join(postPath, 'post.md'), (err, data) => {
- if (err) return
-
- const postMarkdown = data.toString()
- const postContent = marked(postMarkdown)
-
- const outputDir = path.join(publicPath, postConfig.output || postPath)
-
- mkdirp(outputDir, () => {
- const template = path.join(templatesPath, 'post.pug')
- const html = pug.renderFile(template, Object.assign({}, pugOptions, {
- page: {
- title: postConfig.title
- },
-
- post: Object.assign({
- content: postContent
- }, postConfig)
- }))
-
- const outputFile = path.join(outputDir, 'index.html')
- fs.writeFile(outputFile, html, () => {
- const assetsPath = path.join(postPath, 'assets')
-
- ncp(assetsPath, publicPath)
-
- console.log(`Assets ${assetsPath} linked`)
- onDone && onDone(null)
- })
-
- console.log(`-> ${outputFile}`)
- })
- })
-}
-
-/*
- * Compile all posts in /posts dir
- */
-glob(path.join(__dirname, 'posts', '*/'), (err, files) => {
- if (err) return
-
- files.forEach((file) => compilePost(file))
-})
-
diff --git a/css/fonts/icons/fontello.eot b/css/fonts/icons/fontello.eot
new file mode 100644
index 0000000..e261911
Binary files /dev/null and b/css/fonts/icons/fontello.eot differ
diff --git a/css/fonts/icons/fontello.svg b/css/fonts/icons/fontello.svg
new file mode 100644
index 0000000..af179d7
--- /dev/null
+++ b/css/fonts/icons/fontello.svg
@@ -0,0 +1,18 @@
+
+
+
\ No newline at end of file
diff --git a/css/fonts/icons/fontello.ttf b/css/fonts/icons/fontello.ttf
new file mode 100644
index 0000000..fd3e8a3
Binary files /dev/null and b/css/fonts/icons/fontello.ttf differ
diff --git a/css/fonts/icons/fontello.woff b/css/fonts/icons/fontello.woff
new file mode 100644
index 0000000..c75eeb8
Binary files /dev/null and b/css/fonts/icons/fontello.woff differ
diff --git a/css/images/ch-footer-logo.png b/css/images/ch-footer-logo.png
new file mode 100644
index 0000000..1d13292
Binary files /dev/null and b/css/images/ch-footer-logo.png differ
diff --git a/css/images/ch-logo-text.png b/css/images/ch-logo-text.png
new file mode 100644
index 0000000..289980e
Binary files /dev/null and b/css/images/ch-logo-text.png differ
diff --git a/css/images/ch-logo.png b/css/images/ch-logo.png
new file mode 100644
index 0000000..cb2bca5
Binary files /dev/null and b/css/images/ch-logo.png differ
diff --git a/css/images/main-page-1.jpg b/css/images/main-page-1.jpg
new file mode 100644
index 0000000..d3db8c7
Binary files /dev/null and b/css/images/main-page-1.jpg differ
diff --git a/css/images/main-page.jpg b/css/images/main-page.jpg
new file mode 100644
index 0000000..a5585c6
Binary files /dev/null and b/css/images/main-page.jpg differ
diff --git a/css/main.scss b/css/main.scss
new file mode 100755
index 0000000..30cc188
--- /dev/null
+++ b/css/main.scss
@@ -0,0 +1,114 @@
+---
+# Only the main Sass file needs front matter (the dashes are enough)
+---
+@charset "utf-8";
+
+
+
+// Our variables
+$base-font-family: Helvetica, Arial, sans-serif;
+$base-font-size: 16px;
+$small-font-size: $base-font-size * 0.875;
+$base-line-height: 1.5;
+
+$spacing-unit: 30px;
+
+$text-color: #111;
+$background-color: #fdfdfd;
+$brand-color: #2a7ae2;
+
+$grey-color: #828282;
+$grey-color-light: lighten($grey-color, 40%);
+$grey-color-dark: darken($grey-color, 25%);
+
+// Width of the content area
+$content-width: 800px;
+
+$on-palm: 600px;
+$on-laptop: 800px;
+
+
+
+// Using media queries with like this:
+// @include media-query($on-palm) {
+// .wrapper {
+// padding-right: $spacing-unit / 2;
+// padding-left: $spacing-unit / 2;
+// }
+// }
+@mixin media-query($device) {
+ @media screen and (max-width: $device) {
+ @content;
+ }
+}
+
+
+
+// Import partials from `sass_dir` (defaults to `_sass`)
+@import
+ "fonts",
+ "base",
+ "layout",
+ "syntax-highlighting"
+;
+
+
+.main-page-header {
+
+ .intro-container {
+ padding-top: 50px;
+ text-align: center;
+
+ h1 {
+ margin-top: 20px;
+ font-size: 32px;
+ display: none;
+ }
+
+ img.code-hipsters-logo {
+ width: 180px;
+ margin: 0 auto;
+ @include media-query($on-palm) {
+ width: 140px;
+ }
+ }
+
+ .intro-text {
+ font-weight: 300;
+ font-size: 22px;
+ color: #3a3a3a;
+ font-family: 'Fira Sans';
+ margin-top: 40px;
+ margin-bottom: 60px;
+
+ @include media-query($on-palm) {
+ font-size: 18px;
+ }
+ }
+ }
+
+ .post-link:hover {
+ color: white;
+ background-color: #ee6e83;
+ text-decoration: none;
+ }
+
+ li {
+ text-align: center;
+ }
+}
+
+.post-content {
+ img {
+ margin-top: 20px;
+ margin-bottom: 20px;
+ // max-width: 130%;
+ // margin-left: -15%;
+ }
+}
+
+.pluso-container {
+ text-align: center;
+}
+
+
diff --git a/favicon.ico b/favicon.ico
new file mode 100644
index 0000000..80573dd
Binary files /dev/null and b/favicon.ico differ
diff --git a/feed.xml b/feed.xml
new file mode 100644
index 0000000..a6628bd
--- /dev/null
+++ b/feed.xml
@@ -0,0 +1,30 @@
+---
+layout: null
+---
+
+
+
+ {{ site.title | xml_escape }}
+ {{ site.description | xml_escape }}
+ {{ site.url }}{{ site.baseurl }}/
+
+ {{ site.time | date_to_rfc822 }}
+ {{ site.time | date_to_rfc822 }}
+ Jekyll v{{ jekyll.version }}
+ {% for post in site.posts limit:10 %}
+
+ {{ post.title | xml_escape }}
+ {{ post.content | xml_escape }}
+ {{ post.date | date_to_rfc822 }}
+ {{ post.url | prepend: site.baseurl | prepend: site.url }}
+ {{ post.url | prepend: site.baseurl | prepend: site.url }}
+ {% for tag in post.tags %}
+ {{ tag | xml_escape }}
+ {% endfor %}
+ {% for cat in post.categories %}
+ {{ cat | xml_escape }}
+ {% endfor %}
+
+ {% endfor %}
+
+
diff --git a/images/code-hipsters-logo.svg b/images/code-hipsters-logo.svg
new file mode 100644
index 0000000..f7a1a80
--- /dev/null
+++ b/images/code-hipsters-logo.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/posts/2015-01-14-indutny-interview/assets/images/indutny-coffee-cite.png b/images/indutny-coffee-cite.png
similarity index 100%
rename from posts/2015-01-14-indutny-interview/assets/images/indutny-coffee-cite.png
rename to images/indutny-coffee-cite.png
diff --git a/posts/2015-01-14-indutny-interview/assets/images/indutny-header.png b/images/indutny-header.png
similarity index 100%
rename from posts/2015-01-14-indutny-interview/assets/images/indutny-header.png
rename to images/indutny-header.png
diff --git a/posts/2015-01-14-indutny-interview/assets/images/indutny-reaction-cite.png b/images/indutny-reaction-cite.png
similarity index 100%
rename from posts/2015-01-14-indutny-interview/assets/images/indutny-reaction-cite.png
rename to images/indutny-reaction-cite.png
diff --git a/posts/2015-01-14-indutny-interview/assets/images/indutny-typewriter-cite.png b/images/indutny-typewriter-cite.png
similarity index 100%
rename from posts/2015-01-14-indutny-interview/assets/images/indutny-typewriter-cite.png
rename to images/indutny-typewriter-cite.png
diff --git a/images/sitnik-cite-1.jpg b/images/sitnik-cite-1.jpg
new file mode 100644
index 0000000..6bf44cb
Binary files /dev/null and b/images/sitnik-cite-1.jpg differ
diff --git a/images/sitnik-cite-1.png b/images/sitnik-cite-1.png
new file mode 100644
index 0000000..e1db6cc
Binary files /dev/null and b/images/sitnik-cite-1.png differ
diff --git a/images/sitnik-cite-2.jpg b/images/sitnik-cite-2.jpg
new file mode 100644
index 0000000..c936a5a
Binary files /dev/null and b/images/sitnik-cite-2.jpg differ
diff --git a/images/sitnik-cite-2.png b/images/sitnik-cite-2.png
new file mode 100644
index 0000000..94dc640
Binary files /dev/null and b/images/sitnik-cite-2.png differ
diff --git a/images/sitnik-cite-3.jpg b/images/sitnik-cite-3.jpg
new file mode 100644
index 0000000..862a8ef
Binary files /dev/null and b/images/sitnik-cite-3.jpg differ
diff --git a/images/sitnik-cite-3.png b/images/sitnik-cite-3.png
new file mode 100644
index 0000000..0f250a3
Binary files /dev/null and b/images/sitnik-cite-3.png differ
diff --git a/images/sitnik-cite-4.jpg b/images/sitnik-cite-4.jpg
new file mode 100644
index 0000000..dcb3072
Binary files /dev/null and b/images/sitnik-cite-4.jpg differ
diff --git a/images/sitnik-cite-4.png b/images/sitnik-cite-4.png
new file mode 100644
index 0000000..f64850f
Binary files /dev/null and b/images/sitnik-cite-4.png differ
diff --git a/posts/2014-11-27-sitnik-interview/assets/images/sitnik-header.jpg b/images/sitnik-header.jpg
similarity index 100%
rename from posts/2014-11-27-sitnik-interview/assets/images/sitnik-header.jpg
rename to images/sitnik-header.jpg
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..c297689
--- /dev/null
+++ b/index.html
@@ -0,0 +1,34 @@
+---
+layout: default
+---
+
+
+
+
+
Что происходит?
+
+ Приветик! Code Hipsters — это тусовка программистов-хипстеров и хипстеров-программистов.
+ Мы пишем о переднем крае фронтенда,
+ программировании и крутых технологиях.
+