fix: jelu theme readability bug

bayang · Jan 8, 2023 · 833e887 · 833e887
1 parent 21f96d7
commit 833e887
Show file tree

Hide file tree

Showing 6 changed files with 25 additions and 21 deletions.
diff --git a/src/jelu-ui/src/App.vue b/src/jelu-ui/src/App.vue
@@ -348,18 +348,18 @@ watch(() => route.name, (newVal, oldVal) => {
           </div>
         </div>
         <Transition>
-        <button
-          v-if="showAdvanced"
-          class="btn btn-circle btn-outline border-0 tooltip tooltip-bottom lowercase"
-          :data-tip="t('labels.advanced_search')"
-        >
-          <router-link
-            class="link-hover font-sans"
-            :to="{ name: 'search' }"
+          <button
+            v-if="showAdvanced"
+            class="btn btn-circle btn-outline border-0 tooltip tooltip-bottom lowercase"
+            :data-tip="t('labels.advanced_search')"
           >
-            <span class="mdi mdi-magnify-plus-outline mdi-24 text-3xl" />
-          </router-link>
-        </button>
+            <router-link
+              class="link-hover font-sans"
+              :to="{ name: 'search' }"
+            >
+              <span class="mdi mdi-magnify-plus-outline mdi-24 text-3xl" />
+            </router-link>
+          </button>
         </Transition>
       </div>
       <div class="navbar-end">

diff --git a/src/jelu-ui/src/assets/style.css b/src/jelu-ui/src/assets/style.css
@@ -60,6 +60,13 @@
 }
 
 /* oruga customization with daisyui */
+.o-chk__check {
+  @apply bg-none;
+}
+
+.o-chk .o-chk__check {
+  @apply checkbox checkbox-primary;
+}
 
 .o-btn.o-btn--success.o-btn--outlined-success {
   @apply btn btn-success;
@@ -86,9 +93,6 @@
   @apply radio radio-primary radio-sm bg-none;
 }
 
-.o-chk__check {
-  @apply bg-none;
-}
 
 .o-pag__link {
   @apply btn text-neutral-content !important;

diff --git a/src/jelu-ui/src/components/BookList.vue b/src/jelu-ui/src/components/BookList.vue
@@ -180,7 +180,7 @@ try {
       </div>
     </template>
     <template #filters>
-      <div class="field capitalize flex flex-col">
+      <div class="field capitalize flex flex-col gap-1">
         <label class="label">{{ t('reading_events.last_event_type') }} : </label>
         <o-checkbox
           v-model="eventTypes"

diff --git a/src/jelu-ui/src/components/Imports.vue b/src/jelu-ui/src/components/Imports.vue
@@ -183,7 +183,7 @@ watch(file, (newVal, oldVal) => {
           <input
             type="file"
             accept=".csv,.tsv,.txt"
-            class="block w-full text-sm text-slate-500 file:mr-4 file:py-2 file:px-4 file:rounded-full file:border-0 file:text-sm file:font-semibold file:bg-gray-50 file:text-primary hover:file:bg-gray-300"
+            class="block w-full text-sm text-slate-500 file:mr-4 file:py-2 file:px-4 file:rounded-full file:border-0 file:text-sm file:font-semibold file:bg-accent file:text-accent-content hover:file:bg-gray-300"
             @change="handleFileUpload($event)"
           >
           <br>

diff --git a/src/jelu-ui/src/components/ToReadList.vue b/src/jelu-ui/src/components/ToReadList.vue
@@ -143,7 +143,7 @@ getToRead()
       </div>
     </template>
     <template #filters>
-      <div class="field flex flex-col capitalize">
+      <div class="field flex flex-col capitalize gap-1">
         <label class="label">{{ t('reading_events.last_event_type') }} : </label>
         <o-checkbox
           v-model="eventTypes"

diff --git a/src/jelu-ui/tailwind.config.js b/src/jelu-ui/tailwind.config.js
@@ -37,12 +37,12 @@ module.exports = {
         jelu: {
           primary: "#f7f5d1",
           secondary: "#aaaaaa",
-          accent: "#f7f5d1",
+          accent: "#8D795B",
           neutral: "#404040",
           "base-100": "#262429",
-          "info": "#3ABFF8",
-          "success": "#36D399",
-          "warning": "#FBBD23",
+          "info": "#6191c2",
+          "success": "#CEB035",
+          "warning": "#ffad48",
           "error": "#F87272",
           "--rounded-box": "0rem", // border radius rounded-box utility class, used in card and other large boxes
           "--rounded-btn": "0rem", // border radius rounded-btn utility class, used in buttons and similar element