From 8a89024740256892df01ae8bcd8349cbca3f5a18 Mon Sep 17 00:00:00 2001
From: Jason Henriquez <jasonhenriquez@protonmail.com>
Date: Wed, 17 Apr 2024 17:49:23 -0500
Subject: [PATCH] Update ft-refresh-widget to use fixed-top-bar mixin

---
 .../ft-refresh-widget/ft-refresh-widget.js     |  5 -----
 ...fresh-widget.css => ft-refresh-widget.scss} | 18 ++++--------------
 .../ft-refresh-widget/ft-refresh-widget.vue    |  5 +----
 3 files changed, 5 insertions(+), 23 deletions(-)
 rename src/renderer/components/ft-refresh-widget/{ft-refresh-widget.css => ft-refresh-widget.scss} (62%)

diff --git a/src/renderer/components/ft-refresh-widget/ft-refresh-widget.js b/src/renderer/components/ft-refresh-widget/ft-refresh-widget.js
index 24ca4e1f8495c..80c767df6a577 100644
--- a/src/renderer/components/ft-refresh-widget/ft-refresh-widget.js
+++ b/src/renderer/components/ft-refresh-widget/ft-refresh-widget.js
@@ -21,9 +21,4 @@ export default defineComponent({
       required: true
     }
   },
-  computed: {
-    isSideNavOpen: function () {
-      return this.$store.getters.getIsSideNavOpen
-    }
-  }
 })
diff --git a/src/renderer/components/ft-refresh-widget/ft-refresh-widget.css b/src/renderer/components/ft-refresh-widget/ft-refresh-widget.scss
similarity index 62%
rename from src/renderer/components/ft-refresh-widget/ft-refresh-widget.css
rename to src/renderer/components/ft-refresh-widget/ft-refresh-widget.scss
index 3c9b499098b31..46e758e7f518b 100644
--- a/src/renderer/components/ft-refresh-widget/ft-refresh-widget.css
+++ b/src/renderer/components/ft-refresh-widget/ft-refresh-widget.scss
@@ -1,9 +1,9 @@
+@use '../../scss-partials/ft-list-item';
+
 .floatingRefreshSection {
-  position: fixed;
-  inset-block-start: 60px;
-  inset-inline-end: 0;
+  @include ft-list-item.fixed-top-bar;
+
   box-sizing: border-box;
-  inline-size: calc(100% - 80px);
   padding-block: 5px;
   padding-inline: 10px;
   box-shadow: 0 2px 1px 0 var(--primary-shadow-color);
@@ -19,18 +19,8 @@
   justify-content: space-between;
 }
 
-.floatingRefreshSection.sideNavOpen {
-  inline-size: calc(100% - 200px);
-}
-
 .lastRefreshTimestamp {
   margin-block: 0;
   text-align: center;
   font-size: 16px;
 }
-
-@media only screen and (width <= 680px) {
-  .floatingRefreshSection, .floatingRefreshSection.sideNavOpen {
-    inline-size: 100%;
-  }
-}
diff --git a/src/renderer/components/ft-refresh-widget/ft-refresh-widget.vue b/src/renderer/components/ft-refresh-widget/ft-refresh-widget.vue
index 564f1cae8402c..41f5ce7d87f52 100644
--- a/src/renderer/components/ft-refresh-widget/ft-refresh-widget.vue
+++ b/src/renderer/components/ft-refresh-widget/ft-refresh-widget.vue
@@ -1,9 +1,6 @@
 <template>
   <div
     class="floatingRefreshSection"
-    :class="{
-      sideNavOpen: isSideNavOpen
-    }"
   >
     <p
       v-if="lastRefreshTimestamp"
@@ -24,4 +21,4 @@
 </template>
 
 <script src="./ft-refresh-widget.js" />
-<style scoped src="./ft-refresh-widget.css" />
+<style scoped lang="scss" src="./ft-refresh-widget.scss" />