Bootstrap Material Design is a project done by FezVrasta. It is a theme compatible for bootstrap 3 and it's really a nice theme that everyone can work with Laravel 5. You can read more about in this here.
Grab the latest stable zip archive of this project. Then skip all steps and proceed to Post Install.
$ composer create-project laravel/laravel laravel-bootstrap-md "5.2.*" --prefer-dist$ laravel new laravel-bootstrap-mdcd into the public folder in your project's root directory
$ bower install bootstrap-material-designAdd the necessary links to your <head> element for fonts and stylsheets:
<!-- Bootstrap Material -->
<link rel="stylesheet" type="text/css" href="{{ URL::asset('bower_components/bootstrap/dist/css/bootstrap.css') }}">
<link rel="stylesheet" type="text/css" href="{{ URL::asset('bower_components/bootstrap-material-design/dist/css/material-icons.css') }}">
<link rel="stylesheet" type="text/css" href="{{ URL::asset('bower_components/bootstrap-material-design/dist/css/bootstrap-material-design.min.css') }}">
<link rel="stylesheet" type="text/css" href="{{ URL::asset('bower_components/bootstrap-material-design/dist/css/ripples.min.css') }}">
<!-- End of Bootstrap Material -->And before your </body> element for scripts:
<!-- Bootstrap Material -->
<script type="text/javascript" src="{{ URL::asset('bower_components/jquery/dist/jquery.min.js') }}"></script>
<script type="text/javascript" src="{{ URL::asset('bower_components/bootstrap/dist/js/bootstrap.min.js') }}"></script>
<script type="text/javascript" src="{{ URL::asset('bower_components/bootstrap-material-design/dist/js/material.min.js') }}"></script>
<script type="text/javascript" src="{{ URL::asset('bower_components/bootstrap-material-design/dist/js/ripples.min.js') }}"></script>
<script type="text/javascript" src="{{ URL::asset('bower_components/bootstrap-material-design/dist/js/snackbar.min.js') }}"></script>
<!-- IMPORTANT -->
<script>
$.material.init();
</script>
<!-- End of Bootstrap Material -->Note: Material Design Theme don't include material icons when you bower install it. But it's already have been setup in this project and you can run it locally. But if your project is tend for online use you can follow this github.
cd into project root directory and run:
$ composer installAfter all dependencies were already installed, don't forget to generate your key:
$ php artisan key:generateAll Done!
I also find it awesome if I include Toastr in this project.
cd into public folder of your project and run:
$ bower install toastrsee toastr.js
And add this necessary links after your <head> element:
<!-- Toastr -->
<link rel="stylesheet" type="text/css" href="{{ URL::asset('bower_components/toastr/toastr.min.css') }}">
<script type="text/javascript" src="{{ URL::asset('bower_components/jquery/dist/jquery.min.js') }}"></script>
<script type="text/javascript" src="{{ URL::asset('bower_components/toastr/toastr.min.js') }}"></script>
<!-- End of Toastr -->- Either run
composer require oriceon/toastr-5-laravelor add"oriceon/toastr-5-laravel": "dev-master"to therequirekey incomposer.jsonand runcomposer update. - Add
Kamaln7\Toastr\ToastrServiceProvider::class,to the providers key inconfig/app.php. - Add
'Toastr' => Kamaln7\Toastr\Facades\Toastr::class,to thealiaseskey inconfig/app.php.
Run:
$ php artisan vendor:publishcd back into your project root directory and run:
$ php artisan make:authNote: If you run this command it is important for all your neccessary links above to put in <yourproject>/resources/views/layouts/app.blade.php.
- Configure your
.envfile and runphp artisan migrate. Cloning or downloading this project will not provide with.envfile, so you must run this command to make your.envfile:
$ php -r "copy('.env.example', '.env');"- Open your project in your favorite editor and go to
<yourproject>/resources/views/auth, openlogin.blade.phpand replace it with login.blade.php - Open
register.blade.phpand replace with register.blade.php - Open
AuthController.phpand put this code inprotected function validator(array $data):
$title = "Oops!";
$message = "Please make sure to fill all required fields.";
$options = [
'progressBar' => true,
'positionClass' => 'toast-top-right',
'timeOut' => 6000,
];
Toastr::error($message, $title, $options);Run:
$ php artisan serveGo to http://localhost:8000. Try to register with the invalid authentication and Toastr will appear.
Congratulations!!!