kunjgit · Saipradyumnagoud · May 28, 2024 · May 28, 2024 · May 28, 2024 · May 28, 2024
diff --git a/Games/Flames-game/README.md b/Games/Flames-game/README.md
@@ -0,0 +1,62 @@
+# FLAMES Game
+
+This is a simple FLAMES game built using HTML, CSS, and JavaScript. The FLAMES game takes two names as input and calculates the relationship between them based on the FLAMES logic.
+
+## Table of Contents
+
+- [Introduction](#introduction)
+- [Features](#features)
+- [Installation](#installation)
+- [Usage](#usage)
+- [Technologies Used](#technologies-used)
+- [License](#license)
+
+## Introduction
+
+The FLAMES game is a fun and simple game to determine the type of relationship between two people based on their names. FLAMES stands for Friends, Lovers, Affectionate, Marriage, Enemies, and Siblings. This project provides an interactive interface where users can input two names and see the result of their relationship.
+
+## Features
+
+- Interactive flip card UI with a toggle switch
+- Responsive design
+- Easy to use
+- Instant calculation of FLAMES result
+
+## Installation
+
+To get a local copy of this project up and running, follow these simple steps:
+
+1. Clone the repository:
+
+    ```bash
+    git clone https://github.com/yourusername/flames-game.git
+    ```
+
+2. Navigate to the project directory:
+
+    ```bash
+    cd flames-game
+    ```
+
+## Usage
+
+1. Open the `index.html` file in your preferred web browser.
+
+2. Enter your name and your crush's name in the respective input fields.
+
+3. Click on the "Calculate" button.
+
+4. The result of the FLAMES game will be displayed below the input fields.
+
+## Technologies Used
+
+- HTML
+- CSS
+- JavaScript
+
+##screenshots
+![image](https://github.com/Saipradyumnagoud/GameZone/assets/143107589/a36fbc47-7c58-48e0-bb3d-e5fb6d02e061)
+
+## License
+
+This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for more information.
diff --git a/Games/Flames-game/assets/images/Screenshot 2024-05-28 214451.png b/Games/Flames-game/assets/images/Screenshot 2024-05-28 214451.png
diff --git a/Games/Flames-game/index.html b/Games/Flames-game/index.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>FLAMES Game</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <div class="wrapper">
+        <div class="card-switch">
+            <label class="switch">
+                <div class="flip-card__inner">
+                    <div class="flip-card__front">
+                        <div class="title">FLAMES Game</div>
+                        <form id="flamesForm" class="flip-card__form">
+                            <input class="flip-card__input" id="name1" placeholder="Your Name" type="text" required>
+                            <input class="flip-card__input" id="name2" placeholder="Crush's Name" type="text" required>
+                            <button class="flip-card__btn">Calculate</button>
+                        </form>
+                        <div id="result" class="result"></div>
+                    </div>
+                </div>
+            </label>
+        </div>   
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Games/Flames-game/script.js b/Games/Flames-game/script.js
@@ -0,0 +1,25 @@
+document.getElementById('flamesForm').addEventListener('submit', function (e) {
+    e.preventDefault();
+
+    const name1 = document.getElementById('name1').value.toLowerCase().replace(/ /g, '');
+    const name2 = document.getElementById('name2').value.toLowerCase().replace(/ /g, '');
+
+    let name1Array = name1.split('');
+    let name2Array = name2.split('');
+
+    name1Array.forEach(char => {
+        const index = name2Array.indexOf(char);
+        if (index !== -1) {
+            name2Array.splice(index, 1);
+            name1Array.splice(name1Array.indexOf(char), 1);
+        }
+    });
+
+    const count = name1Array.length + name2Array.length;
+    const flames = ['Friends', 'Lovers', 'Affectionate', 'Marriage', 'Enemies', 'Siblings'];
+    let flamesIndex = count % flames.length;
+
+    const resultText = flamesIndex === 0 ? flames[flames.length - 1] : flames[flamesIndex - 1];
+
+    document.getElementById('result').innerText = `Result: ${resultText}`;
+});
diff --git a/Games/Flames-game/style.css b/Games/Flames-game/style.css
@@ -0,0 +1,203 @@
+body {
+    font-family: Arial, sans-serif;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    margin: 0;
+    background-color: #f0f0f0;
+}
+
+.wrapper {
+  --input-focus: #2d8cf0;
+  --font-color: #323232;
+  --font-color-sub: #666;
+  --bg-color: #fff;
+  --bg-color-alt: #666;
+  --main-color: #323232;
+}
+
+.switch {
+  transform: translateY(-200px);
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 30px;
+  width: 50px;
+  height: 20px;
+}
+
+.card-side::before {
+  position: absolute;
+  content: 'FLAMES Game';
+  left: -120px;
+  top: 0;
+  width: 200px;
+  text-decoration: underline;
+  color: var(--font-color);
+  font-weight: 600;
+}
+
+.card-side::after {
+  position: absolute;
+  content: '';
+  left: 70px;
+  top: 0;
+  width: 100px;
+  text-decoration: none;
+  color: var(--font-color);
+  font-weight: 600;
+}
+
+.toggle {
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+.slider {
+  box-sizing: border-box;
+  border-radius: 5px;
+  border: 2px solid var(--main-color);
+  box-shadow: 4px 4px var(--main-color);
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: var(--bg-colorcolor);
+  transition: 0.3s;
+}
+
+.slider:before {
+  box-sizing: border-box;
+  position: absolute;
+  content: "";
+  height: 20px;
+  width: 20px;
+  border: 2px solid var(--main-color);
+  border-radius: 5px;
+  left: -2px;
+  bottom: 2px;
+  background-color: var(--bg-color);
+  box-shadow: 0 3px 0 var(--main-color);
+  transition: 0.3s;
+}
+
+.toggle:checked + .slider {
+  background-color: var(--input-focus);
+}
+
+.toggle:checked + .slider:before {
+  transform: translateX(30px);
+}
+
+.toggle:checked ~ .card-side:before {
+  text-decoration: none;
+}
+
+.toggle:checked ~ .card-side:after {
+  text-decoration: underline;
+}
+
+.flip-card__inner {
+  width: 300px;
+  height: 350px;
+  position: relative;
+  background-color: transparent;
+  perspective: 1000px;
+  text-align: center;
+  transition: transform 0.8s;
+  transform-style: preserve-3d;
+}
+
+.toggle:checked ~ .flip-card__inner {
+  transform: rotateY(180deg);
+}
+
+.flip-card__front, .flip-card__back {
+  padding: 20px;
+  position: absolute;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  -webkit-backface-visibility: hidden;
+  backface-visibility: hidden;
+  background: lightgrey;
+  gap: 20px;
+  border-radius: 5px;
+  border: 2px solid var(--main-color);
+  box-shadow: 4px 4px var(--main-color);
+}
+
+.flip-card__back {
+  width: 100%;
+  transform: rotateY(180deg);
+}
+
+.flip-card__form {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 20px;
+}
+
+.title {
+  margin: 20px 0 20px 0;
+  font-size: 25px;
+  font-weight: 900;
+  text-align: center;
+  color: var(--main-color);
+}
+
+.flip-card__input {
+  width: 250px;
+  height: 40px;
+  border-radius: 5px;
+  border: 2px solid var(--main-color);
+  background-color: var(--bg-color);
+  box-shadow: 4px 4px var(--main-color);
+  font-size: 15px;
+  font-weight: 600;
+  color: var(--font-color);
+  padding: 5px 10px;
+  outline: none;
+}
+
+.flip-card__input::placeholder {
+  color: var(--font-color-sub);
+  opacity: 0.8;
+}
+
+.flip-card__input:focus {
+  border: 2px solid var(--input-focus);
+}
+
+.flip-card__btn:active, .button-confirm:active {
+  box-shadow: 0px 0px var(--main-color);
+  transform: translate(3px, 3px);
+}
+
+.flip-card__btn {
+  margin: 20px 0 20px 0;
+  width: 120px;
+  height: 40px;
+  border-radius: 5px;
+  border: 2px solid var(--main-color);
+  background-color: var(--bg-color);
+  box-shadow: 4px 4px var(--main-color);
+  font-size: 17px;
+  font-weight: 600;
+  color: var(--font-color);
+  cursor: pointer;
+}
+
+.result {
+  margin-top: 20px;
+  font-size: 20px;
+  font-weight: bold;
+  color: var(--main-color);
+}
diff --git a/Games/Flames_game b/Games/Flames_game
diff --git a/README.md b/README.md
@@ -112,7 +112,7 @@ This repository also provides one such platforms where contributers come over an
 
 | Game                                                                                                             | Game                                                                                                    | Game                                                                                                         | Game                                                                                                               | Game                                                                                                        |
 | ---------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------- |
-| [Master Typing](https://github.com/kunjgit/GameZone/tree/main/Games/Master_Typing)                               | [Tilting Maze](https://github.com/kunjgit/GameZone/tree/main/Games/Tilting_Maze)                        | [Simon Game Challenge](https://github.com/kunjgit/GameZone/tree/main/Games/Simon_Game_Challenge)             | [Snake Game](https://github.com/kunjgit/GameZone/tree/main/Games/Snake_Game)                                       | [Dino Runner Game](https://github.com/kunjgit/GameZone/tree/main/Games/Dino_Runner_Game)                    |
+|[Flames-Game](https://github.com/Saipradyumnagoud/GameZone/tree/main/Games/Flames-game) | [Master Typing](https://github.com/kunjgit/GameZone/tree/main/Games/Master_Typing)                               | [Tilting Maze](https://github.com/kunjgit/GameZone/tree/main/Games/Tilting_Maze)                        | [Simon Game Challenge](https://github.com/kunjgit/GameZone/tree/main/Games/Simon_Game_Challenge)             | [Snake Game](https://github.com/kunjgit/GameZone/tree/main/Games/Snake_Game)                                       | [Dino Runner Game](https://github.com/kunjgit/GameZone/tree/main/Games/Dino_Runner_Game)                    |
 | [Whack a Mole](https://github.com/kunjgit/GameZone/tree/main/Games/Whack_a_Mole)                                 | [Doraemon Jump](https://github.com/kunjgit/GameZone/tree/main/Games/Doraemon_Jump)                      | [Black Jack](https://github.com/kunjgit/GameZone/tree/main/Games/Black_Jack)                                 | [Memory Game](https://github.com/kunjgit/GameZone/tree/main/Games/Memory_Game)                                     | [Word Guessing Game](https://github.com/kunjgit/GameZone/tree/main/Games/Word_Guessing_Game)                |
 | [Ludo Game](https://github.com/kunjgit/GameZone/tree/main/Games/Ludo_Game)                                       | [Piano Game](https://github.com/kunjgit/GameZone/tree/main/Games/Piano)                                 | [Atari Breakout](https://github.com/kunjgit/GameZone/tree/main/Games/Atari_Breakout)                         | [Dinosaur Game](https://github.com/kunjgit/GameZone/tree/main/Games/Chrome_Dinosaur_Game)                          | [Guess The Colour by RGB Game](https://github.com/kunjgit/GameZone/tree/main/Games/Colour_Guessing_Game)    |
 | [Guess The Number](https://github.com/kunjgit/GameZone/tree/main/Games/Guess_The_Number)                         | [Race car game](https://github.com/kunjgit/GameZone/tree/main/Games/race_car)                           | [Aim Training](https://github.com/DP-NOTHING/GameZone/tree/contri/Games/Aim_Training)                        | [Alien Shooter](https://github.com/kunjgit/GameZone/tree/main/Games/Alien_Shooters)                                | [Fruit Ninja](https://github.com/kunjgit/GameZone/tree/main/Games/Fruit_Ninja)                              |
@@ -278,9 +278,7 @@ This repository also provides one such platforms where contributers come over an
 | [Arkanoid_Game](https://github.com/kunjgit/GameZone/tree/main/Games/Arkanoid_Game)               |
 | [Catch_Stars](https://github.com/Kunjgit/GameZone/tree/main/Games/Catch_Stars)               |
 | [LaserDarts] (https://github.com/Jagpreet153/GameZone/tree/main/Games/LaserDarts)
-| [Block Building](https://github.com/kunjgit/GameZone/tree/main/Games/Block_Building)                                 |
-
-
+| [Block Building](https://github.com/kunjgit/GameZone/tree/main/Games/Block_Building)                                 ||[Flames-Game](https://github.com/Saipradyumnagoud/GameZone/tree/main/Games/Flames-game) |
 
 
  </center>

diff --git a/assets/images/Flames-game.png b/assets/images/Flames-game.png