YOOtheme Pro is here! The best WordPress and Joomla theme. Learn more

UIkit 2.0 released

Simplified and with new markdown editor, sortable lists, datepicker and much more

UIkit 2.0 released

To take UIkit to the next level, we have been quite busy during the last two months. We completely overhauled the entire UIkit repository, simplified LESS variables, added a new component and squashed some bugs. An addition are the new add-ons which complement UIkit by offering extra functionality like a Markdown editor, datepicker, timepicker and more. Make sure to take a closer look at our Markdown editor which lets you write your markup with a realtime preview. The editor also supports syntax highlighting, an extendable toolbar and a full-screen mode.

New Add-ons

The new UIkit add-ons are stand-alone from UIkit and will be compiled separately. They can easily be included by adding their CSS and JavaScript files to the header of your UIkit project. All add-ons are stylable through UIkit themes and already come in different styles.

Besides the Markdown editor mentioned above, you now have the possibility of embedding a nifty datepicker in a form. Create a form password with a toggler to hide and show passwords. With the sortable add-on you can easily create lists that can be sorted by dragging and dropping. The sticky add-on makes elements remain at the top of the viewport, like a sticky navbar. And last but not least, the timepicker add-on to create a form input that simplifies time entries.

You will find detailed information on how to use these add-ons in the UIkit docs. If you are developing your own add-ons or have some ideas for improving the existing ones, send us a pull request. We appreciate any contribution!

New Components and icons

But that's not all! We added a new component - the toggle. It enables you to hide, switch or change the appearance of different contents through a button. It is also worth mentioning that we added the possibility of creating form icons. We also updated Font Awesome to 4.0.3 which brings you new icons. Please keep in mind that Font Awesome 4 also introduced new naming conventions. That is why a lot of icon class names have changed.

Simplified variables and themes

A major milestone are the refactored and simplified LESS variables of UIkit, which have been renamed and sorted into their appropriate component files. You no longer have to sift through a bunch of files to find a certain variable. Additionally created selectors are now stored in so called miscellaneous hooks, so their CSS will no longer be at the bottom of the compiled CSS file, but right next to their component. We also replaced CSS comments with LESS silent comments to establish more clarity in the compiled CSS.

Refactored file structure

We have splitted the theme folder structure into a default and a custom folder. The default folder stores all included UIkit themes. The stand-alone custom folder is the right place for developing your themes, because they will not be overwritten when updating to newer UIkit releases. Initially your custom themes will not be loaded within the Customizer. First you need to run the task grunt indexthemes on your UIkit folder. Now the newly created themes will be available automatically in the Customizer and test files. The custom folder is set to git ignore, which prevents your custom files from being pushed into the UIkit repository. Take a look at the documentation.

Bugs squashed

We fixed a couple of bugs, removed unnecessary hover events on touch devices and added better touch events support for Windows 8 Phones.

Showcase coming soon

Have you already built a website with UIkit? We are are preparing a showcase on getuikit.com and would love to show the best sites using UIkit. Just tweet us a link to your site.

If you like UIkit 2.0 please write and tweet about it and give us some feedback.

By Sascha | | Posted in UIkit

Comments (20)

  • smel


    | Profile |
    Shall we need to update warp 7 templates?
    If so you should publish a step-by-step guide on how to do so.
    PS. Template download page shows J 2.5 updates only as of date.
  • steffan


    | Profile |
    @smel We are uploading the new Warp 7.2 versions right now. Downloads should work again.
  • aude.lepresle


    | Profile |
    http://www.getuikit.com/ is not up to date.
    For exemple all the icons are broken.
    Maybe you should load the new version of UIKIT on your page :-)
    • sascha


      | Profile |
      It is up to date. Maybe clear your cache?
      • aude.lepresle


        | Profile |
        Yes sorry! Works well after clearing my cache :-)
  • finanztreff


    | Profile |
    UIkit is one amazing piece of code, plain and simple
  • akcreation


    | Profile |
    Am really loving uikit - keep up the great work, and am very excited for pagekit next. Are there any plans to add an image slideshow to the add-on's, this would be awesome!! I have tried with a few different jquery slideshows but they didn't work - must of been some conflict issues, but my js knowledge isn't great so I couldn't work it out. Would be great if uikit had it's own slideshow add-on that worked out the box
    • marcin.drogosz


      | Profile |
      You have mighty Widgetkit for that if you using Joomla or Wordpress.
      • akcreation


        | Profile |
        Hi marcin.drogosz,

        Sorry yes I wasn't clear - I'm referring to using uikit outside of Joomla or Wordpress

  • danilo.lutti


    | Profile |
    how can I do to update moreno uikit to uikit 2.0?
    • kennst


      | Profile |
      Update your tempalte. Just beware of the changes from UiKit 1 to 2. If you have customized your template.
  • ericb


    | Profile |
    I've been using UIKit instead of BootStrap for every project that I can, but there are still a couple things that I miss from Bootstrap. One of them was Affix, which you've just taken care of with the new Sticky addon, so thanks for that!

    The other is the Popover component. Maybe we'll see an add-on for that too eventually :-)

    The only other thing I miss is the full-featured datepicker for Bootstrap 2 and 3, with the ability to start with Month or Decade views--great for picking dates in the more distant past or future.

    Anyway, this looks like an kick-ass update, and now I'm more interested than ever to see what PageKit has to offer.
  • zrenjaninac


    | Profile |
    Great news...I love the UIkit.
    I only wish that you could hire more people and publish a new template every week....because they are awesome :D
  • marcus.palmer


    | Profile |
    Brilliant news lads & "laddetts"
  • michele.de.filippi


    | Profile |
    I want to say only...WOW!!!!!!!!
  • kirill.parkhomenko


    | Profile |
    Это же просто супер, ребята я обожаю вашу команду!!!
  • kennst


    | Profile |
    Good update.

    Why can't you include more of the layouts in Joomla 3.2 (ex. com_contact, com_weblinks, com_newsfeeds, com_users, com_weblinks, com_wrappers) in Warp (warp/systems/Joomla/layouts). Is it a big job to include it? Why have you chosen to take them out of the Joomla 3.2 package? You do include these in the 2.5 release. When they are not included, it breaks the good and easy update feature of the template.

    Has been asked for many times in the support section.
  • jacqueline.greenwood


    | Profile |
    What is it? Is it a WordPress Plugin? I am confused.
  • learnthings.africa


    | Profile |
    Yootheme we have always been very impressed with your work but this update to UI Kit is truly world class and I have to say I am sure there is no better front end kit. Now for vertical responsive-ness I think thats about the only thing you could add to it.
  • heinz.holeczek


    | Profile |
    Hey great to see a new update to UIkit.
    As I read through the new additions there was one modification I like the most.
    The new Markdown Editor looks like a pretty cool thing and so I thought if there would ever be a joomla extension which replaces the tinyMCE editor in the admin interface with this one?

Leave a comment

Please login to leave a comment.