@geolid/ui-kit

Geolid UI Kit

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@geolid/ui-kit
0.0.36 years ago6 years agoMinified + gzip package size for @geolid/ui-kit in KB

Readme

Geolid UI Kit

<strong>A boostrap like front kit based on https://getuikit.com/</strong>

!CircleCIcircleci-badgecircleci-link !CSS sizecss-size-badgeunpkg-link !JS sizejs-size-badgeunpkg-link !npm versionnpm-version-badgenpm-link

<img src="screenshot.png"/>

Installation

Quick start with CDN

```html
<head>
<title>Title</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://unpkg.com/@geolid/ui-kit/dist/css/ui-kit.min.css" />
<script src="https://unpkg.com/@geolid/ui-kit/dist/js/ui-kit.min.js"></script>
</head>
<body>
</body>
```

CDN

CSS | Type | | |:------------------------|:----------------------------------------------------------------------| | Dev, latest | https://unpkg.com/@geolid/ui-kit/dist/css/ui-kit.css | | Dev, version fixed | https://unpkg.com/@geolid/ui-kit@0.0.1/dist/css/ui-kit.css | | Minified, latest | https://unpkg.com/@geolid/ui-kit/dist/css/ui-kit.min.css | | Minified, version fixed | https://unpkg.com/@geolid/ui-kit@0.0.1/dist/css/ui-kit.min.css | JS | Type | | |:------------------------|:----------------------------------------------------------------------| | Dev, latest | https://unpkg.com/@geolid/ui-kit/dist/js/ui-kit.js | | Dev, version fixed | https://unpkg.com/@geolid/ui-kit@0.0.1/dist/js/ui-kit.js | | Minified, latest | https://unpkg.com/@geolid/ui-kit/dist/js/ui-kit.min.js | | Minified, version fixed | https://unpkg.com/@geolid/ui-kit@0.0.1/dist/js/ui-kit.min.js |

NPM

npm install --save @geolid/ui-kit

Usage

Documentation can be found here https://getuikit.com/docs/javascript But to just to know if it works you can try this in your browser console: ```javascript UIkit.notification('Hello'); ```

Release process

⚠️ Release should be always done on the master branch 1) npm version <version> The version number follow the semver pattern 2) npm publish 3) That's it, the ui kit is updated on npm and the CDN Here are the detailed steps behind these 2 commands:
  • Run tests and linter
  • Bump the new version number in package.json
  • Build JS and CSS
  • Run the bundlesize check
  • Create a commit with all the freshly build files. The commit message is simply the new version number.
  • Create a git tag
  • Push the commit and the tag
  • Publish the new version on npm registry

Developpment

Requirements

  • node >= 8.2.0

Installation

git clone git@github.com:Geolid/ui-kit.git
cd ui-kit
npm install && npm start

Dev server

npm start
And then you can access html examples files here -> http://localhost:8080/tests/

Build

Build both production and developpement files:
npm run build

Adding a new html example

1) First create the html file in tests/ 2) Add the name of the file into the list in file tests/js/index.js