18 files changed, 646 insertions, 69 deletions
diff --git a/rannak/mangud/partorg/kuulsused/index.html b/rannak/mangud/partorg/kuulsused/index.html
index 80fc8c9..4740414 100644
--- a/rannak/mangud/partorg/kuulsused/index.html
+++ b/rannak/mangud/partorg/kuulsused/index.html
@@ -13,7 +13,7 @@
 <body class="text-white">
 
     <div class="container text-center text-white align-items-center pb-5">
-        <h1 class="pb-1 pt-2">Olulised isikud</h1>
+        <h1 class="pb-1 pt-2">Kuulsused</h1>
         <p>Vii kokku inimese nimi ja nägu.</p>
 
 		<div class="row">
diff --git a/rannak/mangud/partorg/plakat.bak/img/avatar.png b/rannak/mangud/partorg/plakat.bak/img/avatar.png
new file mode 100644
index 0000000..485a70c
--- /dev/null
+++ b/rannak/mangud/partorg/plakat.bak/img/avatar.png
diff --git a/rannak/mangud/partorg/plakat/img/lenin.png b/rannak/mangud/partorg/plakat.bak/img/lenin.png
index e36df3d..e36df3d 100644
--- a/rannak/mangud/partorg/plakat/img/lenin.png
+++ b/rannak/mangud/partorg/plakat.bak/img/lenin.png
diff --git a/rannak/mangud/partorg/plakat/img/nazi.png b/rannak/mangud/partorg/plakat.bak/img/nazi.png
index 87e616e..87e616e 100644
--- a/rannak/mangud/partorg/plakat/img/nazi.png
+++ b/rannak/mangud/partorg/plakat.bak/img/nazi.png
diff --git a/rannak/mangud/partorg/plakat/img/normalSelect.cur b/rannak/mangud/partorg/plakat.bak/img/normalSelect.cur
index fdd943c..fdd943c 100644
--- a/rannak/mangud/partorg/plakat/img/normalSelect.cur
+++ b/rannak/mangud/partorg/plakat.bak/img/normalSelect.cur
diff --git a/rannak/mangud/partorg/plakat/img/redStar.png b/rannak/mangud/partorg/plakat.bak/img/redStar.png
index b6eee79..b6eee79 100644
--- a/rannak/mangud/partorg/plakat/img/redStar.png
+++ b/rannak/mangud/partorg/plakat.bak/img/redStar.png
diff --git a/rannak/mangud/partorg/plakat.bak/img/stalin.jpg b/rannak/mangud/partorg/plakat.bak/img/stalin.jpg
new file mode 100644
index 0000000..bc0a3a5
--- /dev/null
+++ b/rannak/mangud/partorg/plakat.bak/img/stalin.jpg
diff --git a/rannak/mangud/partorg/plakat/img/stalinAddOn.png b/rannak/mangud/partorg/plakat.bak/img/stalinAddOn.png
index d3e05fd..d3e05fd 100644
--- a/rannak/mangud/partorg/plakat/img/stalinAddOn.png
+++ b/rannak/mangud/partorg/plakat.bak/img/stalinAddOn.png
diff --git a/rannak/mangud/partorg/plakat.bak/img/testImg.jpg b/rannak/mangud/partorg/plakat.bak/img/testImg.jpg
new file mode 100644
index 0000000..d88d950
--- /dev/null
+++ b/rannak/mangud/partorg/plakat.bak/img/testImg.jpg
diff --git a/rannak/mangud/partorg/plakat.bak/img/veekogud.jpg b/rannak/mangud/partorg/plakat.bak/img/veekogud.jpg
new file mode 100644
index 0000000..23f04ab
--- /dev/null
+++ b/rannak/mangud/partorg/plakat.bak/img/veekogud.jpg
diff --git a/rannak/mangud/partorg/plakat.bak/index.html b/rannak/mangud/partorg/plakat.bak/index.html
new file mode 100644
index 0000000..4754c9b
--- /dev/null
+++ b/rannak/mangud/partorg/plakat.bak/index.html
@@ -0,0 +1,125 @@
+<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>Plakat</title>
+    <!-- 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">
+
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <section class="wrapper">
+
+        <div id="toolbar">
+
+          <div class="intro">
+            <h1>Kujunda Plakatit</h1>
+            <p>Vali välja üks plakat ja muuda/lisa selle kujundust vastavalt enda äranägemisele.</p>
+            <button class="moveOn" disabled>Liigu Edasi</button>
+
+            <!-- Button trigger modal -->
+            <button type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal">
+              Sissejuhatus
+            </button>
+
+            <button id="clear">Puhasta</button>
+          </div>
+
+          <div class="inputs">
+            <form>
+              <p class="toolbarDiv">
+                <label for="stroke">Värv</label>
+                <input id="stroke" name='stroke' type="color">
+              </p>
+
+              <p class="toolbarDiv">
+                <label for="lineWidth">Joone Paksus</label>
+                <input id="lineWidth" name='lineWidth' type="number" value="5" maxlength="1">
+              </p>
+
+              <!--
+              <button id="clear">Puhasta</button>
+              -->
+            </form>
+          </div>
+
+
+
+          <!-- Image Pick-->
+          <h2 class="ValiTxt"> Vali Plakat </h2>
+          <div class="pickingSec">
+            <img id="stalin"   class="pickImg picked" alt="Jossup Saloninjo Plakat" src="img/stalin.jpg"/>
+            <img id="veekogud" class="pickImg" alt="Veekogude Plakat" src="img/veekogud.jpg"/>
+            <img id="testing" class="pickImg" alt="Veekogude Plakat" src="img/testImg.jpg"/>
+          </div>
+
+
+          <!-- Add-Ons Pick
+          <h2 class="ValiTxt"> Vali Lisasid </h2>
+          <div class="pickingSec">
+            <img id="redStar" class="pickImg" alt="red star" src="img/redStar.png"/>
+            <img id="lenin" class="pickImg" alt="lenin" src="img/lenin.png"/>
+            <img id="nazi" class="pickImg" alt="Nazi Flag" src="img/nazi.png"/>
+            <img id="stalinAddOn" class="pickImg" alt="Stalin" src="img/stalinAddOn.png"/>
+          </div>
+          -->
+
+        </div>
+
+
+
+
+        <div class="canvasWrap">
+          <canvas id="drawing-board"></canvas>
+        </div>
+
+
+    </section>
+
+
+
+
+    <!-- Modal -->
+    <div class="modal fade text-black" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+      <div class="modal-dialog" role="document">
+        <div class="modal-content">
+
+          <div class="modal-header">
+            <div class="modalHeaderWrapper">
+              <h3 class="modal-title" id="myModalLabel">Sissejuhatus</h5>
+            </div>
+            <img class="avatar" alt="avatar" src="img/avatar.png"/>
+          </div>
+
+          <div class="modal-body">
+            
+            Peale ajalehe väljalõigete olen aastate jooksul kogunud ja säilitanud meeleolukaid plakateid nõukogudeaja kuldsest elust.
+            <br/>
+            Jagan siinkohal teiega, seltsimehed noored, nelja nendest. Plakatid on pärit erinevatest aastakümnetest: <br/>1950ndad, 1960ndad, 1970ndad ja 1980ndad aastad.
+            <br/>
+            <br/>
+            Palun uurige nende plakatite sisu ja vormi.
+            <br/>
+            Õppige, õppige, õppige! Kas tajute, millisesse kümnendisse iga plakat kuulub?
+            <br/> <br/>
+            <strong>
+            Mõelge plakatitele välja uus, kaasaega sobiv lööklause. Samuti kaunistage ja täiendage plakatit kaasaegsete kunsiliste detailidega. Ka huumor on lubatud!
+            </strong>
+
+          </div>
+
+        </div>
+      </div>
+    </div>
+
+
+
+
+    <script src="./main.js"></script>
+
+    <!-- JavaScript Bundle with Popper -->
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
+</body>
+</html>
diff --git a/rannak/mangud/partorg/plakat/main.js b/rannak/mangud/partorg/plakat.bak/main.js
index 9ae8e54..11809cb 100644
--- a/rannak/mangud/partorg/plakat/main.js
+++ b/rannak/mangud/partorg/plakat.bak/main.js
@@ -68,9 +68,11 @@ toolbar.addEventListener('click', e => {
     //Plakatid
     const stalinImg = document.getElementById("stalin");
     const veekogudImg = document.getElementById("veekogud");
+    const testing = document.getElementById("testing");
 
     pildid.push(stalinImg);
     pildid.push(veekogudImg);
+    pildid.push(testing);
 
 
    //Addons 
@@ -88,7 +90,7 @@ toolbar.addEventListener('click', e => {
 
 
 
-    if (e.target.id === "stalin" || e.target.id === "veekogud") {
+    if (e.target.id === "stalin" || e.target.id === "veekogud" || e.target.id === "testing") {
         for (el in pildid) {
             pildid[el].classList.remove("picked");
         }
diff --git a/rannak/mangud/partorg/plakat/style.css b/rannak/mangud/partorg/plakat.bak/style.css
index 215c073..215c073 100644
--- a/rannak/mangud/partorg/plakat/style.css
+++ b/rannak/mangud/partorg/plakat.bak/style.css
diff --git a/rannak/mangud/partorg/plakat/img/malev.jpg b/rannak/mangud/partorg/plakat/img/malev.jpg
new file mode 100644
index 0000000..d88d950
--- /dev/null
+++ b/rannak/mangud/partorg/plakat/img/malev.jpg
diff --git a/rannak/mangud/partorg/plakat/img/viisAastak.jpg b/rannak/mangud/partorg/plakat/img/viisAastak.jpg
new file mode 100644
index 0000000..20be6ed
--- /dev/null
+++ b/rannak/mangud/partorg/plakat/img/viisAastak.jpg
diff --git a/rannak/mangud/partorg/plakat/index.html b/rannak/mangud/partorg/plakat/index.html
index 9f1416b..e65040a 100644
--- a/rannak/mangud/partorg/plakat/index.html
+++ b/rannak/mangud/partorg/plakat/index.html
@@ -2,81 +2,38 @@
 <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>Plakat</title>
+    <meta name="viewport" content="width=, initial-scale=1.0">
+    <title>Plakatid</title>
     <!-- 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">
 
-    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="styles.css">
 </head>
-<body>
-    <section class="wrapper">
 
-        <div id="toolbar">
+<body class="text-white">
 
-          <div class="intro">
-            <h1>Kujunda Plakatit</h1>
-            <p>Vali välja üks plakat ja muuda/lisa selle kujundust vastavalt enda äranägemisele.</p>
-            <button class="moveOn" disabled>Liigu Edasi</button>
-
-            <!-- Button trigger modal -->
-            <button type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal">
-              Sissejuhatus
-            </button>
-
-            <button id="clear">Puhasta</button>
-          </div>
-
-          <div class="inputs">
-            <form>
-              <p class="toolbarDiv">
-                <label for="stroke">Värv</label>
-                <input id="stroke" name='stroke' type="color">
-              </p>
-
-              <p class="toolbarDiv">
-                <label for="lineWidth">Joone Paksus</label>
-                <input id="lineWidth" name='lineWidth' type="number" value="5" maxlength="1">
-              </p>
-
-              <!--
-              <button id="clear">Puhasta</button>
-              -->
-            </form>
-          </div>
-
-
-
-          <!-- Image Pick-->
-          <h2 class="ValiTxt"> Vali Plakat </h2>
-          <div class="pickingSec">
-            <img id="stalin"   class="pickImg picked" alt="Jossup Saloninjo Plakat" src="img/stalin.jpg"/>
-            <img id="veekogud" class="pickImg" alt="Veekogude Plakat" src="img/veekogud.jpg"/>
-          </div>
+    <div class="container text-center text-white align-items-center pb-5">
+        <h1>Plakatid</h1>
+        <p>Leia iga plakati õige ajastu, ning muuda ka plakati teksti.
+          <br/>
+          Kui oled valinud õige ajastu ja muutunud plakati lause, muutub see roheliseks,
+          näitamaks, et sellega on kõik korras.
+        </p>
 
+		<div class="row">
+	  	  <div>
+            <button class="moveOn" disabled>Liigu Edasi</button>
+	  	  </div>
 
-          <!-- Add-Ons Pick-->
-          <h2 class="ValiTxt"> Vali Lisasid </h2>
-          <div class="pickingSec">
-            <img id="redStar" class="pickImg" alt="red star" src="img/redStar.png"/>
-            <img id="lenin" class="pickImg" alt="lenin" src="img/lenin.png"/>
-            <img id="nazi" class="pickImg" alt="Nazi Flag" src="img/nazi.png"/>
-            <img id="stalinAddOn" class="pickImg" alt="Stalin" src="img/stalinAddOn.png"/>
-          </div>
-
-        </div>
-
-
-
-
-        <div class="canvasWrap">
-          <canvas id="drawing-board"></canvas>
-        </div>
-
+		</div>
 
-    </section>
+        <!-- Button trigger modal -->
+        <button type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal">
+          Sissejuhatus
+        </button>
 
 
+    </div>
 
 
     <!-- Modal -->
@@ -92,7 +49,6 @@
           </div>
 
           <div class="modal-body">
-            
             Peale ajalehe väljalõigete olen aastate jooksul kogunud ja säilitanud meeleolukaid plakateid nõukogudeaja kuldsest elust.
             <br/>
             Jagan siinkohal teiega, seltsimehed noored, nelja nendest. Plakatid on pärit erinevatest aastakümnetest: <br/>1950ndad, 1960ndad, 1970ndad ja 1980ndad aastad.
@@ -105,7 +61,6 @@
             <strong>
             Mõelge plakatitele välja uus, kaasaega sobiv lööklause. Samuti kaunistage ja täiendage plakatit kaasaegsete kunsiliste detailidega. Ka huumor on lubatud!
             </strong>
-
           </div>
 
         </div>
@@ -115,7 +70,188 @@
 
 
 
-    <script src="./main.js"></script>
+
+    <div class="main">
+        <nav>
+          <div class="nav nav-tabs" id="nav-tab" role="tablist">
+    
+            <button class="nav-link active" id="nav-60ndad-tab" data-bs-toggle="tab" data-bs-target="#nav-60ndad" type="button" role="tab" aria-controls="nav-60ndad" aria-selected="true">
+              Stalin
+            </button>
+    
+            <button class="nav-link" id="nav-70ndad-tab" data-bs-toggle="tab" data-bs-target="#nav-70ndad" type="button" role="tab" aria-controls="nav-70ndad" aria-selected="false">
+              Veekogud
+            </button>
+
+            <button class="nav-link" id="nav-90ndad-tab" data-bs-toggle="tab" data-bs-target="#nav-90ndad" type="button" role="tab" aria-controls="nav-90ndad" aria-selected="false">
+              Viisaastak
+            </button>
+    
+            <button class="nav-link" id="nav-80ndad-tab" data-bs-toggle="tab" data-bs-target="#nav-80ndad" type="button" role="tab" aria-controls="nav-80ndad" aria-selected="false">
+              Malev
+            </button>
+
+
+          </div>
+        </nav>
+
+        <div class="tab-content" id="nav-tabContent">
+
+    
+
+          <div class="tab-pane fade show active p-3 text-white" id="nav-60ndad" role="tabpanel" aria-labelledby="nav-60ndad-tab">
+              <div class="wrapper">
+
+                <div class="plakatWrapper stalin">
+                  <span class="addedText">Testing Testing</span>
+                </div>
+
+                <div class="innerWrapper">
+
+                  <select>
+                    <option disabled hidden selected>Vali</option>
+                    <option value="1950ndad">1950ndad</option>
+                    <option value="1960ndad">1960ndad</option>
+                    <option value="1960ndad">1970ndad</option>
+                    <option value="1970ndad">1980ndad</option>
+                  </select>
+
+                  <strong><label for="stalin">Lisa Tekst</label></strong>
+                  <input name="stalin" type="text" value=""/>
+                  <button class="muuda">Muuda</button>
+
+                  <div>
+                    <button class="ules">&uarr;</button>
+                    <button class="alla">&darr;</button>
+                    <button class="vasak">&larr;</button>
+                    <button class="parem">&rarr;</button>
+                  </div>
+
+                </div>
+
+            </div>
+          </div>
+
+
+    
+          <div class="tab-pane fade p-3 text-white" id="nav-70ndad" role="tabpanel" aria-labelledby="nav-70ndad-tab">
+              <div class="wrapper">
+
+                <div class="plakatWrapper veekogud">
+                  <span class="addedText">Veekogud</span>
+                </div>
+
+                <div class="innerWrapper">
+                  <select>
+                    <option disabled hidden selected>Vali</option>
+                    <option value="1950ndad">1950ndad</option>
+                    <option value="1960ndad">1960ndad</option>
+                    <option value="1960ndad">1970ndad</option>
+                    <option value="1970ndad">1980ndad</option>
+                  </select>
+
+                  <strong><label for="veekogud">Lisa Tekst</label></strong>
+                  <input name="veekogud" type="text" value=""/>
+                  <button class="muuda" >Muuda</button>
+                  
+                  <div>
+                    <button class="ules">&uarr;</button>
+                    <button class="alla">&darr;</button>
+                    <button class="vasak">&larr;</button>
+                    <button class="parem">&rarr;</button>
+                  </div>
+
+                </div>
+
+              </div>
+          </div>
+
+
+
+
+
+
+
+    
+          <div class="tab-pane fade p-3 text-white" id="nav-80ndad" role="tabpanel" aria-labelledby="nav-80ndad-tab">
+              <div class="wrapper">
+
+                <div class="plakatWrapper malev pikkPlakat">
+                  <span class="addedText">Malev</span>
+                </div>
+
+                <div class="innerWrapper">
+                  <select>
+                    <option disabled hidden selected>Vali</option>
+                    <option value="1950ndad">1950ndad</option>
+                    <option value="1960ndad">1960ndad</option>
+                    <option value="1960ndad">1970ndad</option>
+                    <option value="1970ndad">1980ndad</option>
+                  </select>
+
+                  <strong><label for="malev">Lisa Tekst</label></strong>
+                  <input name="malev" type="text" value=""/>
+                  <button class="muuda">Muuda</button>
+                  
+                  <div>
+                    <button class="ules">&uarr;</button>
+                    <button class="alla">&darr;</button>
+                    <button class="vasak">&larr;</button>
+                    <button class="parem">&rarr;</button>
+                  </div>
+
+
+                </div>
+
+              </div>
+          </div>
+
+
+
+          <div class="tab-pane fade p-3 text-white" id="nav-90ndad" role="tabpanel" aria-labelledby="nav-90ndad-tab">
+              <div class="wrapper">
+
+                <div class="plakatWrapper viisAastak pikkPlakat">
+                  <span class="addedText">ViisAastak</span>
+                </div>
+
+                <div class="innerWrapper">
+                  <select>
+                    <option disabled hidden selected>Vali</option>
+                    <option value="1950ndad">1950ndad</option>
+                    <option value="1960ndad">1960ndad</option>
+                    <option value="1960ndad">1970ndad</option>
+                    <option value="1970ndad">1980ndad</option>
+                  </select>
+
+                  <strong><label for="viisAastak">Lisa Tekst</label></strong>
+                  <input name="viisAastak" type="text" value=""/>
+                  <button class="muuda" >Muuda</button>
+                  
+                  <div>
+                    <button class="ules">&uarr;</button>
+                    <button class="alla">&darr;</button>
+                    <button class="vasak">&larr;</button>
+                    <button class="parem">&rarr;</button>
+                  </div>
+
+
+                </div>
+
+              </div>
+          </div>
+
+
+
+
+
+        </div>
+      </div>
+
+    
+
+
+    <script src="script.js"></script> 
 
     <!-- JavaScript Bundle with Popper -->
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
diff --git a/rannak/mangud/partorg/plakat/script.js b/rannak/mangud/partorg/plakat/script.js
new file mode 100644
index 0000000..4d4ee36
--- /dev/null
+++ b/rannak/mangud/partorg/plakat/script.js
@@ -0,0 +1,117 @@
+document.addEventListener('DOMContentLoaded', () => {
+    let btn = document.querySelector('.modalButton');
+    btn.click();
+});
+
+
+
+
+
+
+
+
+
+// FROM HERE TODO
+
+
+// Init Setup - to access later
+let dingDong = document.querySelector(".addedText");
+dingDong.style.top = "50%";
+dingDong.style.left = "50%";
+
+
+// Position
+const ules = document.querySelectorAll(".ules");
+const alla = document.querySelectorAll(".alla");
+const vasak = document.querySelectorAll(".vasak");
+const parem = document.querySelectorAll(".parem");
+
+ules.forEach(el => {
+    el.addEventListener("click" , e => {
+        let theText = e.target.parentElement.parentElement.parentElement.childNodes[1].childNodes[1];
+        let curTop = theText.style["top"];
+        curTop = curTop.substring(0, curTop.length-1)
+        
+        if (Number(curTop) >= 5)
+            theText.style["top"] = Number(curTop)-5+"%";
+    });
+})
+
+alla.forEach(el => {
+    el.addEventListener("click" , e => {
+        let theText = e.target.parentElement.parentElement.parentElement.childNodes[1].childNodes[1];
+        let curTop = theText.style["top"];
+        curTop = curTop.substring(0, curTop.length-1)
+        
+        if (Number(curTop) <= 85)
+            theText.style["top"] = Number(curTop)+5+"%";
+    });
+})
+
+vasak.forEach(el => {
+    el.addEventListener("click", e => {
+        let theText = e.target.parentElement.parentElement.parentElement.childNodes[1].childNodes[1];
+        let curLeft = theText.style["left"];
+        curLeft = curLeft.substring(0, curLeft.length-1)
+
+        console.log("Vasak");
+        console.log(theText.innerHTML);
+        
+        if (Number(curLeft) >= 5)
+            theText.style["left"] = Number(curLeft)-5+"%";
+    });
+})
+
+parem.forEach(el => {
+    el.addEventListener("click", e => {
+        let theText = e.target.parentElement.parentElement.parentElement.childNodes[1].childNodes[1];
+        let curLeft = theText.style["left"];
+        curLeft = curLeft.substring(0, curLeft.length-1)
+        
+        if (Number(curLeft) >= 5)
+            theText.style["left"] = Number(curLeft)+5+"%";
+    });
+})
+
+
+
+
+// Muuda Text button
+
+const muudaBtn = document.querySelector(".muuda");
+
+muudaBtn.addEventListener("click", e => {
+    console.log(e);
+});
+
+
+
+
+
+
+
+
+
+
+
+function checkIfAllGood(){
+	let rightDone = [];
+
+	for (let j=0; j < lists.length; j++){
+		const list = lists[j];
+		if (list.className.includes("startBasket"))
+			continue;
+		else if (list.children.length == 1){
+			if (list.id == list.children[0].id){
+				if (!rightDone.includes(list.id))
+					rightDone.push(list.id);
+			}
+		}
+	}  // For loop end
+
+	if (rightDone.length == 6) {
+        const btn = document.querySelector(".moveOn");
+        btn.disabled = false;
+        btn.onclick = () => location.href = "";
+	}
+}
diff --git a/rannak/mangud/partorg/plakat/styles.css b/rannak/mangud/partorg/plakat/styles.css
new file mode 100644
index 0000000..7d974e1
--- /dev/null
+++ b/rannak/mangud/partorg/plakat/styles.css
@@ -0,0 +1,197 @@
+* {
+	box-sizing: border-box;
+}
+h1 {
+    color: #154734;
+    font-weight: bold;
+}
+body{
+    background-color: #4D5157;
+}
+
+.moveOn{
+    display: inline-block;
+    border: none;
+    padding: 6px 12px;
+    margin-botton: 0;
+    font-size: 1rem;
+    font-weight: normal;
+    text-align: center;
+    cursor: pointer;
+    border-radius: 4px;
+    background-color: #4BB543;
+    color: white;
+}
+
+button:disabled{
+    opacity: 0.5;
+    cursor: not-allowed;
+}
+
+
+
+
+
+/* Modal Stuff */
+
+.avatar {
+    border-radius: 20px;
+    width: 100%;
+    max-width: 15rem;
+}
+
+.modalHeaderWrapper{
+    text-align: center;
+    margin: 0;
+    width: 100%;
+}
+
+
+
+
+.closeModalButton {
+  border-radius: 50px;
+}
+
+.modalButton{
+    position: absolute;
+    top: 0;
+    right: 0;
+    padding: 25px;
+    background-color: rgba(0,136,169,1);
+    border: none;
+    border-radius: 50px;
+    cursor: pointer;
+    transition: all 0.3 ease 0;
+    margin: 3%;
+    font-size: 1.2rem;
+}
+
+.modalButton:hover{
+    background-color: rgba(0,136,169,0.8);
+}
+
+
+
+
+
+/* Main Stuff*/
+.main{
+    background-color: #2f2f2f;
+    margin: 10 10%;
+}
+
+.nav-tabs {
+    display: flex;
+    justify-content: center;
+}
+
+.wrapper{
+    display: flex;
+    justify-content: center;
+}
+
+.plakatWrapper, .innerWrapper{
+    width: 48%;
+}
+
+
+.innerWrapper{
+    padding: 2rem;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+
+
+/* Input stuff*/
+
+select{
+    height: 3rem;
+    font-size: 2rem;
+}
+
+label{
+    padding: 1rem;
+    padding-top: 4rem;
+    font-size: 1.2rem;
+}
+
+input {
+    height: 2rem;
+    width: 75%;
+}
+
+.innerWrapper button {
+    margin-top: 1rem;
+}
+
+.innerWrapper button {
+    background-color: #596B6E;
+    border: none;
+    border-radius: 4px;
+    font-size:1.3rem;
+    color:white;
+    padding: 5px;
+}
+
+
+
+
+
+
+
+
+/*Plakatid*/
+
+.stalin {
+    background: url("img/stalin.jpg") no-repeat center;
+    background-size: 100%;
+    font-size: 2rem;
+    text-align: center;
+    color: black;
+}
+
+
+.veekogud {
+    background: url("img/veekogud.jpg") no-repeat center;
+    background-size: 100%;
+    font-size: 2rem;
+    text-align: center;
+    color: black;
+}
+
+
+.malev {
+    background: url("img/malev.jpg") no-repeat center;
+    background-size: 100% 100%;
+    font-size: 2rem;
+    text-align: center;
+    color: black;
+}
+
+
+.viisAastak {
+    background: url("img/viisAastak.jpg") no-repeat center;
+    background-size: 100% 100%;
+    font-size: 2rem;
+    text-align: center;
+    color: black;
+}
+
+.pikkPlakat{
+    height: 78vh;
+}
+
+.plakatWrapper{
+    position: relative;
+    overflow: hidden;
+    clear: both;
+}
+.addedText {
+    position: absolute;
+}
+
+
+