getatopic · lsvs · Mar 27, 2021 · Mar 28, 2021 · Mar 28, 2021 · Mar 28, 2021
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,9 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 4
+end_of_line = crlf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,5 @@
+.vercel
+.DS_Store
+.cache
+dist
+node_modules
diff --git a/README.md b/README.md
@@ -0,0 +1,9 @@
+# getatopic.com website
+
+[getatopic.com](https://getatopic.com) offers resources for English language learning
+1. Random discussion topics tailored for use in speaking clubs and conversation practice
+2. Taboo game where participants describe words without using restricted terms
+
+![Get a topic](/img/og.png)
+
+The website is a really simple fully static HTML/CSS/JavaScript, built without the use of bundlers or similar tools
diff --git a/about/index.html b/about/index.html
@@ -0,0 +1,105 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>About — Get a topic</title>
+    <meta name="description" content="Learn more about the creators and contributors of the getatopic.com website." />
+    <meta name="keywords"
+        content="about, creators, contributors, get a topic, random topics, discussion, English, learning" />
+    <meta property="og:title" content="About Get a Topic" />
+    <meta property="og:description" content="Random topics for discussion in English" />
+    <meta property="og:image" content="https://getatopic.com/img/og.png" />
+    <meta property="og:url" content="/" />
+    <meta name="twitter:card" content="summary_large_image" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
+    <link rel="stylesheet" href="../css/styles.css" />
+    <!-- Google tag (gtag.js) -->
+    <script async src="https://www.googletagmanager.com/gtag/js?id=G-HR8F9XFT6D"></script>
+    <script>
+        window.dataLayer = window.dataLayer || []
+        function gtag() { dataLayer.push(arguments) }
+        gtag('js', new Date())
+
+        gtag('config', 'G-HR8F9XFT6D');
+    </script>
+</head>
+
+<body>
+    <nav class="menu">
+        <button>
+            <span>Open menu</span>
+        </button>
+        <div class="menu__block">
+            <a href="/" class="accent">Get a Topic</a>
+            <a href="/taboo" class="accent">Taboo</a>
+            <a href="https://t.me/getatopic_bot" class="text" target="_blank">Telegram Bot</a>
+            <a href="/about" class="text active">About</a>
+        </div>
+    </nav>
+    <div class="about">
+        <section>
+            <h1 class="topic">Hi <img src="../img/peace.png" style="width: 1.15em; margin: -.33em 0;" /></h1>
+            <p class="topic">This site created by a group of friends who study English and practice it in their
+                speaking club (almost) every week.</p>
+        </section>
+        <section class="grid_3">
+            <a href="https://www.facebook.com/sergey.kozlov.25/" target="_blank" rel="noreferrer nofollower"
+                class="person text">
+                <img src="/about/sergeykozlov.jpg" alt="Sergey Kozlov Emoji">Sergey Kozlov
+            </a>
+            <a href="https://lisovskiy.work" target="_blank" class="person text">
+                <img src="/about/sergeylisovskiy.jpg" alt="Sergey Lisovskiy Emoji">Sergey Lisovskiy
+            </a>
+            <a href="https://www.facebook.com/lukashov.vova" target="_blank" rel="noreferrer nofollower"
+                class="person text">
+                <img src="/about/vovalukashov.jpg" alt="Vova Lukashov Emoji">Vova Lukashov
+            </a>
+        </section>
+        <section class="grid_2">
+            <div class="accent">Credits</div>
+            <div>
+                <div class="credits text">
+                    <div>Idea</div>
+                    <div><a href="https://www.facebook.com/sergey.kozlov.25/" target="_blank"
+                            rel="noreferrer nofollower">Sergey Kozlov</a></div>
+                    <div>Design</div>
+                    <div><a href="https://lisovskiy.work" target="_blank">Sergey
+                            Lisovskiy</a></div>
+                    <div>Development</div>
+                    <div>
+                        <a href="https://www.facebook.com/sergey.kozlov.25/" target="_blank"
+                            rel="noreferrer nofollower">Sergey Kozlov</a>,
+                        <a href="https://lisovskiy.work" target="_blank">Sergey
+                            Lisovskiy</a>
+                    </div>
+                    <div>Telegram bot</div>
+                    <div><a href="https://www.facebook.com/lukashov.vova" target="_blank"
+                            rel="noreferrer nofollower">Vova Lukashov</a></div>
+                    <div>3D Hands</div>
+                    <div><a href="https://www.behance.net/gallery/111275801/Free-3D-HANDS-ICONS" target="_blank"
+                            rel="noreferrer nofollower">Unnamed Human</a></div>
+                    <div>Font</div>
+                    <div><a href="https://velvetyne.fr/fonts/sporting-grotesque/" target="_blank"
+                            rel="noreferrer nofollower">Sporting grotesque</a> by Lucas Le Bihan, George
+                        Triantafyllakos, Maciej Połczyński</div>
+                    <div>Content</div>
+                    <div>Part of the cards for the taboo game were taken from the <a
+                            href="https://github.com/pato/taboo" target="_blank"
+                            rel="noreferrer nofollower">repository</a> of Pato Lankenau. Other cards and topics were
+                        collected from many different open communities on social networks</div>
+                </div>
+                <div class="accent">
+                    If you have any ideas feel free to <a href="mailto:yo@getatopic.com" target="_blank">contact us</a>
+                    <br><br><br><br><br>
+                    &copy;
+                    <script>document.write(new Date().getFullYear())</script>
+                </div>
+            </div>
+        </section>
+    </div>
+</body>
+
+</html>
diff --git a/about/sergeykozlov.jpg b/about/sergeykozlov.jpg
diff --git a/about/sergeylisovskiy.jpg b/about/sergeylisovskiy.jpg
diff --git a/about/vovalukashov.jpg b/about/vovalukashov.jpg