Initial commit

2022-03-22 20:36:05 +03:00
commit 3927ac4ae9
18 changed files with 670 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,5 @@
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local
--- a/assets/drift/screenshot1.png
+++ b/assets/drift/screenshot1.png
--- a/assets/murk/thumb.png
+++ b/assets/murk/thumb.png
--- a/assets/mwg/thumb.jpg
+++ b/assets/mwg/thumb.jpg
--- a/assets/stroll/screenshot1.png
+++ b/assets/stroll/screenshot1.png
--- a/assets/stroll/screenshot2.png
+++ b/assets/stroll/screenshot2.png
--- a/assets/stroll/screenshot3.png
+++ b/assets/stroll/screenshot3.png
--- a/assets/stroll/screenshot4.png
+++ b/assets/stroll/screenshot4.png
--- a/assets/stroll/screenshot5.png
+++ b/assets/stroll/screenshot5.png
--- a/assets/stroll/screenshot6.png
+++ b/assets/stroll/screenshot6.png
--- a/assets/stroll/screenshot7.png
+++ b/assets/stroll/screenshot7.png
--- a/assets/zombieline/thumb.gif
+++ b/assets/zombieline/thumb.gif
--- a/favicon.svg
+++ b/favicon.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://w3.org/2000/svg" viewBox="0 0 100 100">
+<text y=".9em" font-size="90">🕹</text>
+</svg>
--- a/index.html
+++ b/index.html
@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Game Collection</title>
+  </head>
+  <body>
+    <div id="app">
+      <h1 class="title">My games</h1>
+      <div class="games">
+        <div class="games__section stroll">
+          <div class="games__section__game">
+            <img src="/assets/stroll/screenshot4.png" class="games__section__game__thumb">
+            <div class="games__section__game__info">
+              <h2>Stroll</h2>
+              <div class="description">
+                An atmospheric platformer.
+              </div>
+              <div class="links">
+                <a href="https://games.anatolykopyl.ru/stroll" target="_blank">Play now</a>
+                <a href="https://gamejolt.com/games/Stroll/279158" target="_blank">Check out on GameJolt</a>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="games__section inverted mwg">
+          <div class="games__section__game">
+            <img src="/assets/mwg/thumb.jpg" class="games__section__game__thumb">
+            <div class="games__section__game__info">
+              <h2>Monkeys With Grenades</h2>
+              <div class="description">
+                A local PvP arcade.<br>
+                Two people on one keyboard, oldschool.
+              </div>
+              <div class="links">
+                <a href="https://games.anatolykopyl.ru/mwg" target="_blank">Play now</a>
+                <a href="https://gamejolt.com/games/monkeys-with-grenades/83237" target="_blank">Check out on GameJolt</a><br>
+                <a href="https://music.amazon.com.au/artists/B08FHBMW58/lebtr" target="_blank">Music by Lebtr</a>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="games__section zombieline">
+          <div class="games__section__game">
+            <img src="/assets/zombieline/thumb.gif" class="games__section__game__thumb">
+            <div class="games__section__game__info">
+              <h2>Zombieline Zombieami</h2>
+              <div class="description">
+                Hotline Miami was cool. Maybe it could be cooler with zombies?
+              </div>
+              <div class="links">
+                <a href="https://gamejolt.com/games/zombieline-zombieami/94958" target="_blank">Check out on GameJolt</a>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="games__section drift inverted last">
+          <div class="games__section__game">
+            <img src="/assets/drift/screenshot1.png" class="games__section__game__thumb">
+            <div class="games__section__game__info">
+              <h2>Drift</h2>
+              <div class="description">
+                Drifting, vaping, minimal techno.
+                An unexpected combo like pineapple and pizza, but just as good.
+              </div>
+              <div class="links"></div>
+            </div>
+          </div>
+        </div>
+
+        <!-- <div class="games__section murk">
+          <div class="games__section__game">
+            <img src="/assets/murk/thumb.png" class="games__section__game__thumb">
+            <div class="games__section__game__info">
+              <h2>Murk</h2>
+              <div class="description">
+                
+              </div>
+              <div class="links">
+                <a href="https://gamejolt.com/games/murk/92990" target="_blank">Check out on GameJolt</a><br>
+                <a href="https://music.amazon.com.au/artists/B08FHBMW58/lebtr" target="_blank">Music by Lebtr</a>
+              </div>
+            </div>
+          </div>
+        </div> -->
+      </div>
+    </div>
+
+    <script type="module" src="/main.js"></script>
+  </body>
+</html>
--- a/main.js
+++ b/main.js
@@ -0,0 +1,2 @@
+import './style.scss'
+import 'reset-css'
--- a/package-lock.json
+++ b/package-lock.json
@@ -0,0 +1,383 @@
+{
+  "name": "games.anatolykopyl.ru",
+  "version": "0.0.0",
+  "lockfileVersion": 1,
+  "requires": true,
+  "dependencies": {
+    "anymatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz",
+      "integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==",
+      "dev": true,
+      "requires": {
+        "normalize-path": "^3.0.0",
+        "picomatch": "^2.0.4"
+      }
+    },
+    "binary-extensions": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
+      "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
+      "dev": true
+    },
+    "braces": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
+      "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+      "dev": true,
+      "requires": {
+        "fill-range": "^7.0.1"
+      }
+    },
+    "chokidar": {
+      "version": "3.5.2",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.2.tgz",
+      "integrity": "sha512-ekGhOnNVPgT77r4K/U3GDhu+FQ2S8TnK/s2KbIGXi0SZWuwkZ2QNyfWdZW+TVfn84DpEP7rLeCt2UI6bJ8GwbQ==",
+      "dev": true,
+      "requires": {
+        "anymatch": "~3.1.2",
+        "braces": "~3.0.2",
+        "fsevents": "~2.3.2",
+        "glob-parent": "~5.1.2",
+        "is-binary-path": "~2.1.0",
+        "is-glob": "~4.0.1",
+        "normalize-path": "~3.0.0",
+        "readdirp": "~3.6.0"
+      }
+    },
+    "esbuild": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.13.12.tgz",
+      "integrity": "sha512-vTKKUt+yoz61U/BbrnmlG9XIjwpdIxmHB8DlPR0AAW6OdS+nBQBci6LUHU2q9WbBobMEIQxxDpKbkmOGYvxsow==",
+      "dev": true,
+      "requires": {
+        "esbuild-android-arm64": "0.13.12",
+        "esbuild-darwin-64": "0.13.12",
+        "esbuild-darwin-arm64": "0.13.12",
+        "esbuild-freebsd-64": "0.13.12",
+        "esbuild-freebsd-arm64": "0.13.12",
+        "esbuild-linux-32": "0.13.12",
+        "esbuild-linux-64": "0.13.12",
+        "esbuild-linux-arm": "0.13.12",
+        "esbuild-linux-arm64": "0.13.12",
+        "esbuild-linux-mips64le": "0.13.12",
+        "esbuild-linux-ppc64le": "0.13.12",
+        "esbuild-netbsd-64": "0.13.12",
+        "esbuild-openbsd-64": "0.13.12",
+        "esbuild-sunos-64": "0.13.12",
+        "esbuild-windows-32": "0.13.12",
+        "esbuild-windows-64": "0.13.12",
+        "esbuild-windows-arm64": "0.13.12"
+      }
+    },
+    "esbuild-android-arm64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-android-arm64/-/esbuild-android-arm64-0.13.12.tgz",
+      "integrity": "sha512-TSVZVrb4EIXz6KaYjXfTzPyyRpXV5zgYIADXtQsIenjZ78myvDGaPi11o4ZSaHIwFHsuwkB6ne5SZRBwAQ7maw==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-darwin-64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-darwin-64/-/esbuild-darwin-64-0.13.12.tgz",
+      "integrity": "sha512-c51C+N+UHySoV2lgfWSwwmlnLnL0JWj/LzuZt9Ltk9ub1s2Y8cr6SQV5W3mqVH1egUceew6KZ8GyI4nwu+fhsw==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-darwin-arm64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.13.12.tgz",
+      "integrity": "sha512-JvAMtshP45Hd8A8wOzjkY1xAnTKTYuP/QUaKp5eUQGX+76GIie3fCdUUr2ZEKdvpSImNqxiZSIMziEiGB5oUmQ==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-freebsd-64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-freebsd-64/-/esbuild-freebsd-64-0.13.12.tgz",
+      "integrity": "sha512-r6On/Skv9f0ZjTu6PW5o7pdXr8aOgtFOEURJZYf1XAJs0IQ+gW+o1DzXjVkIoT+n1cm3N/t1KRJfX71MPg/ZUA==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-freebsd-arm64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.13.12.tgz",
+      "integrity": "sha512-F6LmI2Q1gii073kmBE3NOTt/6zLL5zvZsxNLF8PMAwdHc+iBhD1vzfI8uQZMJA1IgXa3ocr3L3DJH9fLGXy6Yw==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-linux-32": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-32/-/esbuild-linux-32-0.13.12.tgz",
+      "integrity": "sha512-U1UZwG3UIwF7/V4tCVAo/nkBV9ag5KJiJTt+gaCmLVWH3bPLX7y+fNlhIWZy8raTMnXhMKfaTvWZ9TtmXzvkuQ==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-linux-64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.13.12.tgz",
+      "integrity": "sha512-YpXSwtu2NxN3N4ifJxEdsgd6Q5d8LYqskrAwjmoCT6yQnEHJSF5uWcxv783HWN7lnGpJi9KUtDvYsnMdyGw71Q==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-linux-arm": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-arm/-/esbuild-linux-arm-0.13.12.tgz",
+      "integrity": "sha512-SyiT/JKxU6J+DY2qUiSLZJqCAftIt3uoGejZ0HDnUM2MGJqEGSGh7p1ecVL2gna3PxS4P+j6WAehCwgkBPXNIw==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-linux-arm64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-arm64/-/esbuild-linux-arm64-0.13.12.tgz",
+      "integrity": "sha512-sgDNb8kb3BVodtAlcFGgwk+43KFCYjnFOaOfJibXnnIojNWuJHpL6aQJ4mumzNWw8Rt1xEtDQyuGK9f+Y24jGA==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-linux-mips64le": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.13.12.tgz",
+      "integrity": "sha512-qQJHlZBG+QwVIA8AbTEtbvF084QgDi4DaUsUnA+EolY1bxrG+UyOuGflM2ZritGhfS/k7THFjJbjH2wIeoKA2g==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-linux-ppc64le": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.13.12.tgz",
+      "integrity": "sha512-2dSnm1ldL7Lppwlo04CGQUpwNn5hGqXI38OzaoPOkRsBRWFBozyGxTFSee/zHFS+Pdh3b28JJbRK3owrrRgWNw==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-netbsd-64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-netbsd-64/-/esbuild-netbsd-64-0.13.12.tgz",
+      "integrity": "sha512-D4raxr02dcRiQNbxOLzpqBzcJNFAdsDNxjUbKkDMZBkL54Z0vZh4LRndycdZAMcIdizC/l/Yp/ZsBdAFxc5nbA==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-openbsd-64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-openbsd-64/-/esbuild-openbsd-64-0.13.12.tgz",
+      "integrity": "sha512-KuLCmYMb2kh05QuPJ+va60bKIH5wHL8ypDkmpy47lzwmdxNsuySeCMHuTv5o2Af1RUn5KLO5ZxaZeq4GEY7DaQ==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-sunos-64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-sunos-64/-/esbuild-sunos-64-0.13.12.tgz",
+      "integrity": "sha512-jBsF+e0woK3miKI8ufGWKG3o3rY9DpHvCVRn5eburMIIE+2c+y3IZ1srsthKyKI6kkXLvV4Cf/E7w56kLipMXw==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-windows-32": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-windows-32/-/esbuild-windows-32-0.13.12.tgz",
+      "integrity": "sha512-L9m4lLFQrFeR7F+eLZXG82SbXZfUhyfu6CexZEil6vm+lc7GDCE0Q8DiNutkpzjv1+RAbIGVva9muItQ7HVTkQ==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-windows-64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-windows-64/-/esbuild-windows-64-0.13.12.tgz",
+      "integrity": "sha512-k4tX4uJlSbSkfs78W5d9+I9gpd+7N95W7H2bgOMFPsYREVJs31+Q2gLLHlsnlY95zBoPQMIzHooUIsixQIBjaQ==",
+      "dev": true,
+      "optional": true
+    },
+    "esbuild-windows-arm64": {
+      "version": "0.13.12",
+      "resolved": "https://registry.npmjs.org/esbuild-windows-arm64/-/esbuild-windows-arm64-0.13.12.tgz",
+      "integrity": "sha512-2tTv/BpYRIvuwHpp2M960nG7uvL+d78LFW/ikPItO+2GfK51CswIKSetSpDii+cjz8e9iSPgs+BU4o8nWICBwQ==",
+      "dev": true,
+      "optional": true
+    },
+    "fill-range": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
+      "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+      "dev": true,
+      "requires": {
+        "to-regex-range": "^5.0.1"
+      }
+    },
+    "fsevents": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+      "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+      "dev": true,
+      "optional": true
+    },
+    "function-bind": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
+      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==",
+      "dev": true
+    },
+    "glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "dev": true,
+      "requires": {
+        "is-glob": "^4.0.1"
+      }
+    },
+    "has": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
+      "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
+      "dev": true,
+      "requires": {
+        "function-bind": "^1.1.1"
+      }
+    },
+    "is-binary-path": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+      "dev": true,
+      "requires": {
+        "binary-extensions": "^2.0.0"
+      }
+    },
+    "is-core-module": {
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.8.0.tgz",
+      "integrity": "sha512-vd15qHsaqrRL7dtH6QNuy0ndJmRDrS9HAM1CAiSifNUFv4x1a0CCVsj18hJ1mShxIG6T2i1sO78MkP56r0nYRw==",
+      "dev": true,
+      "requires": {
+        "has": "^1.0.3"
+      }
+    },
+    "is-extglob": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
+      "dev": true
+    },
+    "is-glob": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
+      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "dev": true,
+      "requires": {
+        "is-extglob": "^2.1.1"
+      }
+    },
+    "is-number": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "dev": true
+    },
+    "nanoid": {
+      "version": "3.1.30",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz",
+      "integrity": "sha512-zJpuPDwOv8D2zq2WRoMe1HsfZthVewpel9CAvTfc/2mBD1uUT/agc5f7GHGWXlYkFvi1mVxe4IjvP2HNrop7nQ==",
+      "dev": true
+    },
+    "normalize-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+      "dev": true
+    },
+    "path-parse": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
+      "dev": true
+    },
+    "picocolors": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
+      "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
+      "dev": true
+    },
+    "picomatch": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
+      "integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==",
+      "dev": true
+    },
+    "postcss": {
+      "version": "8.3.11",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.11.tgz",
+      "integrity": "sha512-hCmlUAIlUiav8Xdqw3Io4LcpA1DOt7h3LSTAC4G6JGHFFaWzI6qvFt9oilvl8BmkbBRX1IhM90ZAmpk68zccQA==",
+      "dev": true,
+      "requires": {
+        "nanoid": "^3.1.30",
+        "picocolors": "^1.0.0",
+        "source-map-js": "^0.6.2"
+      }
+    },
+    "readdirp": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "dev": true,
+      "requires": {
+        "picomatch": "^2.2.1"
+      }
+    },
+    "reset-css": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/reset-css/-/reset-css-5.0.1.tgz",
+      "integrity": "sha512-VyuJdNFfp5x/W6e5wauJM59C02Vs0P22sxzZGhQMPaqu/NGTeFxlBFOOw3eq9vQd19gIDdZp7zi89ylyKOJ33Q=="
+    },
+    "resolve": {
+      "version": "1.20.0",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz",
+      "integrity": "sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==",
+      "dev": true,
+      "requires": {
+        "is-core-module": "^2.2.0",
+        "path-parse": "^1.0.6"
+      }
+    },
+    "rollup": {
+      "version": "2.59.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.59.0.tgz",
+      "integrity": "sha512-l7s90JQhCQ6JyZjKgo7Lq1dKh2RxatOM+Jr6a9F7WbS9WgKbocyUSeLmZl8evAse7y96Ae98L2k1cBOwWD8nHw==",
+      "dev": true,
+      "requires": {
+        "fsevents": "~2.3.2"
+      }
+    },
+    "sass": {
+      "version": "1.43.4",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.43.4.tgz",
+      "integrity": "sha512-/ptG7KE9lxpGSYiXn7Ar+lKOv37xfWsZRtFYal2QHNigyVQDx685VFT/h7ejVr+R8w7H4tmUgtulsKl5YpveOg==",
+      "dev": true,
+      "requires": {
+        "chokidar": ">=3.0.0 <4.0.0"
+      }
+    },
+    "source-map-js": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-0.6.2.tgz",
+      "integrity": "sha512-/3GptzWzu0+0MBQFrDKzw/DvvMTUORvgY6k6jd/VS6iCR4RDTKWH6v6WPwQoUO8667uQEf9Oe38DxAYWY5F/Ug==",
+      "dev": true
+    },
+    "to-regex-range": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "dev": true,
+      "requires": {
+        "is-number": "^7.0.0"
+      }
+    },
+    "vite": {
+      "version": "2.6.13",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-2.6.13.tgz",
+      "integrity": "sha512-+tGZ1OxozRirTudl4M3N3UTNJOlxdVo/qBl2IlDEy/ZpTFcskp+k5ncNjayR3bRYTCbqSOFz2JWGN1UmuDMScA==",
+      "dev": true,
+      "requires": {
+        "esbuild": "^0.13.2",
+        "fsevents": "~2.3.2",
+        "postcss": "^8.3.8",
+        "resolve": "^1.20.0",
+        "rollup": "^2.57.0"
+      }
+    }
+  }
+}
--- a/package.json
+++ b/package.json
@@ -0,0 +1,16 @@
+{
+  "name": "games.anatolykopyl.ru",
+  "version": "0.0.0",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "serve": "vite preview"
+  },
+  "devDependencies": {
+    "sass": "^1.43.4",
+    "vite": "^2.6.4"
+  },
+  "dependencies": {
+    "reset-css": "^5.0.1"
+  }
+}
--- a/style.scss
+++ b/style.scss
@@ -0,0 +1,165 @@
+$clr-text: #171c20;
+
+#app {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: $clr-text;
+  font-size: 16px;
+  line-height: 24px;
+
+  h1 {
+    font-size: 32px;
+    line-height: 32px;
+    font-weight: 900;
+  }
+
+  h2 {
+    font-size: 32px;
+    font-weight: 700;
+  }
+
+  a {
+    cursor: pointer;
+    color: inherit;
+    text-decoration-style: dotted;
+    text-underline-offset: 3px;
+  }
+}
+
+.title {
+  position: relative;
+  padding: 64px 0;
+  background-color: #F3B61F;
+  //box-shadow: 0px 10px 20px rgba(19, 19, 19, 0.897);
+  box-shadow: 0 5px 0 $clr-text;
+  z-index: 200;
+}
+
+.games {
+  position: relative;
+  z-index: 100;
+
+  &__section {
+    position: relative;
+
+    &.stroll {
+      background-color: rgb(58, 58, 58);
+      color: white;
+    }
+
+    &.mwg {
+      background-color: rgb(244, 244, 244);
+    }
+
+    &.zombieline {
+      background-color: rgb(241, 138, 255);
+      // background-color: rgb(241, 255, 115);
+    }
+
+    &.drift {
+      background-color: rgb(79, 219, 191);
+    }
+
+    // &.murk {
+    //   background-color: rgb(211, 211, 211);
+    // }
+
+    &::before, &::after {
+      position: absolute;
+      content: "";
+      z-index: -10;
+      width: 100%;
+      height: 100%;
+      top: 0;
+      left: 0;
+      background-color: inherit;
+      transform-origin: top left;
+    }
+
+    &::before {
+      transform: skewY(-2deg);
+    }
+
+    &::after {
+      transform: skewY(2deg);
+    }
+
+    &__game {
+      position: relative;
+      max-width: 1024px;
+      margin: auto;
+      padding: 64px 0;
+      display: flex;
+      flex-direction: row-reverse;
+
+      &__thumb {
+        width: 480px;
+        max-width: 90%;
+        display: block;
+        border-radius: 24px;
+        border: 2px solid $clr-text;
+        box-shadow: 5px 5px 0 $clr-text;
+      }
+
+      &__info {
+        text-align: center;
+        width: -webkit-fill-available;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        padding: 0 64px;
+
+        .description {
+          opacity: .7;
+        }
+
+        .links {
+          > * {
+            margin: 0 8px;
+          }
+        }
+      }
+    }
+  }
+
+  &__section.inverted {
+    z-index: -20;
+    padding: 48px 0;
+
+    &::before, &::after {
+      display: none;
+    }
+
+    .games__section__game {
+      flex-direction: row;
+    }
+  }
+
+  &__section.last {
+    &::after {
+      display: none;
+    }
+  }
+}
+
+@media screen and (max-width: 1024px) {
+  .games__section__game {
+    flex-direction: column !important;
+    align-items: center;
+    padding: 32px 0;
+
+    &__thumb {
+      margin-bottom: 32px;
+    }
+
+    &__info {
+      padding: 0 8px;
+
+      > * {
+        margin-top: 16px;
+      }
+    }
+  }
+}