diff --git a/motto/public/reload.svg b/motto/public/reload.svg
new file mode 100644
index 0000000..96647f8
--- /dev/null
+++ b/motto/public/reload.svg
@@ -0,0 +1 @@
+
diff --git a/motto/public/script.js b/motto/public/script.js
index 7292cc3..d2950b7 100644
--- a/motto/public/script.js
+++ b/motto/public/script.js
@@ -90,6 +90,35 @@ function skipCard() {
event.preventDefault();
}
+function jumpTo(event) {
+ document.getElementById("sebastian").style.display = "none";
+ const cards = document.querySelectorAll(".card:not(.removed)");
+ let index = 0;
+ while (cards[index].getAttribute("data-id") != event.target.getAttribute("data-id")) {
+ index++;
+ skipCard();
+ }
+}
+
+function toggleOverview() {
+ const strange = document.getElementById("sebastian");
+ const off = strange.style.display == "none";
+ strange.style.display = off ? "block" : "none";
+ if (!off) return;
+ const overview_list = document.getElementById("overview");
+ overview_list.innerHTML = "";
+ const cards = document.querySelectorAll(".card:not(.removed)");
+ cards.forEach((element) => {
+ const li = document.createElement("li");
+ li.setAttribute("data-id", element.getAttribute("data-id"));
+ li.textContent = `${element.querySelectorAll("h1")[1].innerText} - ${element.querySelector("h2").innerText} (${
+ element.querySelectorAll("h2")[1].innerText
+ })`;
+ li.addEventListener("click", jumpTo);
+ overview_list.appendChild(li);
+ });
+}
+
function createButtonListener(yay) {
return function (event) {
const card = document.querySelectorAll(".card:not(.removed)")[0];
@@ -159,3 +188,21 @@ document.getElementById("add").addEventListener("click", () => {
const secondary = prompt("Was ist der zweite Teil?", "Wir sind super toll");
if (main && secondary) add(main, secondary);
});
+
+document.getElementById("idc").addEventListener("click", () => {
+ const wrapper = document.querySelector(".cards");
+ console.log(wrapper.children.length);
+ for (var i = wrapper.children.length; i >= 0; i--) wrapper.appendChild(wrapper.children[(Math.random() * i) | 0]);
+ initCards();
+});
+
+document.getElementById("aah").addEventListener("click", () => {
+ const elements = document.getElementsByClassName("removed");
+ for (var i = 0; i < elements.length; i++) {
+ elements[i].classList.remove("removed");
+ }
+ initCards();
+});
+
+document.getElementById("all").addEventListener("click", toggleOverview);
+document.getElementById("go").addEventListener("click", toggleOverview);
diff --git a/motto/public/shuffle.svg b/motto/public/shuffle.svg
new file mode 100644
index 0000000..4a56d61
--- /dev/null
+++ b/motto/public/shuffle.svg
@@ -0,0 +1 @@
+
diff --git a/motto/public/skip.svg b/motto/public/skip.svg
index e002c24..2beb5b9 100644
--- a/motto/public/skip.svg
+++ b/motto/public/skip.svg
@@ -1 +1 @@
-
+
diff --git a/motto/public/style.css b/motto/public/style.css
index 9de73ad..d9b1e02 100644
--- a/motto/public/style.css
+++ b/motto/public/style.css
@@ -1,6 +1,7 @@
*,
*:before,
*:after {
+ color: #424242;
box-sizing: border-box;
user-select: none;
padding: 0;
@@ -9,7 +10,8 @@
html,
body {
- background: #ccfbfe;
+ background-color: #eec0c6;
+ background-image: linear-gradient(315deg, #eec0c6 0%, #7ee8fa 74%);
font-family: sans-serif;
overflow: hidden;
}
@@ -60,8 +62,28 @@ body {
cursor: grabbing;
}
-.yay_or_nay {
+.sebastian {
+ display: none;
z-index: 100000;
+ width: 100vw;
+ height: 100vh;
+ overflow: scroll;
+ padding-top: 20px;
+ text-align: center;
+ transition: all 0.3s ease-in-out;
+}
+
+.sebastian li {
+ margin: 10px;
+}
+
+.sebastian button {
+ position: absolute;
+ right: 0;
+}
+
+.yay_or_nay {
+ z-index: 10000;
position: absolute;
bottom: 0;
flex: 0 0 100px;
@@ -70,6 +92,17 @@ body {
width: 100%;
}
+.blabla {
+ z-index: 100000;
+ position: absolute;
+ top: 0;
+ right: 0;
+ flex: 0 0 100px;
+ text-align: right;
+ padding-top: 20px;
+ width: 100%;
+}
+
.fab button {
z-index: 100000;
border-radius: 50%;
@@ -90,9 +123,16 @@ body {
vertical-align: middle;
}
-.add_button {
- position: absolute;
- right: 0;
- top: 0;
- bottom: unset;
+@media only screen and (max-width: 600px) {
+ .fab button {
+ margin: 10px;
+ }
+}
+
+@media only screen and (max-width: 400px) {
+ .fab button {
+ width: 50px;
+ height: 50px;
+ line-height: 30px;
+ }
}
diff --git a/motto/public/x.svg b/motto/public/x.svg
index f713136..7c925b2 100644
--- a/motto/public/x.svg
+++ b/motto/public/x.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
--
cgit v1.2.3