Skip to content

Commit b5a9f5d

Browse files
committed
Refactored 'HasModels' trait and improved styling setup
Removed the redundant functions `hasBoundModel` and `hasAlpineModel` from HasModels trait as they weren't necessary for its behavior. Added Tailwind CSS and set up its configuration for better styling and more modern look and feel across the application. Also updated the create button in `create.blade.php` to use language translation for better localization support. Finally, brought in new necessary dependencies into `composer.json`, `package.json` and adjusted `.gitignore` accordingly.
1 parent 99d953c commit b5a9f5d

File tree

11 files changed

+148
-15
lines changed

11 files changed

+148
-15
lines changed

.gitignore

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,9 @@
33
build
44
composer.lock
55
coverage
6-
docs
76
phpunit.xml
87
phpstan.neon
98
testbench.yaml
109
vendor
1110
node_modules
11+
package-lock.json

composer.json

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,18 @@
22
"name": "step2dev/lazy-ui",
33
"description": "Lazy UI is a Laravel package that provides a set of Blade components to rapidly build forms with Tailwind CSS and Daisy UI.",
44
"keywords": [
5-
"lazy ui",
5+
"component",
6+
"components",
7+
"daisy ui",
8+
"design-system",
9+
"framework",
610
"laravel",
711
"lazy component ui",
812
"lazy form",
9-
"daisy ui"
13+
"lazy ui",
14+
"tailwind",
15+
"tailwindcss",
16+
"ui-library"
1017
],
1118
"homepage": "https://github.com/step2dev/lazy-ui",
1219
"license": "MIT",

docs/.gitkeep

Whitespace-only changes.

package.json

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"name": "lazy-component",
3+
"version": "1.0.0",
4+
"description": "TallStack components",
5+
"license": "MIT",
6+
"keywords": [
7+
"design-system",
8+
"tailwindcss",
9+
"components",
10+
"ui-library",
11+
"component",
12+
"framework",
13+
"tailwind"
14+
],
15+
"dependencies": {
16+
"alpinejs": "^3.13.0",
17+
"theme-change": "^2.5.0"
18+
},
19+
"devDependencies": {
20+
"daisyui": "^3.6.3",
21+
"sanitize-html": "^2.11.0",
22+
"tailwindcss": "^3.3.3"
23+
}
24+
}

resources/css/lazy.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1+
@import "tailwind";
12
@import "./components/toast";

resources/css/tailwind.scss

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;
4+
5+
@layer utilities {
6+
.pause {
7+
animation-play-state: paused;
8+
}
9+
}
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { themeChange } from 'theme-change'
2+
3+
themeChange()
4+
let themeToggleBtn = document.querySelector('[data-toggle-theme]')
5+
6+
document.addEventListener('DOMContentLoaded', () => {
7+
if (themeToggleBtn) {
8+
if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
9+
themeToggleBtn.classList.add('swap-active')
10+
} else {
11+
themeToggleBtn.classList.remove('swap-active')
12+
}
13+
}
14+
})
15+
16+
17+

resources/tailwind.lazy.config.js

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
const defaultTheme = require('tailwindcss/defaultTheme')
2+
const colors = require("tailwindcss/colors");
3+
4+
/** @type {import('tailwindcss').Config} */
5+
module.exports = {
6+
darkMode: ['class', '[data-mode="dark"]'],
7+
presets: [
8+
//
9+
],
10+
content: [
11+
'./storage/framework/views/*.php',
12+
'./resources/views/**/*.blade.php',
13+
'./app/View/**/*.php',
14+
'./vendor/step2dev/lazy-ui/src/Component/**/*.blade.php',
15+
'./vendor/step2dev/lazy-ui/resources/views/*.blade.php',
16+
'./app/Livewire/**/*Table.php',
17+
],
18+
theme: {
19+
extend: {
20+
fontFamily: {
21+
'sans': ['Nunito', ...defaultTheme.fontFamily.sans],
22+
// 'serif': ['Roboto', ...defaultTheme.fontFamily.serif],
23+
// 'mono': ['Roboto', ...defaultTheme.fontFamily.mono],
24+
// 'body': ['Roboto'],
25+
},
26+
transitionProperty: {
27+
multiple: "width, height, backgroundColor, border-radius"
28+
}
29+
}
30+
},
31+
variants: {
32+
extend: {
33+
opacity: ['disabled']
34+
}
35+
},
36+
plugins: [
37+
// require('@tailwindcss/typography'),
38+
require('@tailwindcss/forms')({
39+
strategy: 'class',
40+
}),
41+
// require('@tailwindcss/aspect-ratio'),
42+
// require('@tailwindcss/typography'),
43+
require('daisyui')
44+
],
45+
daisyui: {
46+
themes: [
47+
"light",
48+
"dark",
49+
"cupcake",
50+
"bumblebee",
51+
"emerald",
52+
"corporate",
53+
"synthwave",
54+
"retro",
55+
"cyberpunk",
56+
"valentine",
57+
"halloween",
58+
"garden",
59+
"forest",
60+
"aqua",
61+
"lofi",
62+
"pastel",
63+
"fantasy",
64+
"wireframe",
65+
"black",
66+
"luxury",
67+
"dracula",
68+
"cmyk",
69+
"autumn",
70+
"business",
71+
"acid",
72+
"lemonade",
73+
"night",
74+
"coffee",
75+
"winter",
76+
],// true: all themes | false: only light + dark | array: specific themes like this ["light", "dark", "cupcake"]
77+
darkTheme: "dark", // name of one of the included themes for dark mode
78+
base: false, // applies background color and foreground color for root element by default
79+
styled: true, // include daisyUI colors and design decisions for all components
80+
utils: true, // adds responsive and modifier utility classes
81+
rtl: false, // rotate style direction from left-to-right to right-to-left. You also need to add dir="rtl" to your html tag and install `tailwindcss-flip` plugin for Tailwind CSS.
82+
prefix: "", // prefix for daisyUI classnames (components, modifiers and responsive class names. Not colors)
83+
logs: true, // Shows info about daisyUI version and used config in the console when building your CSS
84+
},
85+
}

resources/views/badge.blade.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@
22
'label' => '',
33
'icon' => ''
44
])
5-
<span {{ $attributes->merge(['class'=> 'badge'.($icon ? ' gap-2' : '')]) }}>{{ $icon }}{{ $label ?: $slot }}</span>
5+
<span {{ $attributes->merge(['class'=> ($icon ? ' gap-2' : '')]) }}>{{ $icon }}{{ $label ?: $slot }}</span>

resources/views/btn/create.blade.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,5 @@
33
])
44

55
<x-lazy-btn xs light :href="$href" {{ $attributes }}>
6-
<i class="bx bxs-plus-square"></i> {!! $slot !!}
6+
{{ $slot ?: __('lazy::buttons.create') }}
77
</x-lazy-btn>

0 commit comments

Comments
 (0)