Laravel bootstrap components

Since all components have been created in the Template Engine Blade, it is no longer necessary to edit completly HTML of component of Bootstrap. This saves a lot of time in development. If you still want to change the component, you only have to do this in one file and not in the whole project. All changes are automatically transferred throughout the project. Bootstrap updates will no longer be a problem for you. All new features are automatically updated. You just have to install the latest version of LBC and your project is up to date.

Convince yourself and look here: Examples

Installation

  1. Unzip the package
  2. Paste all folders and files in the Laravel root dir
    app/Lbc and resources/views/lbc.
  3. Install following composer und npm packages.
    composer require shawnsandy/img-fly
    composer require riverskies/laravel-mobile-detect
    npm i vanilla-lazyload
    npm i prismjs
  4. Add the line in resources/assets/sass/app.scss after the bootstrap.scss import.
    @import  '../../lbc/assets/sass/app';
  5. Add the line in resources/assets/js/app.js.
    require('../../lbc/assets/js/app')
  6. Add the following to routes/web.php.
    // Images resize
    use ShawnSandy\ImgFly\Classes\ImgflyFacade;
    Imgfly::routes();
    
    // LBC basics
    App\Lbc\LaravelBootstrapComponents::init();
    
    // abc.com/lbc If you want to have the docs for it
    App\Lbc\LaravelBootstrapComponents::initDocs();
  7. Run npm run production and finish

Small characters, big effect

Image =
<picture>
  <source media="(min-width: 768px)
    srcset="images/examples/example-1024.jpg"
    data-srcset="images/examples/example-1024.jpg">
  <source media="(max-width: 768px)"
    srcset="images/examples/example-100.jpg"
    data-srcset="images/examples/example-100.jpg">
  <img class="img-fluid mb-3 loaded"
    src="images/examples/example-100.jpg"
    alt="Image"
    data-lazy="true"
    width="100"
    height="100"
    data-src="https://via.placeholder.com/255"
    data-was-processed="true">
</picture>

Package

  • Regular updates
  • E-Mail Support
  • Bootstrap components in the Laravel-Template-Engine Blade
  • Many more utilitie css classes
  • Documentation
  • Template-Examples
  • Lazyload for images (vanilla-lazyload)
  • Mobile detect (riverskies/laravel-mobile-detect)
  • Image-Resize Tool (shawnsandy/img-fly)

Thank you for your attention

Buy now