Merge remote-tracking branch 'refs/remotes/origin/main'

test

assets/script.js

@@ -202,6 +202,13 @@ async function togglearticlecreate() {
     articleContainerElement.classList.toggle("hidden");
 }
 
+async function togglememecreate() {
+    "use strict";
+    let memeContainerElement = document.getElementById("memecreatecontainer");
+
+    memeContainerElement.classList.toggle("hidden");
+}
+
 async function renderarticles() {
     "use strict";
     let template = document.querySelector('template[data-template-name="article"]').innerHTML;
@@ -613,6 +620,7 @@ async function addMeme() {
         meme_image_id: memeImageElement.value
     }, "Meme bol zmazaný", "Nastala chyba pri mazaní meme-u", false);
     memeFormElement.reset();
+    await togglememecreate();
 }
 
 async function deleteMeme(memeId) {

assets/style.css

@@ -294,7 +294,7 @@ span#ye-span:hover + body{
 }
 
 
-#articlecreate {
+#articlecreate, #memecreate {
     border: 5px solid var(--pico-primary);
     z-index: 5;
     margin: auto;
@@ -311,15 +311,15 @@ span#ye-span:hover + body{
     display: none;
 }
 
-#articlecreatecontainer{
+#articlecreatecontainer, #memecreatecontainer{
     display: flex;
     align-items: center;
     justify-content: center;
     position: fixed;
-    top: 0;
+    top: 12vh;
     left: 0;
     width: 100vw;
-    height: 100vh;
+    height: 88vh;
     z-index: 4;
     backdrop-filter: blur(2px);
 }

templates/meme_add.html

@@ -1,9 +1,15 @@
-<form id="memeAddForm">
-    <label for="meme_title_input">Názov meme-u: </label>
-    <input type="text" id="meme_title_input"/>
-    <label for="meme_text_input">Text meme-u: </label>
-    <input type="text" id="meme_text_input"/>
-    <label for="meme_image_input">Obrázok meme-u</label>
-    <select id="meme_image_input"></select>
-    <input type="button" value="Pridať meme" onclick="addMeme()"/>
-</form>
+<div id="memecreatecontainer" class="hidden">
+    <div id="memecreate">
+        <label for="meme_title_input">Názov meme-u: </label>
+        <input type="text" id="meme_title_input" placeholder="Názov meme-u"/>
+
+        <label for="meme_text_input">Text meme-u: </label>
+        <input type="text" id="meme_text_input" placeholder="Text meme-u"/>
+
+        <label for="meme_image_input">Obrázok meme-u</label>
+        <select id="meme_image_input"></select>
+
+        <button id="memecreatebutton" onclick="addMeme()"><i class="ri-add-circle-line"></i></button>
+        <button id="memecreateclose" onclick="togglememecreate()"><i class="ri-close-line"></i></button>
+    </div>
+</div>

templates/meme_gallery.html

@@ -1,6 +1,7 @@
 <header>
     <h1 class="title">Adlerka Memes</h1>
     <p>Skoro, ako <a href="https://reddit.com/r/adlerka" target="_blank">r/adlerka</a>, ale lepšie.</p>
+    <button id="memecreateopen" onclick="togglememecreate()"><i class="ri-add-circle-line"></i></button>
     <hr>
 </header>
 <main>

templates/newsArticles.html

@@ -16,8 +16,9 @@
   <div id="articlecreate">
     <input type="text" placeholder="Article Title" id="articletitleinput"><br>
     <textarea id="articlebodyinput" placeholder="Article Body" rows="10" cols="80"></textarea><br>
-    <label for="articleprivilegeinput">Oprávnenie na pozretie článku:</label><br>
-    <input type="number" id="articleprivilegeinput" min="1" value="1" step="1"><br>
-    <button id="articlesubmit" onclick="submitarticle()">Add</button>
+    <label for="articleprivilegeinput">Oprávnenie na pozretie článku:</label>
+    <input type="number" id="articleprivilegeinput" min="1" value="1" step="1">
+    <button id="articlesubmit" onclick="submitarticle()"><i class="ri-add-circle-line"></i></button>
+    <button id="articlecreateclose" onclick="togglearticlecreate()"><i class="ri-close-line"></i></button>
   </div>
 </div>