From 8268f3e122c61d9df513eb46a0ad431e8af41c7c Mon Sep 17 00:00:00 2001
From: Miodec <bartnikjack@gmail.com>
Date: Wed, 24 Aug 2022 15:00:44 +0200
Subject: [PATCH] hiding spacers when needed

---
 frontend/src/styles/test.scss       | 5 +++++
 frontend/src/ts/test/test-config.ts | 9 ++++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/frontend/src/styles/test.scss b/frontend/src/styles/test.scss
index 21045d3de..f8da7e3b4 100644
--- a/frontend/src/styles/test.scss
+++ b/frontend/src/styles/test.scss
@@ -1010,6 +1010,11 @@
     border-radius: calc(var(--roundness) / 2);
     background: var(--bg-color);
     margin: auto 1rem;
+    transition: 0.25s;
+    &.scrolled {
+      width: 0;
+      margin: auto 0;
+    }
   }
   .textButton {
     transition: 0.125s;
diff --git a/frontend/src/ts/test/test-config.ts b/frontend/src/ts/test/test-config.ts
index f17de2775..b2c13458f 100644
--- a/frontend/src/ts/test/test-config.ts
+++ b/frontend/src/ts/test/test-config.ts
@@ -94,6 +94,7 @@ export async function update(
   ) {
     //show
 
+    $("#testConfig .leftSpacer").removeClass("scrolled");
     $("#testConfig .puncAndNum")
       .css({
         opacity: 0,
@@ -112,7 +113,7 @@ export async function update(
     puncAndNumVisible[current] == false
   ) {
     //hide
-
+    $("#testConfig .leftSpacer").addClass("scrolled");
     $("#testConfig .puncAndNum")
       .css({
         opacity: 1,
@@ -128,6 +129,12 @@ export async function update(
       );
   }
 
+  if (current == "zen") {
+    $("#testConfig .rightSpacer").addClass("scrolled");
+  } else {
+    $("#testConfig .rightSpacer").removeClass("scrolled");
+  }
+
   // const currentWidth = Math.round(
   //   document.querySelector("#testConfig .row")?.getBoundingClientRect().width ??
   //     0