Blade Zondicons

https://github.com/codeat3/blade-zondicons
Admin
A package that provides easy integration of Zondicons into Laravel Blade views, allowing icons to be...
Tokens:649
Snippets:9
Trust Score:6.5
License:MIT
Update:1 year ago
Show doc for...
Tokens:
Raw
### Installing Blade Zondicons Package - Bash

Source: https://github.com/codeat3/blade-zondicons/blob/main/README.md

This command installs the Blade Zondicons package using Composer, making it available for use in a Laravel project. It adds the package as a dependency in your composer.json file.

```bash
composer require blade-ui-kit/blade-zondicons
```

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

### Applying Classes to Zondicon Blade Component - Blade

Source: https://github.com/codeat3/blade-zondicons/blob/main/README.md

This example shows how to pass CSS classes to a Zondicon Blade component. The specified classes will be applied to the rendered SVG icon, allowing for styling with frameworks like Tailwind CSS.

```blade
<x-zondicon-cloud class="w-6 h-6 text-gray-500"/>
```

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

### Referencing Published Zondicon SVG as Image Asset - Blade

Source: https://github.com/codeat3/blade-zondicons/blob/main/README.md

This example shows how to use a published raw Zondicon SVG icon as an image asset in a Blade view. The asset() helper generates the correct URL to the SVG file, which can then be used in an <img> tag.

```blade
<img src="{{ asset('vendor/blade-zondicons/cloud.svg') }}" width="10" height="10"/>
```

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

### Republishing Zondicons Assets (Blade Icons)

Source: https://github.com/codeat3/blade-zondicons/blob/main/UPGRADE.md

This command republishes the Blade Zondicons vendor assets, overwriting existing files. It's necessary when upgrading or if raw exported icons were previously used and need to be updated to the latest version. Requires Laravel and Blade Icons.

```bash
php artisan vendor:publish --tag=blade-zondicons --force
```

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

### Referencing Zondicon SVG Asset in Blade

Source: https://github.com/codeat3/blade-zondicons/blob/main/UPGRADE.md

This Blade snippet demonstrates the new method for referencing a Zondicon SVG asset within an HTML <img> tag. It uses Laravel's asset() helper to generate the correct public path to the SVG file. This is useful for directly embedding icons in views.

```blade
<img src="{{ asset('vendor/blade-zondicons/cloud.svg') }}" width="10" height="10"/>
```

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

### Publishing Blade Zondicons Configuration - Bash

Source: https://github.com/codeat3/blade-zondicons/blob/main/README.md

This Artisan command publishes the blade-zondicons.php configuration file, allowing users to customize Blade Icons features like default classes and attributes for Zondicons.

```bash
php artisan vendor:publish --tag=blade-zondicons-config
```

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

### Publishing Raw Zondicons SVG Assets - Bash

Source: https://github.com/codeat3/blade-zondicons/blob/main/README.md

This Artisan command publishes the raw Zondicon SVG icons to the public vendor directory. The --force flag ensures existing files are overwritten, making the SVGs directly accessible as assets.

```bash
php artisan vendor:publish --tag=blade-zondicons --force
```

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

### Using Zondicon as Self-Closing Blade Component - Blade

Source: https://github.com/codeat3/blade-zondicons/blob/main/README.md

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

```blade
<x-zondicon-cloud/>
```

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

### Applying Inline Styles to Zondicon Blade Component - Blade

Source: https://github.com/codeat3/blade-zondicons/blob/main/README.md

This snippet illustrates how to apply inline CSS styles directly to a Zondicon Blade component. The style attribute's value will be rendered as inline styles on the resulting SVG element.

```blade
<x-zondicon-cloud style="color: #555"/>
```
Tokens:
Raw