Examples Downloads

Hubtel UI Documentation

Introduction

The Hubtel UI Documentation is a guide on how to implement the Hubtel Theme for web apps. The guide includes sample codes, visual guides and instructions on how to implement the theme.

Getting Started

This part of the documentation will help you to quick start your project and will give you a basic idea about how the Hubtel Theme works and how to make your Hubtel web app conform to the in-house UI standards.


Method 1

In order to link your Hubtel web application to the latest stylesheets, add the following codes in your _Layout.cshtml file in the given order before closing the </head> tag

The link is a bundle of stylesheets of the following plugins:
  • Bootstrap
  • Pages.CSS
  • Fontawesome
This is the latest CSS file for the Hubtel theme. The file is updated periodically.


Method 2

To jumpstart your project, download the theme assets here.

What's Included

The assets folder includes the following.


In order to get the best results implementing the theme, import the following:


Hubtel Stylesheet

<link rel="stylesheet" type="text/css" href="assets/css/app.css">

jQuery

<script type="text/javascript" src="assets/plugins/jquery/jquery.min.js"></script>

Bootstrap

CSS
<link rel="stylesheet" type="text/css" href="plugins/bootstrap/css/bootstrap.min.css">

Javascript
<script type="text/javascript" src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>

jQuery UI

<script type="text/javascript" src="assets/plugins/jquery-ui/jquery-ui.min.js" ></script>

Pages

CSS
<link rel="stylesheet" type="text/css" href="assets/plugins/pages/css/pages.css">

Javascript
<script type="text/javascript" src="assets/plugins/pages/js/pages.js"></script>