Blade Bootstrap Icons

https://github.com/davidhsianturi/blade-bootstrap-icons
Admin
A package that allows easy integration of Bootstrap Icons into Laravel Blade views using...
Tokens:410
Snippets:6
Trust Score:9.3
License:MIT
Update:1 year ago
Show doc for...
Tokens:
Raw
### Installing Blade Bootstrap Icons Package

Source: https://github.com/davidhsianturi/blade-bootstrap-icons/blob/main/README.md

This command installs the `davidhsianturi/blade-bootstrap-icons` package via Composer, making it available for use in your Laravel project. It's the first step to integrate Bootstrap Icons.

```Bash
composer require davidhsianturi/blade-bootstrap-icons
```

--------------------------------

### Applying CSS Classes to Bootstrap Icon Component

Source: https://github.com/davidhsianturi/blade-bootstrap-icons/blob/main/README.md

This example shows how to pass CSS classes to a Bootstrap Icon Blade component. The `class` attribute allows for easy styling of the SVG icon using Tailwind CSS or custom CSS rules.

```Blade
<x-bi-bell-fill class="text-primary"/>
```

--------------------------------

### Publishing Raw Bootstrap SVG Icons

Source: https://github.com/davidhsianturi/blade-bootstrap-icons/blob/main/README.md

This Artisan command publishes the raw SVG icon assets from the `blade-bootstrap-icons` package to your public directory. This is useful if you prefer to serve the SVGs directly rather than through Blade components.

```Bash
php artisan vendor:publish --tag=blade-bootstrap-icons --force
```

--------------------------------

### Using Bootstrap Icon as Blade Component

Source: https://github.com/davidhsianturi/blade-bootstrap-icons/blob/main/README.md

This snippet demonstrates the basic usage of a Bootstrap Icon as a self-closing Blade component. The component will be compiled into an SVG icon in the rendered HTML.

```Blade
<x-bi-bell-fill/>
```

--------------------------------

### Referencing Published Raw Bootstrap SVG Icon

Source: https://github.com/davidhsianturi/blade-bootstrap-icons/blob/main/README.md

After publishing, this snippet shows how to reference a raw Bootstrap SVG icon using Laravel's `asset()` helper. The icon can then be used within an `<img>` tag or other HTML elements.

```Blade
<img src="{{ asset('vendor/blade-bootstrap-icons/bell-fill.svg') }}" width="10" height="10"/>
```

--------------------------------

### Applying Inline Styles to Bootstrap Icon Component

Source: https://github.com/davidhsianturi/blade-bootstrap-icons/blob/main/README.md

This snippet illustrates how to apply inline CSS styles directly to a Bootstrap Icon Blade component. The `style` attribute provides granular control over the icon's appearance.

```Blade
<x-bi-bell-fill style="color: #555"/>
```
Tokens:
Raw