From 2d1b573101c1bc74debdc8f43346c6dcde4b345b Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Tue, 29 Apr 2025 20:30:39 +0200
Subject: [PATCH] chore: improved inputs & warnings styles

---
 src/components/Timetable/TimetableWarnings.vue     | 14 +++++++-------
 .../TimetableSearch/JournalSearchInput.vue         |  2 +-
 .../TimetableSearch/LocalSearchInput.vue           |  2 +-
 src/components/TimetableSearch/SearchContainer.vue |  2 +-
 .../TimetableSearch/SearchModeActions.vue          |  4 ++--
 .../TimetableViews/JournalStorageView.vue          |  6 ++++--
 6 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/components/Timetable/TimetableWarnings.vue b/src/components/Timetable/TimetableWarnings.vue
index 2ab8227..4831343 100644
--- a/src/components/Timetable/TimetableWarnings.vue
+++ b/src/components/Timetable/TimetableWarnings.vue
@@ -1,7 +1,7 @@
 <template>
   <!-- Local  -->
-  <div class="my-2 print:hidden" v-if="globalStore.currentTimetableData?.savedTimestamp">
-    <div class="flex gap-2">
+  <div class="print:hidden" v-if="globalStore.currentTimetableData?.savedTimestamp">
+    <div class="flex gap-2 mt-1">
       <div class="flex items-center gap-2 bg-zinc-900 p-1 w-full">
         <div>
           <InfoIcon :size="20" />
@@ -25,14 +25,14 @@
       </div>
 
       <button
-        class="font-bold bg-zinc-900 p-1 hover:bg-zinc-800"
+        class="font-bold bg-zinc-900 p-1 hover:bg-zinc-800 rounded-md"
         @click="removeTimetable(globalStore.currentTimetableData.timetableId)"
       >
         <Trash2Icon />
       </button>
 
       <button
-        class="font-bold bg-zinc-900 p-1 hover:bg-zinc-800"
+        class="font-bold bg-zinc-900 p-1 hover:bg-zinc-800 rounded-md"
         @click="globalStore.selectedStorageTimetable = null"
       >
         <Undo2Icon />
@@ -41,8 +41,8 @@
   </div>
 
   <!-- Journal -->
-  <div class="my-2 print:hidden" v-else-if="globalStore.currentTimetableData?.journalCreatedAt">
-    <div class="flex gap-2">
+  <div class="print:hidden" v-else-if="globalStore.currentTimetableData?.journalCreatedAt">
+    <div class="flex gap-2 mt-1">
       <div class="flex items-center gap-2 bg-zinc-900 p-1 w-full">
         <div>
           <InfoIcon :size="20" />
@@ -64,7 +64,7 @@
       </div>
 
       <button
-        class="font-bold bg-zinc-900 p-1 hover:bg-zinc-800"
+        class="font-bold bg-zinc-900 p-1 hover:bg-zinc-800 rounded-md"
         @click="globalStore.selectedJournalTimetable = null"
       >
         <Undo2Icon />
diff --git a/src/components/TimetableSearch/JournalSearchInput.vue b/src/components/TimetableSearch/JournalSearchInput.vue
index 8455430..ed1ed70 100644
--- a/src/components/TimetableSearch/JournalSearchInput.vue
+++ b/src/components/TimetableSearch/JournalSearchInput.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex gap-2 items-center">
+  <div class="flex gap-2 items-center" v-if="globalStore.currentTimetableData == null">
     <div class="flex gap-2 w-full">
       <input
         v-model="globalStore.journalTimetableSearch.driverName"
diff --git a/src/components/TimetableSearch/LocalSearchInput.vue b/src/components/TimetableSearch/LocalSearchInput.vue
index c1fe550..678e1ab 100644
--- a/src/components/TimetableSearch/LocalSearchInput.vue
+++ b/src/components/TimetableSearch/LocalSearchInput.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex gap-2">
+  <div class="flex gap-2" v-if="globalStore.currentTimetableData == null">
     <div class="w-full">
       <input
         v-model="globalStore.localTimetableSearch"
diff --git a/src/components/TimetableSearch/SearchContainer.vue b/src/components/TimetableSearch/SearchContainer.vue
index eae413e..985f9f8 100644
--- a/src/components/TimetableSearch/SearchContainer.vue
+++ b/src/components/TimetableSearch/SearchContainer.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex gap-2 flex-col mb-2 print:hidden">
+  <div class="flex gap-2 flex-col print:hidden">
     <!-- Top Actions & Modes -->
     <SearchModeActions />
 
diff --git a/src/components/TimetableSearch/SearchModeActions.vue b/src/components/TimetableSearch/SearchModeActions.vue
index 581f606..e6df799 100644
--- a/src/components/TimetableSearch/SearchModeActions.vue
+++ b/src/components/TimetableSearch/SearchModeActions.vue
@@ -31,7 +31,7 @@
         }`"
         @click="toggleViewMode('journal')"
       >
-        <NotebookPenIcon />
+        <HistoryIcon />
       </button>
     </div>
 
@@ -71,8 +71,8 @@ import type { ViewMode, TimetableData } from '../../types/common.types';
 import {
   ArchiveIcon,
   FolderDownIcon,
+  HistoryIcon,
   MoonIcon,
-  NotebookPenIcon,
   PrinterIcon,
   SunIcon,
   WifiIcon
diff --git a/src/components/TimetableViews/JournalStorageView.vue b/src/components/TimetableViews/JournalStorageView.vue
index 3d638ee..422a907 100644
--- a/src/components/TimetableViews/JournalStorageView.vue
+++ b/src/components/TimetableViews/JournalStorageView.vue
@@ -1,6 +1,7 @@
 <template>
   <div class="text-white">
-    <h2 class="font-bold p-2 bg-zinc-700 mb-3 text-2xl">
+    <h2 class="font-bold p-2 bg-zinc-700 mb-3 text-2xl flex items-center gap-2 justify-center flex-wrap">
+      <HistoryIcon :size="25" />
       {{ $t('journal-preview-title') }}
     </h2>
 
@@ -65,6 +66,7 @@
 </template>
 
 <script setup lang="ts">
+import { HistoryIcon } from 'lucide-vue-next';
 import { useApiStore } from '../../stores/api.store';
 import { useGlobalStore } from '../../stores/global.store';
 import { DataStatus } from '../../types/api.types';
@@ -80,7 +82,7 @@ async function fetchTimetableDetails(id: number) {
         params: {
           timetableId: id,
           hasStopsDetails: 1,
-          returnType: "detailed"
+          returnType: 'detailed'
         }
       })
     ).data;