From baec8273d04fbf3aa76e8b4424490fc5cc41f793 Mon Sep 17 00:00:00 2001
From: Phillip Thelen <phillip@habitica.com>
Date: Mon, 19 Aug 2024 16:15:22 +0200
Subject: [PATCH] time travel button display fix

---
 website/client/src/assets/scss/button.scss  |  2 +-
 website/client/src/components/appFooter.vue | 11 +++++++----
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/website/client/src/assets/scss/button.scss b/website/client/src/assets/scss/button.scss
index 6c25f3f3ea..ae50232258 100644
--- a/website/client/src/assets/scss/button.scss
+++ b/website/client/src/assets/scss/button.scss
@@ -176,7 +176,7 @@
 
 .btn-warning {
   background: $orange-10;
-  color: $white;
+  color: $white !important;
 
   &:hover:not(:disabled):not(.disabled) {
     background: $orange-100;
diff --git a/website/client/src/components/appFooter.vue b/website/client/src/components/appFooter.vue
index 186dcdba57..04ec2b3372 100644
--- a/website/client/src/components/appFooter.vue
+++ b/website/client/src/components/appFooter.vue
@@ -291,6 +291,7 @@
       </div>
 
       <div
+        class="time-travel"
         v-if="TIME_TRAVEL_ENABLED && user.permissions && user.permissions.fullAccess"
         :key="lastTimeJump"
       >
@@ -308,12 +309,12 @@
         >-30 Days</a>
         <div class="my-2">
           Time Traveling! It is {{ new Date().toLocaleDateString() }}
-          <button
-            class="btn btn-warning mr-1"
+          <a
+            class="btn btn-warning btn-small"
             @click="resetTime()"
           >
             Reset
-          </button>
+        </a>
         </div>
         <a
           class="btn btn-secondary mr-1"
@@ -508,6 +509,8 @@ li {
   grid-area: debug-pop;
    }
 
+.time-travel { grid-area: time-travel;}
+
 footer {
   background-color: $gray-500;
   color: $gray-50;
@@ -528,7 +531,7 @@ footer {
     "donate-text donate-text donate-text donate-button social"
     "hr hr hr hr hr"
     "copyright copyright melior privacy-terms privacy-terms"
-    "debug-toggle debug-toggle debug-toggle blank blank";
+    "time-travel time-travel debug-toggle debug-toggle debug-toggle";
   grid-template-columns: repeat(5, 1fr);
   grid-template-rows: auto;