1 files changed, 142 insertions, 0 deletions
diff --git a/rannak/mangud/perenaine/memori/index.html b/rannak/mangud/perenaine/memori/index.html
new file mode 100644
index 0000000..c19c7d5
--- /dev/null
+++ b/rannak/mangud/perenaine/memori/index.html
@@ -0,0 +1,142 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+
+  <title>Memori</title>
+
+  <link rel="stylesheet" href="style.css">
+  <!-- Bootstrap - CSS only -->
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
+</head>
+<body>
+
+  <div class="left">
+	<div class="left-text">
+	  <h1>Memori</h1>
+	  <p>Mängu läbimiseks leia üles kõik kümme paari</p>
+	</div>
+  </div>
+
+  <section class="memory-game">
+
+    <div class="memory-card" data-framework="butter">
+      <img class="front-face" src="img/butter.svg" alt="Butter" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="butter">
+      <img class="front-face" src="img/butter.svg" alt="Butter" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+
+    <div class="memory-card" data-framework="tikud">
+      <img class="front-face" src="img/tikud.svg" alt="tikud" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="tikud">
+      <img class="front-face" src="img/tikud.svg" alt="Tikud" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+
+    <div class="memory-card" data-framework="alko">
+      <img class="front-face" src="img/alko.svg" alt="Alko" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="alko">
+      <img class="front-face" src="img/alko.svg" alt="Alko" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+
+    <div class="memory-card" data-framework="jahu">
+      <img class="front-face" src="img/jahu.svg" alt="Jahu" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="jahu">
+      <img class="front-face" src="img/jahu.svg" alt="Jahu" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+
+    <div class="memory-card" data-framework="pasta">
+      <img class="front-face" src="img/pasta.svg" alt="Pasta" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="pasta">
+      <img class="front-face" src="img/pasta.svg" alt="Pasta" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+
+    <div class="memory-card" data-framework="pesu">
+      <img class="front-face" src="img/pesu.svg" alt="Pesu" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="pesu">
+      <img class="front-face" src="img/pesu.svg" alt="Pesu" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+
+    <div class="memory-card" data-framework="riis">
+      <img class="front-face" src="img/riis.svg" alt="Riis" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="riis">
+      <img class="front-face" src="img/riis.svg" alt="Riis" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+
+    <div class="memory-card" data-framework="sokid">
+      <img class="front-face" src="img/sokid.svg" alt="Sokid" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="sokid">
+      <img class="front-face" src="img/sokid.svg" alt="sokid" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+
+    <div class="memory-card" data-framework="sool">
+      <img class="front-face" src="img/sool.svg" alt="Sool" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="sool">
+      <img class="front-face" src="img/sool.svg" alt="Sool" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+
+    <div class="memory-card" data-framework="suhkur">
+      <img class="front-face" src="img/suhkur.svg" alt="suhkur" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+    <div class="memory-card" data-framework="suhkur">
+      <img class="front-face" src="img/suhkur.svg" alt="suhkur" />
+      <img class="back-face" src="img/taga.svg" alt="taga" />
+    </div>
+
+  </section>
+
+  <div class="right row align-items-center text-center">
+      <div class="col">
+          <a href="" class="btn-success btn disabled" role="button" aria-disabled="true">Liigu Edasi</a>
+      </div>
+  </div>
+
+  <script src="script.js"></script>
+</body>
+</html>