choose database before first search

bjesus · Nov 24, 2024 · e3803e5 · e3803e5
1 parent 2311273
commit e3803e5
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 8 deletions.
diff --git a/components/BooksList.vue b/components/BooksList.vue
@@ -18,7 +18,7 @@
           <span class="ext"
             ><LucideLanguages :size="12" />{{ result.lang }}</span
           >
-          <span class="ext"
+          <span v-if="result.size" class="ext"
             ><LucideArrowBigDownDash :size="12" />
             {{ prettyBytes(result.size) }}</span
           >

diff --git a/components/Settings.vue b/components/Settings.vue
@@ -1,8 +1,9 @@
 <template>
   <div id="settings">
     <h2>Database</h2>
-    <p :class="{ info: !remote }">
-      Please choose a database for TeaTime to search in
+    <p class="info" v-if="!remote">
+      Welcome! Before you can search, please choose which database you would
+      like to query
     </p>
     <table>
       <thead>
@@ -66,7 +67,7 @@
 
   table {
     width: 100%;
-    border: 0;
+    border-collapse: collapse;
 
     tr {
       cursor: pointer;
@@ -105,14 +106,14 @@
   }
 
   p.info {
-    color: darkred;
-    background-color: rgba(255, 0, 0, 0.05);
+    color: darkblue;
+    background-color: rgba(0, 0, 255, 0.05);
     padding: 1rem;
-    border: 1px solid red;
+    border: 1px solid blue;
     border-radius: 1rem;
 
     &::before {
-      content: "ℹ️ ";
+      content: "👋 ";
     }
   }