Download the PHP package feldsam-inc/laravel-buefy-preset without Composer
On this page you can find all versions of the php package feldsam-inc/laravel-buefy-preset. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download feldsam-inc/laravel-buefy-preset
More information about feldsam-inc/laravel-buefy-preset
Files in feldsam-inc/laravel-buefy-preset
Package laravel-buefy-preset
Short Description This preset provides UI components that marry Bulma and VueJS together in the form of Buefy for any new Laravel site / web-app.
License MIT
Informations about the package laravel-buefy-preset
Buefy Frontend Preset For Laravel
This preset provides UI components that marry Bulma and VueJS together in the form of Buefy for any new Laravel site / web-app. In Buefy's own words, it provides:
Lightweight UI components for Vue.js based on Bulma.
What it does
- Removes
in favor of
and provides VueJS components to easily use all (and more...) of the Bulma components. - Other NPM packages removed: ,
,
. - Adds a Bulma based Blade layout: `.
- Adds a Bulma based Blade view: `.
- Adds a Bulma based "Navbar" Blade component: `.
- Adds Vue and Bulma based "Navbar" Blade component: `.
- Adds Vue and Bulma based "Login" and "Register" forms components:
,
. - Adds versioning / cache-busting of CSS and JS assets for production environments in your `.
WARNING!!
The preset provided Blade views are namespaced their own directory, so nothing should go wrong on that front, but, for a non-fresh project, it will 100% squash any custom JS, SASS, Mix code you may have written). You have been warned!
Getting Started
- ` into your fresh Laravel project.
- Run `.
- Then run
yarn
yarn watchroutes/web.phphttp://localhost:8000
productionyarn production
yarn prodproduction
.envbulma-nav.blade.php
'version' => env('APP_VERSION', '1.0.0'),config/app.phpAPP_VERSION=YOUR_VERSION_NUMBER
.env.env
resources/sass/app.scss`scss // Configure environment-wise colors you need per environmentenv-indicator.local {
background-color: $primary; }
env-indicator.dev {
background-color: $primary-invert;
}
// Hide the environment indicator on your choice of environments
env-indicator.production,
env-indicator.staging {
display: none !important;
}
### Author
Pratyush Pundir
Email: [email protected]