Merge branch 'develop' into 'master'

Develop See merge request mishamyrt/myrt.co!6
mishamyrt · Sep 13, 2019 · 1439083 · 1439083
2 parents cb69735 + 7317a9c
commit 1439083
Show file tree

Hide file tree

Showing 11 changed files with 140 additions and 22 deletions.
diff --git a/.gitlab/ci/build.gitlab-ci.yml b/.gitlab/ci/build.gitlab-ci.yml
@@ -2,7 +2,6 @@ generate static files:
   stage: build
   variables:
     PARCEL_WORKERS: 1
-    NODE_ENV: production
   script:
     - npm ci
     - npm run build

diff --git a/package.json b/package.json
@@ -5,7 +5,7 @@
   "private": true,
   "scripts": {
     "start": "npm run serve",
-    "build": "node build.js",
+    "build": "export NODE_ENV=production && node build.js",
     "serve": "npx parcel serve src/index.pug",
     "size-check": "npx size-limit",
     "spell-check": "npx yaspeller dist/**/*.html",
@@ -124,8 +124,12 @@
     },
     {
       "name": "Full",
-      "path": "dist/*.*",
-      "limit": "280 KB"
+      "path": [
+        "dist/*.webp",
+        "dist/*.png",
+        "dist/*.woff2"
+      ],
+      "limit": "120 KB"
     }
   ]
 }
diff --git a/src/hero/hero.css b/src/hero/hero.css
@@ -54,3 +54,47 @@ a.hero-icon:hover {
   background-color: transparent;
   transition: opacity 0s;
 }
+
+@media screen and (max-width: 900px) {
+  .hero-heading {
+    font-size: calc(7vw + 14px);
+    line-height: calc(7.4vw + 14px);
+    margin: 0 0 calc(0.5vw + 14px);
+  }
+
+  .hero-content {
+    max-width: unset;
+  }
+
+  .hero-header {
+    flex-direction: column-reverse;
+  }
+
+  .hero-avatar {
+    max-width: 150px;
+    max-height: 150px;
+    margin: -4px 0 8px;
+  }
+}
+
+@media screen and (max-width: 521px) {
+  .hero-heading {
+    font-size: 55px;
+    margin: 1px 0 6px;
+    line-height: 60px;
+  }
+}
+
+@media screen and (max-width: 460px) {
+  .hero-heading {
+    font-size: 35px;
+    margin: 1px 0 10px;
+    line-height: 41px;
+  }
+
+  .hero-avatar {
+    max-width: 100px;
+    max-height: 100px;
+    margin: -4px 0 13px;
+  }
+}
diff --git a/src/index.css b/src/index.css
@@ -8,6 +8,7 @@ body {
   -webkit-font-smoothing: antialiased;
   min-height: calc(100vh - 74px);
   margin: 0;
+  padding: 0 20px;
   display: flex;
   align-items: center;
 }

diff --git a/src/photo/avatar.jpg b/src/photo/avatar.jpg
diff --git a/src/photo/avatar.webp b/src/photo/avatar.webp
diff --git a/src/photo/[email protected] b/src/photo/[email protected]
diff --git a/src/photo/[email protected] b/src/photo/[email protected]
diff --git a/src/resume/resume.css b/src/resume/resume.css
@@ -18,7 +18,7 @@
 .resume-position {
   font-size: 19px;
   line-height: 11px;
-  margin: 20px 0 39px;
+  margin: 20px 0 60px;
 }
 
 .resume-links {
@@ -69,6 +69,16 @@ a.resume-link:hover {
 
 .resume-date {
   text-align: center;
+  position: relative;
+}
+
+.resume-date span {
+  display: block;
+}
+
+.resume-date span:first-child::after {
+  content: '|';
+  display: block;
 }
 
 .resume-jobs {
@@ -99,3 +109,68 @@ a.resume-link:hover {
   color: var(--color-text);
   margin: 17px 0 0;
 }
+
+@media screen and (max-width: 750px) {
+  .resume-header {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .resume-heading {
+    font-size: 35px;
+    margin: 25px 0 10px;
+    line-height: 41px;
+  }
+
+  .resume-contacts {
+    text-align: left;
+    margin: 29px 0 0;
+  }
+
+  .resume-avatar {
+    align-self: center;
+    max-width: 100px;
+    max-height: 100px;
+  }
+
+  .resume {
+    margin: 15px auto 37px;
+  }
+
+  .resume-job {
+    display: flex;
+    flex-direction: column;
+    position: relative;
+  }
+
+  .resume-jobs {
+    margin-top: 10px;
+  }
+
+  .resume-date {
+    position: absolute;
+    top: 30px;
+  }
+
+  .resume-links {
+    top: 0;
+    position: absolute;
+    right: 0;
+  }
+
+  .resume-date span {
+    display: inline;
+  }
+
+  .resume-date span:first-child::after {
+    content: ' — ';
+    display: inline;
+  }
+
+  .resume-stack {
+    text-align: left;
+    margin-top: 7px;
+    margin-left: -4px;
+    margin-bottom: 13px;
+  }
+}
diff --git a/src/ru/index.pug b/src/ru/index.pug
@@ -9,8 +9,8 @@ html( lang="ru" itemtype="https://schema.org/Person" itemscope )
       .hero-header
         h1.hero-heading Давайте делать крутые штуки
         picture.hero-avatar
-          source( srcset="/photo/avatar.webp" type="image/webp" )
-          img.hero-avatar( src="/photo/avatar.jpg" alt="Фотография Миши Хрустика" itemprop="image")
+          source( srcset="/photo/avatar@2x.webp 2x, /photo/avatar.webp" type="image/webp" )
+          img.hero-avatar( src="/photo/avatar.jpg", srcset="/photo/[email protected] 2x, /photo/avatar.jpg" alt="Фотография Миши Хрустика" itemprop="image")
       .hero-content
         p
           | Привет, меня зовут

diff --git a/src/ru/resume.pug b/src/ru/resume.pug
@@ -20,9 +20,8 @@ html( lang="ru" itemtype="https://schema.org/Person" itemscope )
       .resume-jobs
         .resume-job
           p.resume-date
-            | Фев 2019 <br>
-            | | <br>
-            | Наши дни
+            span Фев 2019
+            span Наши дни
           .resume-content
             h3.resume-position Фронтлид в Тектософт
             p
@@ -64,9 +63,8 @@ html( lang="ru" itemtype="https://schema.org/Person" itemscope )
               span.resume-technology Autohotkey
         .resume-job
           p.resume-date
-            | Июл 2018 <br>
-            | | <br>
-            | Фев 2019
+            span Июл 2018
+            span Фев 2019
           .resume-content
             h3.resume-position Фронтендер в БелВГ
             p
@@ -97,9 +95,8 @@ html( lang="ru" itemtype="https://schema.org/Person" itemscope )
               span.resume-technology Knockout.JS
         .resume-job
           p.resume-date
-            | Май 2017 <br>
-            | | <br>
-            | Мар 2018
+            span Май 2017
+            span Мар 2018
           .resume-content
             h3.resume-position Тимлид и дизайнер в Цифре
             p
@@ -127,9 +124,8 @@ html( lang="ru" itemtype="https://schema.org/Person" itemscope )
               span.resume-technology Gulp
         .resume-job
           p.resume-date
-            | Сен 2016 <br>
-            | | <br>
-            | Май 2017
+            span Сен 2016
+            span Май 2017
           .resume-content
             h3.resume-position Разработчик, дизайнер и техлид в CMT
             p
@@ -154,9 +150,8 @@ html( lang="ru" itemtype="https://schema.org/Person" itemscope )
               span.resume-technology Gulp
         .resume-job
           p.resume-date
-            | Июн 2016 <br>
-            | | <br>
-            | Авг 2016
+            span Июн 2016
+            span Авг 2016
           .resume-content
             h3.resume-position Фуллстек в ЭФО
             p