ruwmapps/yii2_uikit3

Uikit 3 for Yii2

0.0.7 2020-03-18 12:31 UTC

Requires

• ruwmapps/yii2_uikit3: *
• yiisoft/yii2: >=2.0.6

MIT

• Aleksandr Smirnov

• widgets
• yii2
• uikit3

README

Виджет и стили от фреймворка UiKit3

Установка

Установка через composer. Выполнить команду

php composer.phar require --prefer-dist ruwmapps/yii2_uikit3

или

composer require "ruwmapps/yii2_uikit3:*"

Подключение основных файлов css и js фреймворка UiKit3

\ruwmapps\yii2_uikit3\UikitAsset::register($this);

Примеры использования Slideshow:

Подключение файла Slideshow.php

<? use ruwmapps\yii2_uikit3\widgets\Slideshow; ?>

Пример Uikit3 Slideshow без оверлея 2мя способами:

• указания полного пути к папке с картинками

<?= Slideshow::widget(['path' => '/img/slideshow/','ukSlideshow' => 'animation:fade; autoplay:true; autoplay-interval: 3000','downLi' => 1]); ?>

• или указания конкретных изображений

<?= Slideshow::widget(['images' => ['/img/slideshow/dark.jpg','/img/slideshow/light.jpg'],'ukSlideshow' => 'animation:fade; autoplay:true; autoplay-interval: 3000','downLi' => 1]); ?>

Пример Uikit3 Slideshow с оверлеем:

<?= Slideshow::widget(['items' => [
                    ['img'=>'/img/slideshow/dark.jpg','overlay'=>'<h3 class="uk-margin-remove">Заголовок</h3><p class="uk-margin-remove">Текст к первой картинке.</p>','classOver'=>'uk-position-bottom uk-position-medium uk-text-center uk-light'],
                    ['img'=>'/img/slideshow/light.jpg','overlay'=>'<h3 class="uk-margin-remove">Заголовок</h3><p class="uk-margin-remove">Текст ко второй картинке.</p>','classOver'=>'uk-overlay uk-overlay-primary uk-position-bottom uk-text-center'],
                ]
                ]); ?>

Демо + инструкции Yii2.wmapps.ru