Merge pull request #292 from laradumps/improve-themes

Add Lemonade / Winter theme - Fix log filters buttons bug
laradumps · Apr 27, 2024 · edeb387 · edeb387
2 parents 232ef66 + 31452b5
commit edeb387
Show file tree

Hide file tree

Showing 8 changed files with 31 additions and 47 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "laradumps",
-    "version": "3.2.0",
+    "version": "3.2.1",
     "private": false,
     "description": "LaraDumps a friendly app designed to boost your PHP coding and debugging experience. https://github.com/laradumps/app",
     "author": "Luan Freitas <[email protected]>",

diff --git a/src/main/main-menu.ts b/src/main/main-menu.ts
@@ -305,7 +305,9 @@ async function getMenuTemplate(mainWindow: BrowserWindow) {
                 createThemeItem("Retro", "retro"),
                 createThemeItem("Halloween", "halloween"),
                 createThemeItem("Cyberpunk", "cyberpunk"),
-                createThemeItem("Laravel", "laravel")
+                createThemeItem("Laravel", "laravel"),
+                createThemeItem("Lemonade", "lemonade"),
+                createThemeItem("Winter", "winter")
             ]
         },
         {

diff --git a/src/renderer/components/DumpItem.vue b/src/renderer/components/DumpItem.vue
@@ -109,7 +109,7 @@ const color = computed(() => {
                     'collapse-open': open,
                     'collapse-close': open
                 }"
-                class="collapse bg-base-200 bg-laravel"
+                class="collapse bg-base-200/70 bg-laravel"
             >
                 <div
                     @dblclick="open = !open"

diff --git a/src/renderer/components/DumpMail.vue b/src/renderer/components/DumpMail.vue
@@ -61,7 +61,7 @@ onMounted(() => {
                 <div class="flex justify-center mt-3 my-2">
                     <button
                         @click.prevent="createNewWindow()"
-                        class="btn btn-primary !h-[38px] !px-4"
+                        class="btn btn-primary text-primary-content !h-[38px] !px-4"
                     >
                         View Content
                         <ArrowTopRightOnSquareIcon class="w-5" />

diff --git a/src/renderer/components/HeaderColorsFilter.vue b/src/renderer/components/HeaderColorsFilter.vue
@@ -17,27 +17,27 @@ defineProps({
 });
 
 const isDark = computed(() => ({
-    "border-white": selectedColors.colors.includes("black")
+    "bg-black": selectedColors.colors.includes("black")
 }));
 
 const isRed = computed(() => ({
-    "border-white": selectedColors.colors.includes("red")
+    "bg-red-500": selectedColors.colors.includes("red")
 }));
 
 const isGray = computed(() => ({
-    "border-white": selectedColors.colors.includes("gray")
+    "bg-gray-500": selectedColors.colors.includes("gray")
 }));
 
 const isBlue = computed(() => ({
-    "border-white": selectedColors.colors.includes("blue")
+    "bg-blue-500": selectedColors.colors.includes("blue")
 }));
 
 const isGreen = computed(() => ({
-    "border-white": selectedColors.colors.includes("green")
+    "bg-green-500": selectedColors.colors.includes("green")
 }));
 
 const isOrange = computed(() => ({
-    "border-white": selectedColors.colors.includes("orange")
+    "bg-orange-500": selectedColors.colors.includes("orange")
 }));
 </script>
 
@@ -46,49 +46,49 @@ const isOrange = computed(() => ({
         class="space-x-2 flex justify-end items-center"
         v-if="screenStore.screen !== 'Queries' && hasColor"
     >
-        <div class="h-full grid gap-2 grid-cols-3 tiny:grid-cols-6 opacity-75">
+        <div class="h-full flex gap-2">
             <button
                 :class="isDark"
                 @click="selectedColors.add('black')"
                 value="black"
                 type="button"
-                class="badge badge-xs bg-[black] border-gray-800"
+                class="badge badge-xs border-black"
             ></button>
 
             <button
                 :class="isRed"
                 @click="selectedColors.add('red')"
                 value="red"
                 type="button"
-                class="badge badge-xs bg-[#ff0000]"
+                class="badge badge-xs border-[#ff0000]"
             ></button>
 
             <button
                 :class="isOrange"
                 @click="selectedColors.add('orange')"
                 type="button"
-                class="badge badge-xs bg-[orange]"
+                class="badge badge-xs border-[orange]"
             ></button>
 
             <button
                 :class="isBlue"
                 @click="selectedColors.add('blue')"
                 type="button"
-                class="badge badge-xs bg-[blue]"
+                class="badge badge-xs border-[blue]"
             ></button>
 
             <button
                 :class="isGreen"
                 @click="selectedColors.add('green')"
                 type="button"
-                class="badge badge-xs bg-[green]"
+                class="badge badge-xs border-[green]"
             ></button>
 
             <button
                 :class="isGray"
                 @click="selectedColors.add('gray')"
                 type="button"
-                class="badge badge-xs bg-[gray]"
+                class="badge badge-xs border-[gray]"
             ></button>
         </div>
     </div>

diff --git a/src/renderer/sf-dump.css b/src/renderer/sf-dump.css
@@ -139,7 +139,7 @@ pre.sf-dump .sf-dump-search-wrapper > .sf-dump-search-count {
 pre.sf-dump,
 pre.sf-dump .sf-dump-default {
     background-color: unset;
-    @apply text-secondary;
+    @apply text-base;
     line-height: 1.2em;
     word-wrap: break-word;
     white-space: pre-wrap;
@@ -163,7 +163,7 @@ pre.sf-dump .sf-dump-str {
     color: #56db3a;
 }
 pre.sf-dump .sf-dump-note {
-    @apply text-primary;
+    @apply font-semibold text-primary;
 }
 pre.sf-dump .sf-dump-ref {
     color: #a0a0a0;
@@ -181,7 +181,7 @@ pre.sf-dump .sf-dump-private {
     @apply text-base-content;
 }
 pre.sf-dump .sf-dump-meta {
-    color: #b729d9;
+    @apply text-primary;
 }
 pre.sf-dump .sf-dump-key {
     @apply text-base-content;
@@ -205,7 +205,6 @@ pre.sf-dump .sf-dump-ellipsis-note {
 [data-theme="light"] pre.sf-dump .sf-dump-str {
     @apply font-normal text-primary;
 }
-
 [data-theme="dracula"] pre.sf-dump .sf-dump-str {
     @apply font-normal text-secondary;
 }
@@ -226,7 +225,13 @@ pre.sf-dump .sf-dump-ellipsis-note {
     color: #56db3a;
 }
 [data-theme="cyberpunk"] pre.sf-dump .sf-dump-str {
-    @apply font-normal text-primary;
+    @apply font-semibold text-primary;
+}
+[data-theme="lemonade"] pre.sf-dump .sf-dump-str {
+    @apply text-secondary font-semibold;
+}
+[data-theme="winter"] pre.sf-dump .sf-dump-str {
+    @apply text-secondary font-semibold;
 }
 [data-theme="laravel"] pre.sf-dump .sf-dump-note {
     color: #1299da;

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -51,36 +51,13 @@ module.exports = {
         themes: [
             "light",
             "dark",
-            "cupcake",
-            "bumblebee",
-            "emerald",
-            "corporate",
-            "synthwave",
             "retro",
             "cyberpunk",
-            "valentine",
             "halloween",
-            "garden",
-            "forest",
-            "aqua",
-            "lofi",
-            "pastel",
-            "fantasy",
-            "wireframe",
-            "black",
-            "luxury",
             "dracula",
-            "cmyk",
-            "autumn",
-            "business",
-            "acid",
             "lemonade",
-            "night",
-            "coffee",
             "winter",
             "dim",
-            "nord",
-            "sunset",
             {
                 laravel: {
                     primary: "#FF2D20",