Uikit3 примеры вёрстки?

Question

[MegaPuxapb]

Разбираюсь с Uikit3 и никак не в курю как там сетка строится.
Кто верстал, киньте линк на свою работу.

Как сделать 12 колоночную сетку?

Comments

[alex-1917]

а бабло они за что с вас берут???

Answer 1

[Александр Решетняк]

Это вам не простецкий какой то там бутстрап)
Парни из YOOtheme делают фреймворк на новом уровне^ ^

Сетка UIKIT может быть сделана с помощью разных компонентов. Если например вам нужно сделать 12 колонок, то можно использовать компонент width
пример > https://codepen.io/AxeLVaisper/pen/PBoWjq

<div class="uk-child-width-expand@s uk-text-center uk-grid-collapse" uk-grid>
    <div>
        <div class="uk-tile">1</div>
    </div>
    <div>
        <div class="uk-tile">2</div>
    </div>
    <div>
        <div class="uk-tile">3</div>
    </div>
      <div>
        <div class="uk-tile">4</div>
    </div>
    <div>
        <div class="uk-tile">5</div>
    </div>
    <div>
        <div class="uk-tile">6</div>
    </div>
      <div>
        <div class="uk-tile">7</div>
    </div>
    <div>
        <div class="uk-tile">8</div>
    </div>
    <div>
        <div class="uk-tile">9</div>
    </div>
      <div>
        <div class="uk-tile">10</div>
    </div>
    <div>
        <div class="uk-tile">11</div>
    </div>
    <div>
        <div class="uk-tile">12</div>
    </div>
</div>

при подобном подходе UIKIT придаст дочерним дивам пропорциональную ширину

Читайте доки там доходчиво всё расписано https://getuikit.com/docs/
Много примеров по UIKIT 3 можно найти у меня https://codepen.io/collection/AevxaJ/

Похоже ваш единомышленник) > https://github.com/AlekVolsk/uikit-ex
Создал дополнительные классы.. зачем то)
Которые чаще всего на практике не применяются

Comments

[Алексей]

хорошо! а как сделать toggle menu ?

[Александр Решетняк]

https://asuikit.com/v3/components

Answer 2

[SpideR-KOSS]

В UiKit 3 сетку сделали 6-колоночной.