astro/public/scripts/ntfy.js

@@ -81,3 +81,30 @@ async function ntfyClick() {
     }, 1000);
   }
 }
+
+function toggleTitle() {
+  if (ntfyTitle.style.display === "none") {
+    ntfyTitle.style.display = "internal"
+  }
+  else {
+    ntfyTitle.style.display = "none"
+  }
+}
+
+function toggleAttach() {
+  if (ntfyAttach.style.display === "none") {
+    ntfyAttach.style.display = "internal"
+  }
+  else {
+    ntfyAttach.style.display = "none"
+  }
+}
+
+function toggleClick() {
+  if (ntfyClickAction.style.display === "none") {
+    ntfyClickAction.style.display = "internal"
+  }
+  else {
+    ntfyClickAction.style.display = "none"
+  }
+}

astro/public/styles/css/classes.css

@@ -114,3 +114,12 @@ hr {
     justify-content: center;
     gap: 5px;
 }
+
+fieldset {
+    -webkit-box-shadow: 0 0 20px var(--accent-color);
+    -moz-box-shadow: 0 0 20px var(--accent-color);
+    box-shadow: 0 0 20px var(--accent-color);
+    border: 2.5px solid var(--accent);
+    border-radius: 3px;
+    display: inherit;
+}

astro/src/components/main-page/silly-widgets.astro

@@ -20,12 +20,26 @@
       </small>
       <br>
       <br>
-
+      <fieldset style="margin-left: 35%; margin-right: 35%; margin-bottom: 2%;">
-      <textarea id="ntfy-title" placeholder="title" rows=1 style="resize: none;"></textarea>
+      <div>
+        <input type="checkbox" id="title" name="title" onchange="toggleTitle()" />
+        <label for="title">Add Title?</label>
+      </div>
+        <div>
+          <input type="checkbox" id="attachment" name="attachment" onchange="toggleAttach()" />
+          <label for="attachment">Add Attachment?</label>
+        </div>
+        <div>
+          <input type="checkbox" id="click" name="click" onchange="toggleClick()" />
+          <label for="click">Add Click Action?</label>
+        </div>
+      </fieldset>
+      <textarea id="ntfy-title" placeholder="title" rows=1 style="resize: none; display: none;"></textarea>
       <textarea id="ntfy-message" placeholder="message" rows=2></textarea>
-    <textarea id="ntfy-attach" placeholder="attachment link" rows=1 style="resize: none;"></textarea>
+      <textarea id="ntfy-attach" placeholder="attachment link" rows=1 style="resize: none;display: none;"></textarea>
-    <textarea id="ntfy-click" placeholder="click link" rows=1 style="resize: none;"></textarea>
+      <textarea id="ntfy-click" placeholder="click link" rows=1 style="resize: none; display: none;"></textarea>
-    <br>
+      <br>
+      <br>
     <button
     class="custom-btn btn-1"
     style="width: 42%;"
@@ -34,6 +48,7 @@
     <span>Send</span>
     </button>
     <br>
+    <br>s
     <small>if it doesnt seem to be working, or you have javascript disabled, <br>you can POST to <span class="glitch">https://ntfy.ouroboros.group/beep</span>.</small>
     </div>
   </section>