final commit

README.md

@@ -0,0 +1,44 @@
+<div align="center">
+
+# AS੯ames Collection
+
+<div>
+
+---
+
+<div align="center">
+
+<div align="left">
+
+## Purpose
+
+> This game lets you know how logical works in the game.
+
+---
+
+### How to play
+
+1. Click on green **Clone or download** button and choose Download ZIP.
+2. Find the downloaded zipped file on your pc and extract it.
+3. Go to **Web-Info** folder. Inside you will find a file named **index.html**.
+4. Double click on **index.html** file and your browser will open (or maybe just a new tab) and the game will start.
+5. If for whatever reason your browser does not open, right click on **index.html** file go down to **Open with**
+   and choose your web browser. This will open the browser and launch the game.
+
+Once you are done playing you can close the tab in your browser to quit the game.
+
+---
+
+</div>
+
+### Flappy Brid
+
+![Flappy Brid perview](assets/images/perview.gif "AS੯ames Collection")
+
+</div>
+
+> If you have any issues with the game feel free to let me know!
+
+> If you are more interested, check out the collection of [ **AS੯ames**](https://github.com/DSDmark/ASGames "AS੯ames Collection").
+
+---

assets/css/style.css

@@ -0,0 +1,54 @@
+@charset "UTF-8";
+/* ============ GOOGEL FONTS ================= */
+/*
+  * ─── BODY TEXT */
+@import url("https://fonts.googleapis.com/css2?family=Concert+One&display=swap");
+/* ========= BASE ============== */
+html {
+  font-size: 62.5%;
+}
+
+*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+::-webkit-scrollbar {
+  display: none;
+}
+
+body {
+  font-family: "Concert One", cursive;
+  font-size: 1.5rem;
+  display: grid;
+  place-items: center;
+  min-height: 100vh;
+  text-transform: capitalize;
+  color: red;
+  background: linear-gradient(270deg, #000, #468944);
+}
+
+b {
+  background: #0f5809;
+}
+
+.gameDetail {
+  display: grid;
+  text-align: center;
+  padding: 1rem 2rem;
+  line-height: 2.5rem;
+  background: linear-gradient(168deg, #000, #70c86e);
+  box-shadow: 0 0 8rem 2rem rgba(126, 255, 90, 0.5);
+  border-radius: 0 0 20rem 20rem;
+  color: #b2ffba;
+  z-index: 100;
+}
+
+#canvas {
+  margin-top: 5rem;
+  width: 360px;
+  height: 660px;
+  box-shadow: 0 0 8rem 2rem rgba(126, 255, 90, 0.5);
+  border: 2px double #1c291c;
+}/*# sourceMappingURL=style.css.map */