laravelnews / laravel-twbs4
Laravel 5 frontend preset for Twitter Bootstrap 4
Installs: 75 766
Dependents: 1
Suggesters: 0
Security: 0
Stars: 236
Watchers: 10
Forks: 19
Open Issues: 0
Language:HTML
Requires
- laravel/framework: ~5.5.0
README
Note: Laravel 5.6 includes Bootstrap 4, this preset is only needed for Laravel <= Laravel 5.5 LTS
If you are upgrading a Laravel <= 5.5 application, remove this preset (laravelnews/laravel-twbs4
) from your composer.json
file. Laravel 5.6 includes Bootstrap 4, and this preset isn't necessary.
A Laravel frontend preset for Bootstrap 4, the latest version of Bootstrap.
Current version is the stable release of ^4.0.0
. To learn more about updating to the latest major release of Bootstrap, read the Migrating to v4 documentation.
Installation
You can install this package via composer:
composer require laravelnews/laravel-twbs4
The package will automatically register it's service provider.
Install the basic preset to only update the CSS and JavaScript files:
php artisan preset bootstrap4
Or if you want to install everything, including auth views:
php artisan preset bootstrap4-auth
Next, update NPM packages and build the CSS/JavaScript:
yarn && yarn dev
Or via NPM:
npm install && npm run dev
Important: Make sure you have a backup of your code. The presets update package.json
, and replace views, CSS, and JavaScript.
jQuery Slim
Bootstrap's download page includes jQuery slim. If you need $.ajax
, effects, and deprecated methods, you can change the following line in resources/assets/js/boostrap.js
to use the full jQuery installation:
window.$ = window.jQuery = require('jquery/dist/jquery.slim');
With full jQuery:
// Full jQuery window.$ = window.jQuery = require('jquery');
Variables
The Bootstrap 4 presets include the same familiar resources/assets/scss/_variables.scss
file, with some updated values to match Bootstrap 4 variable changes. This preset looks similar to the current 3.x
version that ships with Laravel, but isn't identical.
Here are the variables ported over thus far:
// Body $body-bg: #fff; // Borders $laravel-border-color: darken($body-bg, 10%); $list-group-border-color: $laravel-border-color; $card-border-color: $laravel-border-color; // Brands $primary: #3097D1; $info: #8eb4cb; $success: #2ab27b; $warning: #cbb956; $danger: #bf5329; // Typography $font-family-sans-serif: "Raleway", sans-serif; $font-size-base: .875rem; // 14px $line-height-base: 1.6; $text-color: #636b6f; // Inputs $input-border-color: lighten($text-color, 40%); $input-placeholder-color: lighten($text-color, 30%);
Screenshots
License
The MIT License (MIT). See License File for more information.