chore: general fixes

src/App.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="app_container">
     <UpdateModal
-      :update-modal-open="updateModalOpen"
+      :update-modal-open="isUpdateModalOpen"
-      @toggle-modal="() => (updateModalOpen = false)"
+      @toggle-modal="() => (isUpdateModalOpen = false)"
     />
 
     <Tooltip />
@@ -27,7 +27,7 @@
       &copy;
       <a href="https://td2.info.pl/profile/?u=20777" target="_blank">Spythere</a>
       {{ new Date().getUTCFullYear() }} |
-      <button class="btn--text" @click="() => (updateModalOpen = true)">
+      <button class="btn--text" @click="() => (isUpdateModalOpen = true)">
         v{{ VERSION }}{{ isOnProductionHost ? '' : 'dev' }}
       </button>
 
@@ -78,7 +78,7 @@ export default defineComponent({
     apiStore: useApiStore(),
     tooltipStore: useTooltipStore(),
 
-    updateModalOpen: false,
+    isUpdateModalOpen: false,
 
     currentLang: 'pl',
     isOnProductionHost: location.hostname == 'stacjownik-td2.web.app',
@@ -130,7 +130,7 @@ export default defineComponent({
           releaseURL: releaseData.html_url
         };
 
-        this.updateModalOpen =
+        this.isUpdateModalOpen =
           storageVersion != version || import.meta.env.VITE_UPDATE_TEST === 'test';
       } catch (error) {
         console.error(`Wystąpił błąd podczas pobierania danych z API GitHuba: ${error}`);

src/components/App/UpdateModal.vue

@@ -3,7 +3,8 @@
     <div class="modal-content">
       <h1 style="margin-bottom: 0.5em">🚀 {{ $t('update.title') }}</h1>
 
-      <div class="features-body" v-html="htmlChangelog"></div>
+      <div class="features-body" v-if="htmlChangelog != ''" v-html="htmlChangelog"></div>
+      <div class="no-features" v-else>{{ $t('update.no-data') }}</div>
 
       <button class="btn btn--action" ref="confirm-btn" @click="toggleModal(false)">
         {{ $t('update.confirm') }}
@@ -93,16 +94,14 @@ export default defineComponent({
   display: grid;
   grid-template-rows: auto 1fr auto;
   gap: 0.5em;
-  padding: 1em 2em;
+  padding: 1em;
   min-height: 700px;
   overflow: auto;
+  text-align: justify;
 }
 
-hr.separator {
+.no-features {
-  margin: 0.5em 0;
+  text-align: center;
-  padding: 0;
-  height: 3px;
-  background-color: #fff;
 }
 
 button {

src/components/StationsView/StationFilterCard.vue

@@ -69,8 +69,8 @@
                 minimumHours == 0
                   ? $t('filters.now')
                   : minimumHours < 8
-                  ? minimumHours + $t('filters.hour')
+                    ? minimumHours + $t('filters.hour')
-                  : $t('filters.no-limit')
+                    : $t('filters.no-limit')
               }}</span>
               <button class="btn--action" @click="addHour">+</button>
             </span>
@@ -442,23 +442,16 @@ h3.section-header {
 }
 
 .card_actions {
-  width: 100%;
   padding: 0.5em;
 
-  .filter-option {
-    max-width: 50%;
-    margin: 0 auto;
-  }
-
   .action-buttons {
     display: flex;
     gap: 0.5em;
-    width: 100%;
 
     margin-top: 0.5em;
 
     button {
-      width: 50%;
+      width: 100%;
       margin: 0 auto;
       padding: 0.5em;
 

src/locales/en.json

@@ -29,6 +29,7 @@
   "update": {
     "title": "Stacjownik update!",
     "confirm": "ROGER THAT!",
+    "no-data": "No data about the latest app update has been found",
     "info-1": "This changelog will be available to see once again after clicking the version number in the footer",
     "info-2": "The full app changelog available on <a href='https://github.com/Spythere/stacjownik' target='_blank'>the project's GitHub</a>"
   },

src/locales/pl.json

@@ -29,6 +29,7 @@
   "update": {
     "title": "Aktualizacja Stacjownika!",
     "confirm": "PRZYJĄŁEM!",
+    "no-data": "Nie znaleziono informacji o ostatnich zmianach w aplikacji",
     "info-1": "Ten changelog będzie zawsze dostępny po kliknięciu numeru wersji w stopce strony",
     "info-2": "Pełny changelog dostępny na <a href='https://github.com/Spythere/stacjownik' target='_blank'>GitHubie projektu</a>"
   },