laravel tabler bootstrap4

Laravel Tabler Bootstrap 4

Paquete Laravel 5.8 y 6.0 para integrar la plantilla Tabler y este paquete es compatible con Laravel Mix. Actualmente, este paquete se puede integrar fácilmente sólo en una instalación nueva. Para laravel >= 7.0, puedes usar la rama de desarrollo.

Preinstalación

Antes de la instalación, debe crear manualmente el andamio de autenticación.

• para Laravel 5.8

php artisan make:auth

• para Laravel >= 6.0
  1. Primero instale el paquete laravel/ui del compositor

     composer require laravel/ui

  2. Y luego, ejecute el código a continuación

     php artisan ui vue --auth

Instalación

composer require guszandy/laravel-tabler-bootstrap4

Para laravel >= 7.0, usa esto:

composer require guszandy/laravel-tabler-bootstrap4:dev-develop

Ejecute este código a continuación para implementar la plantilla,

php artisan make:tabler

Veamos qué hemos instalado. Primero, asegúrese de que ya haya ejecutado el comando php artisan migrate , luego haga

php artisan serve

¡Viola! En este momento se está ejecutando un sitio Laravel que usa Tabler.

Personalización de configuración y vistas

configuración

Para publicar la configuración de este paquete en la configuración de su aplicación, ejecute este código a continuación

php artisan vendor:publish --provider=" GusZandy  Tabler  Providers  AppServiceProvider " --tag= " config"

Vistas

Para publicar las vistas de este paquete y poder personalizarlas usted mismo, ejecute este código a continuación

php artisan vendor:publish --provider=" GusZandy  Tabler  Providers  AppServiceProvider " --tag= " views"

Siguiente paso

En primer lugar, debes entender cómo usar Laravel Mix e instalar la última versión de Laravel-mix.

Tabler necesita algún paquete en npm. Primero necesitas correr

npm install

Instale el paquete necesario de Tabler desde npm

npm install --save-dev bootstrap bootstrap-sass popper.js chart.js d3 font-awesome jquery-circle-progress jvectormap moment requirejs select2 select2-bootstrap-theme selectize sparkline tabler-ui tablesorter bootstrap-datepicker eonasdan-bootstrap-datetimepicker @ttskch/select2-bootstrap4-theme

Ejecute el comando Laravel Mix

npm run development

o utilizar production minimizar la producción

npm run production

Entonces eche un buen vistazo a estos archivos.

• webpack.mix.js
• resources/assets/js/tabler.js
• resources/assets/sass/tabler.scss

¡Feliz experimento!

Cómo utilizar los componentes de este paquete

1. Panel

@ component ( ' tabler::components.panel ' , [ ' title ' => ' Welcome ' ])
  @ slot ( ' tools ' )
      <a href=" #" class="card-options-collapse" data-toggle="card-collapse"><i
              class ="fe fe-chevron-up"></i></a>
      <a href=" #" class="card-options-remove" data-toggle="card-remove"><i class="fe fe-x"></i></a>
  @endslot
  You are logged in!
@endcomponent

2. Alerta

@ component ( ' tabler::components.alert ' , [ ' type ' => ' info ' ])
  @ slot ( ' text ' )
     This is an alert component.
  @endslot
@endcomponent

3. Botón

@ component ( ' tabler::components.button ' , [ ' type ' => ' info ' , ' url ' => ' www.google.com ' ])
  @ slot ( ' text ' )
     This is a button component.
  @endslot
@endcomponent

4. Pestañas

@ component ( ' tabler::components.tabs ' , [ ' nav_tabs ' => ' info ' ])
  @ slot ( ' tab_panes ' )
     This is a tab component.
  @endslot
@endcomponent