Skip to content

Web UI component library with the Qlik Sense look and feel.

License

Notifications You must be signed in to change notification settings

qlik-oss/leonardo-ui

Repository files navigation

leonardo-ui

Logo

A UI component framework with a slim and modern look & feel. Use it to enhance the UI of your web app! Works well with popular frameworks such as Bootstrap and Foundation. View it in action https://qlik-oss.github.io/leonardo-ui

CircleCI npm

Get started

Run the following command:

npm install --save leonardo-ui

Add the following to your html:

<head>
  <link rel="stylesheet" href="node_modules/leonardo-ui/dist/leonardo-ui.css" type="text/css"/>
</head>
<body>
  <!-- Page content -->
  <script src="node_modules/leonardo-ui/dist/leonardo-ui.js" type="text/javascript"></script>
</body>

To use the icon font (optional), add this to your CSS:

@font-face {
  font-family: "LUI icons";
  src: url(node_modules/leonardo-ui/dist/lui-icons.woff) format('woff'),
       url(node_modules/leonardo-ui/dist/lui-icons.ttf) format('truetype');
}

Example using a button

<button class="lui-button">Default</button>

Contributing

Please follow the instructions in CONTRIBUTING.md.