JSON test

HTML

<h1>Usage bar</h1>

<div id="usage-bar-empty"></div><!-- /usage-bar-empty -->
<div id="usage-bar-fill"></div><!-- /usage-bar-fill -->

CSS

#usage-bar-empty {
    position: absolute;
    width: 200px;
    height: 20px;
    border: 1px solid black;
}


#usage-bar-fill {
    position: absolute;
    width: 140px;
    height: 20px;
    background: green;
    border: 1px solid black;
}

JavaScript

{
   "general":{
      "logo":"assets/images/logo.png",
      "name" : "Company Name"
   },
   "navigation":[
      {
         "title":"Home",
         "link":"index.html"
      },
      {
         "title":"Products",
         "link":"product.html",
         "subnav":[
            {
               "title":"Webapps",
               "link":"products/webapps.html"
            },
            {
               "title":"Mobile Apps",
               "link":"products/mobile-apps.html"
            }
         ]
      }
   ],
   "modules":[
      {
         "type":"navigation",
         "container":"#header",
         "title":"Top Navigation",
         "attributes":{
            "class":"topNavigation",
            "id":"topNavigation"
         }
      },
      {
         "type":"content",
         "title":"Hi Welcome to mobile development",
         "subtitle":"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
         "container":"#maincontent",
         "attributes":{
            "class":"topContent"
         }
      },
      {
         "type":"form",
         "title":"Registration Form",
         "action":"submit.aspx",
         "name":"registrationform",
         "container":"#maincontent",
         "attributes":{
            "class":"registrationform"
         },
         "fields":[
            {
               "id":"firstname",
               "label":"First Name",
               "name":"fname",
               "type":"text",
               "value":""
            },
            {
               "id":"email",
               "label":"Email",
               "name":"email",
               "type":"text",
               "value":""
            },
            {
               "id":"countries",
               "label":"Country",
               "name":"countries",
               "type":"select",
               "options":[
                  {
                     "value":"",
                    ...