Wedding Admin

Demo

Prebuilt Admin With Livewire and Tailwind CSS

Seeder

#to seed user data
php artisan db:seed --class=UserSeeder

3rd party plugins

Laravel & Livewire Packages

Laravel Schematics

Laravolt Indonesia

Livewire

Rappasoft Datatables

Spatie Media Library

Pretty Routes

IDE Helper

Debugbar

Web Tinker

Js Libraries

Filepond

Noty JS

Alpine JS

jQuery

Select2

Metismenu

Axios

Lodash

CSS Libraries

Font Awesome

Feather Icons

Tailwind CSS

Events & Listener

Toast

$this->emit("showToast", ["message" => "", "type" => "success", "reload"=>false]); 

Components

Inputs

Form Group

<x-input.form-group label="Label" key="id" model="model.id">
	
</x-input.form-group>

Datepicker

<!--datepicker-->
<x-input.datepicker wire:model=""></x-input.datepicker>

Select & select2

<!--select2 options boolean-->
<x-input.select method="" wire:model="" :select2="false"></x-input.select>

Summernote (WYSIWG)

<!--
	to set data you should emit from backend
	$this->emit("setSummernoteValue");
-->
<x-input.summernote id="" wire:model.defer=""></x-input.summernote>

Layouts

Navigation

<x-admin.navigation selector="foo"></x-admin.navigation>

Blank Page

<main class="w-full flex-grow px-3 pb-5" xmlns:wire="http://www.w3.org/1999/xhtml">
    <section class="content mx-auto py-5 px-5 min-h-screen">
        <div class="pb-3">
            <h4 class="heading">Title</h4>
        </div>
        <div class="grid md:grid-cols-3 lg:grid-cols-4 sm:grid-cols-12 gap-4">
           
        </div>
    </section>
</main>

Breadcrumbs

//breadcrumbs
public array $breadcrumbs = [
      ["link" => "#", "title" => "Admin"],
      ["link" => "#", "title" => "User Management"],
];
<x-admin.breadcrumb :breadcrumbs="$breadcrumbs"></x-admin.breadcrumb>

Widget card

<x-admin.widget-card title="Lorem ipsum" :number="2000000">
	<div class="fa fa-line-chart"></div>
</x-admin.widget-card>

Tabs

<!--
$tabHeaders = [
      ['key' => 'foo', 'title' => 'Foo'],
      ['key' => 'bar', 'title' => 'Bar'],
];
--> 
<x-admin.tabs class="tabs" :headers="$tabHeaders">
		<x-slot name="foo">
			Foo
		</x-slot>
		<x-slot name="bar">
			Bar
		</x-slot>
 </x-admin.tabs>

Filepond

<x-input.filepond wire:model="image"></x-input.filepond>

Modal

<!--size sm, md, lg, xl, fullscreen-->
<x-admin.modal size="md" :title="$updateMode ? 'Edit' : 'Create'">
    
</x-admin.modal>