Иконки gridview bootstrap5

Общие вопросы по использованию второй версии фреймворка. Если не знаете как что-то сделать и это про Yii 2, вам сюда.
Ответить
iamguruman
Сообщения: 236
Зарегистрирован: 2018.05.10, 08:26

Иконки gridview bootstrap5

Сообщение iamguruman »

Доброе утро,

не соображу как использовать иконки "глаз", "корзина", "карандаш" в ссылках в последне версии yii2-basic

раньше было class = fas fa-eye

а сейчас вот такой код

Код: Выделить всё

<a href="/my-devices/view?id=0" title="View" aria-label="View" data-pjax="0"><svg aria-hidden="true" style="display:inline-block;font-size:inherit;height:1em;overflow:visible;vertical-align:-.125em;width:1.125em" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M573 241C518 136 411 64 288 64S58 136 3 241a32 32 0 000 30c55 105 162 177 285 177s230-72 285-177a32 32 0 000-30zM288 400a144 144 0 11144-144 144 144 0 01-144 144zm0-240a95 95 0 00-25 4 48 48 0 01-67 67 96 96 0 1092-71z"></path></svg></a>
подскажите пожалуйста
Аватара пользователя
Dominus
Сообщения: 892
Зарегистрирован: 2013.03.14, 21:27
Откуда: Россия, Иваново
Контактная информация:

Re: Иконки gridview bootstrap5

Сообщение Dominus »

Bootstrap 5 не включает набор иконок по умолчанию. Там предлагают использовать отдельный пакет иконок от Bootstrap https://bootstrap-4.ru/docs/5.0/extend/icons/

Для его установки нужно выполнить команду

Код: Выделить всё

composer require npm-asset/bootstrap-icons
Произвести подключение пакета, и использовать согласно документации https://icons.getbootstrap.su/

Таким же образом можно использовать и другие пакеты иконок.
Не спорь с дураком, иначе окружающие не правильно поймут кто из вас дурак!
iamguruman
Сообщения: 236
Зарегистрирован: 2018.05.10, 08:26

Re: Иконки gridview bootstrap5

Сообщение iamguruman »

Отлично! Спасибо! Получилось!

Теперь пробую вставить в gridview

Код: Выделить всё

<i class="bi bi-trash"></i>
и не выводится корзина...

А как проверить подключилось ли расширение? Поидее в коде должно что-то выводить на рендеренной странице, как распознать подключенные иконки?
Аватара пользователя
Dominus
Сообщения: 892
Зарегистрирован: 2013.03.14, 21:27
Откуда: Россия, Иваново
Контактная информация:

Re: Иконки gridview bootstrap5

Сообщение Dominus »

Подключение:

1. Создаем файл BootstrapIconsAsset.php в папке assets со следующим содержимым

Код: Выделить всё

<?php

namespace app\assets;

class BootstrapIconsAsset extends \yii\web\AssetBundle
{
    public $sourcePath = '@npm/bootstrap-icons';
    public $css = ['font/bootstrap-icons.css'];
}
2. Подключаем его в главном шаблоне views/layouts/main.php

Код: Выделить всё

//...
// подключаем
use app\assets\BootstrapIconsAsset;
// регистрируем
BootstrapIconsAsset::register($this);
3. Готово!

Пробуем вывести иконку корзины:

Код: Выделить всё

<i class="bi bi-trash"></i>
Иконки Bootstrap
iamguruman писал(а): 2022.09.12, 14:43 А как проверить подключилось ли расширение? Поидее в коде должно что-то выводить на рендеренной странице, как распознать подключенные иконки?
Посмотреть исходный код страницы, и там должен быть подключен файл стилей bootstrap-icons.css, при клике по которому, открывается этот файл.
Не спорь с дураком, иначе окружающие не правильно поймут кто из вас дурак!
iamguruman
Сообщения: 236
Зарегистрирован: 2018.05.10, 08:26

Re: Иконки gridview bootstrap5

Сообщение iamguruman »

Спасибо огромное!!!!!! Получилось
Ответить