Components
All kinds of useful, additional components which are not included in UIkit itself.
UIkit offers some advanced components that are not included in the UIkit core framework. Usually you wouldn't use these components in your everyday website. They include stuff like nestables and datepickers, which will come in handy, if you create advanced user interfaces like administration areas.
Usage
After you've downloaded UIkit, you can find all additional components in separate /css and /js folders:
/css
/components
<!-- Component with the basic style -->
autocomplete.css
autocomplete.min.css
<!-- Component with the Gradient style -->
autocomplete.gradient.css
autocomplete.gradient.min.css
<!-- Component with the Almost flat style -->
autocomplete.almost-flat.css
autocomplete.almost-flat.min.css
...
/js
/components
<!-- JavaScript of the component and minified version -->
autocomplete.js
autocomplete.min.js
...To use one of these components, all you need to do is to add the CSS and the component's JavaScript to the header of your document.
Example
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="uikit.min.css" />
<script src="jquery.js"></script>
<script src="uikit.min.js"></script>
<!-- Autocomplete CSS -->
<link rel="stylesheet" href="components/autocomplete.css">
<!-- Autocomplete Javascript -->
<script src="components/autocomplete.js"></script>
</head>
<body>
</body>
</html>Tests
UIkit provides test files for every component. Each of these pages contains test cases of its component and gives you an overview of all the possibilities that are supported out of the box.
In the ZIP file you will find all UIkit CSS, JavaScript and font files ready to use for your project. The core framework of UIkit has almost no styling in order to keep it slim. Therefore we provide two addidional distributions with a gradient and an almost flat style. Each style comes as a single CSS file as well as a minified version. Some components are also included, which are not part of the core framework and can be added separately to your project.
