WIP Setup and Design

This commit is contained in:
Nisse Lommerde 2025-03-21 21:47:39 -04:00
parent 43eebd9528
commit 765e991648
12 changed files with 395 additions and 62 deletions

View File

@ -7,6 +7,7 @@
"require": {
"php": "^8.2",
"davidhsianturi/blade-bootstrap-icons": "^1.5",
"fakerphp/faker": "^1.23",
"filament/filament": "^3.2",
"guava/filament-clusters": "^1.4",
"icetalker/filament-table-repeater": "^1.3",
@ -14,8 +15,8 @@
"laravel/tinker": "^2.9",
"livewire/livewire": "^3.5",
"mallardduck/blade-lucide-icons": "^1.23",
"spatie/laravel-pdf": "^1.5",
"fakerphp/faker": "^1.23"
"mkocansey/bladewind": "^2.9",
"spatie/laravel-pdf": "^1.5"
},
"require-dev": {
"barryvdh/laravel-ide-helper": "^3.5",
@ -48,7 +49,8 @@
"@php artisan filament:upgrade"
],
"post-update-cmd": [
"@php artisan vendor:publish --tag=laravel-assets --ansi --force"
"@php artisan vendor:publish --tag=laravel-assets --ansi --force",
"@php artisan vendor:publish --tag=bladewind-public --force"
],
"post-root-package-install": [
"@php -r \"file_exists('.env') || copy('.env.example', '.env');\""

55
composer.lock generated
View File

@ -4,7 +4,7 @@
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
"This file is @generated automatically"
],
"content-hash": "46ac06345fc3d57a7d0a01cfcaeaac17",
"content-hash": "d23d33f8776861fe9932a9c99f52b593",
"packages": [
{
"name": "anourvalar/eloquent-serialize",
@ -3547,6 +3547,59 @@
},
"time": "2024-03-31T07:05:07+00:00"
},
{
"name": "mkocansey/bladewind",
"version": "v2.9.0",
"source": {
"type": "git",
"url": "https://github.com/mkocansey/bladewind.git",
"reference": "b63f97cd345688122cec0d994dfcd14f36b16e96"
},
"dist": {
"type": "zip",
"url": "https://api.github.com/repos/mkocansey/bladewind/zipball/b63f97cd345688122cec0d994dfcd14f36b16e96",
"reference": "b63f97cd345688122cec0d994dfcd14f36b16e96",
"shasum": ""
},
"require": {
"php": ">=7.3"
},
"type": "library",
"extra": {
"laravel": {
"providers": [
"Mkocansey\\Bladewind\\BladewindServiceProvider"
]
}
},
"autoload": {
"psr-4": {
"Mkocansey\\Bladewind\\": "src/"
}
},
"notification-url": "https://packagist.org/downloads/",
"license": [
"MIT"
],
"authors": [
{
"name": "Michael K. Ocansey",
"email": "mike@bladewindui.com"
}
],
"description": "Laravel UI Components using TailwindCSS, Blade Templates and vanilla Javascript",
"keywords": [
"Ui Components",
"blade components",
"laravel",
"tailwindcss"
],
"support": {
"issues": "https://github.com/mkocansey/bladewind/issues",
"source": "https://github.com/mkocansey/bladewind/tree/v2.9.0"
},
"time": "2025-01-15T05:40:31+00:00"
},
{
"name": "monolog/monolog",
"version": "3.8.1",

183
config/blade-icons.php Normal file
View File

@ -0,0 +1,183 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Icons Sets
|--------------------------------------------------------------------------
|
| With this config option you can define a couple of
| default icon sets. Provide a key name for your icon
| set and a combination from the options below.
|
*/
'sets' => [
'default' => [
/*
|-----------------------------------------------------------------
| Icons Path
|-----------------------------------------------------------------
|
| Provide the relative path from your app root to your SVG icons
| directory. Icons are loaded recursively so there's no need to
| list every sub-directory.
|
| Relative to the disk root when the disk option is set.
|
*/
'path' => 'resources/svg',
/*
|-----------------------------------------------------------------
| Filesystem Disk
|-----------------------------------------------------------------
|
| Optionally, provide a specific filesystem disk to read
| icons from. When defining a disk, the "path" option
| starts relatively from the disk root.
|
*/
'disk' => '',
/*
|-----------------------------------------------------------------
| Default Prefix
|-----------------------------------------------------------------
|
| This config option allows you to define a default prefix for
| your icons. The dash separator will be applied automatically
| to every icon name. It's required and needs to be unique.
|
*/
'prefix' => 'icon',
/*
|-----------------------------------------------------------------
| Fallback Icon
|-----------------------------------------------------------------
|
| This config option allows you to define a fallback
| icon when an icon in this set cannot be found.
|
*/
'fallback' => '',
/*
|-----------------------------------------------------------------
| Default Set Classes
|-----------------------------------------------------------------
|
| This config option allows you to define some classes which
| will be applied by default to all icons within this set.
|
*/
'class' => '',
/*
|-----------------------------------------------------------------
| Default Set Attributes
|-----------------------------------------------------------------
|
| This config option allows you to define some attributes which
| will be applied by default to all icons within this set.
|
*/
'attributes' => [
// 'width' => 50,
// 'height' => 50,
],
],
],
/*
|--------------------------------------------------------------------------
| Global Default Classes
|--------------------------------------------------------------------------
|
| This config option allows you to define some classes which
| will be applied by default to all icons.
|
*/
'class' => '',
/*
|--------------------------------------------------------------------------
| Global Default Attributes
|--------------------------------------------------------------------------
|
| This config option allows you to define some attributes which
| will be applied by default to all icons.
|
*/
'attributes' => [
// 'width' => 50,
// 'height' => 50,
],
/*
|--------------------------------------------------------------------------
| Global Fallback Icon
|--------------------------------------------------------------------------
|
| This config option allows you to define a global fallback
| icon when an icon in any set cannot be found. It can
| reference any icon from any configured set.
|
*/
'fallback' => '',
/*
|--------------------------------------------------------------------------
| Components
|--------------------------------------------------------------------------
|
| These config options allow you to define some
| settings related to Blade Components.
|
*/
'components' => [
/*
|----------------------------------------------------------------------
| Disable Components
|----------------------------------------------------------------------
|
| This config option allows you to disable Blade components
| completely. It's useful to avoid performance problems
| when working with large icon libraries.
|
*/
'disabled' => false,
/*
|----------------------------------------------------------------------
| Default Icon Component Name
|----------------------------------------------------------------------
|
| This config option allows you to define the name
| for the default Icon class component.
|
*/
'default' => 'icon',
],
];

View File

@ -0,0 +1,57 @@
<?php
return [
/*
|-----------------------------------------------------------------
| Default Prefix
|-----------------------------------------------------------------
|
| This config option allows you to define a default prefix for
| your icons. The dash separator will be applied automatically
| to every icon name. It's required and needs to be unique.
|
*/
'prefix' => 'lucide',
/*
|-----------------------------------------------------------------
| Fallback Icon
|-----------------------------------------------------------------
|
| This config option allows you to define a fallback
| icon when an icon in this set cannot be found.
|
*/
'fallback' => '',
/*
|-----------------------------------------------------------------
| Default Set Classes
|-----------------------------------------------------------------
|
| This config option allows you to define some classes which
| will be applied by default to all icons within this set.
|
*/
'class' => 'h-5 w-5',
/*
|-----------------------------------------------------------------
| Default Set Attributes
|-----------------------------------------------------------------
|
| This config option allows you to define some attributes which
| will be applied by default to all icons within this set.
|
*/
'attributes' => [
// 'width' => 20,
// 'height' => 20,
],
];

21
package-lock.json generated
View File

@ -13,7 +13,6 @@
"@popperjs/core": "^2.11.6",
"autoprefixer": "^10.4.20",
"axios": "^1.6.4",
"bootstrap": "^5.2.3",
"laravel-vite-plugin": "^1.0",
"postcss": "^8.4.47",
"sass": "^1.56.1",
@ -1655,26 +1654,6 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/bootstrap": {
"version": "5.3.3",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.3.tgz",
"integrity": "sha512-8HLCdWgyoMguSO9o+aH+iuZ+aht+mzW0u3HIMzVu7Srrpv7EBBxTnrFlSCskwdY1+EOFQSm7uMJhNQHkdPcmjg==",
"dev": true,
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/twbs"
},
{
"type": "opencollective",
"url": "https://opencollective.com/bootstrap"
}
],
"license": "MIT",
"peerDependencies": {
"@popperjs/core": "^2.11.8"
}
},
"node_modules/bootstrap-icons": {
"version": "1.11.3",
"resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.11.3.tgz",

View File

@ -9,7 +9,6 @@
"@popperjs/core": "^2.11.6",
"autoprefixer": "^10.4.20",
"axios": "^1.6.4",
"bootstrap": "^5.2.3",
"laravel-vite-plugin": "^1.0",
"postcss": "^8.4.47",
"sass": "^1.56.1",

View File

@ -1,2 +0,0 @@
import './bootstrap';
import 'bootstrap';

View File

@ -1,34 +0,0 @@
import 'bootstrap';
/**
* We'll load the axios HTTP library which allows us to easily issue requests
* to our Laravel back-end. This library automatically handles sending the
* CSRF token as a header based on the value of the "XSRF" token cookie.
*/
import axios from 'axios';
window.axios = axios;
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
/**
* Echo exposes an expressive API for subscribing to channels and listening
* for events that are broadcast by Laravel. Echo and event broadcasting
* allows your team to easily build robust real-time web applications.
*/
// import Echo from 'laravel-echo';
// import Pusher from 'pusher-js';
// window.Pusher = Pusher;
// window.Echo = new Echo({
// broadcaster: 'pusher',
// key: import.meta.env.VITE_PUSHER_APP_KEY,
// cluster: import.meta.env.VITE_PUSHER_APP_CLUSTER ?? 'mt1',
// wsHost: import.meta.env.VITE_PUSHER_HOST ?? `ws-${import.meta.env.VITE_PUSHER_APP_CLUSTER}.pusher.com`,
// wsPort: import.meta.env.VITE_PUSHER_PORT ?? 80,
// wssPort: import.meta.env.VITE_PUSHER_PORT ?? 443,
// forceTLS: (import.meta.env.VITE_PUSHER_SCHEME ?? 'https') === 'https',
// enabledTransports: ['ws', 'wss'],
// });

View File

@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
@vite('resources/js/app.js')
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link href="{{ asset('vendor/bladewind/css/animate.min.css') }}" rel="stylesheet" />
<link href="{{ asset('vendor/bladewind/css/bladewind-ui.min.css') }}" rel="stylesheet" />
<script src="{{ asset('vendor/bladewind/js/helpers.js') }}"></script >
@stack('styles') {{-- For additional styles --}}
</head>
<body class="bg-gray-100">
<div id="app">
<!-- Navigation -->
@include('layouts.navbar')
<!-- Main Content -->
<main class="container mx-auto mt-4">
@yield('content')
</main>
</div>
<!-- Scripts -->
@stack('scripts')
</body>
</html>

View File

@ -0,0 +1,39 @@
<div class="w-full text-center bg-red-500 text-white font-bold">
Proudly Canadian owned & operated
</div>
<nav class="shadow-sm py-2 bg-white">
<div class="container mx-auto w-full lg:w-[80%] flex items-center justify-between text-sm">
<!-- Logo & Navigation Links -->
<div class="flex space-x-3">
<div class="p-3 font-bold text-lg border-2">
Wear It!
</div>
<div class="flex space-x-3 items-center">
<a href="#" class="p-3 @if(Route::is('shop')) underline @endif">Products</a>
<a href="#" class="p-3 @if(Route::is('how-to')) underline @endif">How To Order</a>
<a href="#" class="p-3 @if(Route::is('about')) underline @endif">About Us</a>
<a href="#" class="p-3 @if(Route::is('faq')) underline @endif">FAQ</a>
</div>
</div>
<!-- Search Bar -->
<div class="flex items-center w-1/2">
<div class="w-full">
<form action="" method="post">
<x-bladewind::input placeholder="Search..." add_clearing="false" ></x-bladewind::input>
</form>
</div>
</div>
<!-- Right-side buttons -->
<div class="flex space-x-3">
<a href="#" class="p-3"><x-lucide-phone/></a>
<a href="#" class="p-3"><x-lucide-shopping-cart/></a>
<a href="#" class="p-3"><x-lucide-user/></a>
</div>
</div>
</nav>

View File

@ -0,0 +1,19 @@
@extends('layouts.app')
@section('content')
<div class="container pt-2">
<div class="flex space-x-3">
<div class="w-1/3 pr-2">
<x-bladewind::card>
Sidebar
</x-bladewind::card>
</div>
<div class="w-2/3">
<x-bladewind::card>
content
</x-bladewind::card>
</div>
</div>
@endsection

View File

@ -25,6 +25,8 @@
Route::get('invoices/{invoice}/pdf', [InvoiceController::class, 'pdf'])->name('invoice.pdf');
Route::get('customers/{customer}/pdf', [CustomerController::class, 'pdf'])->name('customer.pdf');
Route::get('/shop', fn () => view('shop'))->name('shop');
// Route::get('/dashboard', [DashboardController::class, 'index'])->name('dashboard');
// Route::get('/management/{tab?}', [ManagementController::class, 'index'])->name('management.index');
// Route::resource('order-products', OrderProductController::class);