Unofficial NDS HTML Components

Appearance

Installation ​

This guide will help you set up and install the required CSS and JavaScript files in your project.

Required Files ​

1. Add the Material Icons Font ​

First, add the Material Icons font by including this link in your HTML <head> section:

html
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

2. Add the UO NDS CSS ​

Next, include the UO NDS stylesheet:

html
<link href="https://cdn.jsdelivr.net/gh/wdalhaj/uo-nds-html-assets@master/css/uo-nds-style.min.css" rel="stylesheet">

3. Add UO NDS JS files (Optional) ​

Some components require js plugin to run properly, include whenever you need :

  • uo-nds-nav.js : Top navigation menu
  • uo-nds-accordion.js : Accordion component
  • uo-nds-dropdown.js : Select/Dropdown component
html
<script src="https://cdn.jsdelivr.net/gh/wdalhaj/uo-nds-html-assets@master/js/uo-nds-nav.js"></script>
<script src="https://cdn.jsdelivr.net/gh/wdalhaj/uo-nds-html-assets@master/js/uo-nds-accordion.js"></script>
<script src="https://cdn.jsdelivr.net/gh/wdalhaj/uo-nds-html-assets@master/js/uo-nds-dropdown.js"></script>

Or download and host locally ​

Download the assets from GitHub and include it in your project.

Next Steps ​

After installing the CSS files, you can start using UO NDS components in your project. Check out our component guides for detailed usage instructions: