Add Tailwind beams background

stevebauman · Jun 4, 2024 · c049e21 · c049e21
1 parent d90a8a9
commit c049e21
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 1 deletion.
diff --git a/assets/img/tailwind-beams.png b/assets/img/tailwind-beams.png
diff --git a/components/Window.vue b/components/Window.vue
@@ -71,7 +71,7 @@
                     :readonly="preview"
                     @blur="editingTitle = false"
                     @keyup.enter="$refs.titleInput.blur()"
-                    :style="{ width: `${title.length / 1.75}em` }"
+                    :style="{ width: `${title.length / 1.5}em` }"
                     :class="{ 'cursor-pointer pointer-events-none': preview }"
                     class="p-0 text-sm font-medium text-center bg-transparent border-0 shadow-none focus:ring-0"
                 />

diff --git a/data/backgrounds.js b/data/backgrounds.js
@@ -1,5 +1,6 @@
 import PestBlack from '../assets/img/pest-black.png';
 import PestWhite from '../assets/img/pest-white.png';
+import TailwindBeams from '../assets/img/tailwind-beams.png';
 
 export default [
     {
@@ -47,6 +48,24 @@ export default [
         id: 'lavender',
         class: 'bg-gradient-to-bl from-blue-400 to-purple-500',
     },
+    {
+        id: 'tailwind-light',
+        style: {
+            backgroundSize: 'cover',
+            backgroundColor: '#ffffff',
+            backgroundPosition: 'center',
+            backgroundImage: `url(${TailwindBeams})`,
+        },
+    },
+    {
+        id: 'tailwind-dark',
+        style: {
+            backgroundSize: 'cover',
+            backgroundColor: '#0f172a',
+            backgroundPosition: 'center',
+            backgroundImage: `url(${TailwindBeams})`,
+        },
+    },
     {
         id: 'pest-black',
         style: {