1 files changed, 67 insertions, 0 deletions
diff --git a/VNF_Catalogue/views/index.jade b/VNF_Catalogue/views/index.jade
new file mode 100644
index 00000000..8cb91615
--- /dev/null
+++ b/VNF_Catalogue/views/index.jade
@@ -0,0 +1,67 @@
+extends layout
+
+//
+  Copyright (c) 2017 Kumar Rishabh and others.
+  All rights reserved. This program and the accompanying materials
+  are made available under the terms of the Apache License, Version 2.0
+  which accompanies this distribution, and is available at
+  http://www.apache.org/licenses/LICENSE-2.0
+block content
+  link(rel='stylesheet', href='/stylesheets/3rd_party/bootstrap.css')
+  .search-box
+    h1 VNF Catalogue
+    form.search-form
+      input.search-input(type='search', placeholder='Search...', id='Tags')
+      .space-10
+      button.search-button(type='submit', value='Search', id='Search') Search
+  .content.content-height-overwrite
+    nav.z-depth-0.transparent
+      .nav-wrapper
+        ul#nav-mobile.center.float-center-magic.hide-on-med-and-down.most-menu
+          li#lines_of_code.items
+            b Most Lines of Code
+          li#no_of_developers.items
+            b Most Developers
+          li#no_of_stars.items
+            b Most Stars 
+  .content
+    .container
+      .row#content
+        each key, index in json
+          .box-container
+            .col-md-3
+              .content-box
+                .content-data
+                  h1.content-title
+                    a(href='/project_profile?vnf_id=#{key.vnf_id}') #{key.vnf_name}
+                  .box
+                    img.img-size.commit-icon(src='/uploads/#{key.photo_url}')
+                    h3.commits
+                      | #{key.lines_of_code}
+                      br
+                      | Lines Of Code
+
+    footer
+      | © 2017 XYZ Company
+      script(src='/javascripts/index_search_max.js')
+  style(type='text/css').
+    input[type="text"]:focus:not([readonly]) {
+      transition: all 0s !important;
+      border-radius: 5px;
+      border: 2px solid #333333;
+      box-shadow: 0 0 15px 1px rgba(0,0,0,0.50);
+      color: #333333;
+    }
+    .gray {
+      background: rgb(249,249,249);
+    }
+    .img-size {
+      max-width:50px;
+      max-height:50px;
+    }
+    ul#nav-mobile li {
+      display: inline;
+    }
+    .float-center-magic {
+      left: -40%;
+    }