Added Search_Results Page

Also added animations and actions pertaining
to index and search_results page.

Change-Id: If3966991f165626ca2b13a4ac62af6a777a22903
Signed-off-by: Kumar Rishabh <shailrishabh@gmail.com>

3 files changed, 216 insertions, 240 deletions

diff --git a/utils/test/vnfcatalogue/VNF_Catalogue/views/index.jade b/utils/test/vnfcatalogue/VNF_Catalogue/views/index.jade
index b183f360f..e60c3ba26 100644
--- a/utils/test/vnfcatalogue/VNF_Catalogue/views/index.jade
+++ b/utils/test/vnfcatalogue/VNF_Catalogue/views/index.jade
@@ -1,131 +1,122 @@
-doctype html
+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
-html(lang='en')
-  head
-    meta(charset='UTF-8')
-    title Document
-    link(rel='stylesheet', href='/stylesheets/3rd_party/bootstrap.css')
-    link(rel='stylesheet', href='/stylesheets/style.css')
-  body
-    script(type='text/javascript' src='http://code.jquery.com/jquery.min.js')
-    script(src='/javascripts/global.js')
-    header
-      ul.navigation
-        li.logo
-        li.links
-          a(href='#') Projects
-        li.links
-          a(href='#') People
-        li.links
-          a(href='#') About
-      ul.navigation-right
-        li.signup
-          a(href='#') Sign up
-        li.option or
-        li.signin
-          a(href='#') Sign in
-    .search-box
-      h1 VNF Catalogue
-      form.search-form
-        input.search-input(type='text', placeholder='Search...', id='Tags')
-        .space-10
-        button.search-button(type='submit', value='Search', id='Search') Search
-    .content
-      ul.most-menu
-        li.items.active
-          a(href='#') Most Popular
-        li.items
-          a(href='#') Most Active
-        li.items
-          a(href='#') Most Active Contributions
-      .container
-        .row
-          .box-container
-            .col-md-3
-              .content-box
-                .content-data
-                  h1.content-title AAA
-                  .box
-                    img.commit-icon(src='/images/3rd_party/commits.png')
-                    h3.commits
-                      | 4,845
-                      br
-                      | commits
+block content
+  .search-box
+    h1 VNF Catalogue
+    form.search-form
+      input.search-input(type='text', 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.float-center-magic.hide-on-med-and-down.most-menu
+          li.items
+            a(href='#') Most Popular
+          li.items
+            a(href='#') Most Active
+          li.items
+            a(href='#') Most Active Contributions
+  .content
+    .container
+      .row
+        .box-container
           .col-md-3
             .content-box
               .content-data
-                h1.content-title AAA
+                h1.content-title Beacon
                 .box
                   img.commit-icon(src='/images/3rd_party/commits.png')
                   h3.commits
                     | 4,845
                     br
                     | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-      footer
-        | © 2017 OPNFV
-script.
+        .col-md-3
+          .content-box
+            .content-data
+              h1.content-title Beacon
+              .box
+                img.commit-icon(src='/images/3rd_party/commits.png')
+                h3.commits
+                  | 4,845
+                  br
+                  | commits
+        .col-md-3
+          .content-box
+            .content-data
+              h1.content-title Beacon
+              .box
+                img.commit-icon(src='/images/3rd_party/commits.png')
+                h3.commits
+                  | 4,845
+                  br
+                  | commits
+        .col-md-3
+          .content-box
+            .content-data
+              h1.content-title Beacon
+              .box
+                img.commit-icon(src='/images/3rd_party/commits.png')
+                h3.commits
+                  | 4,845
+                  br
+                  | commits
+        .col-md-3
+          .content-box
+            .content-data
+              h1.content-title Beacon
+              .box
+                img.commit-icon(src='/images/3rd_party/commits.png')
+                h3.commits
+                  | 4,845
+                  br
+                  | commits
+        .col-md-3
+          .content-box
+            .content-data
+              h1.content-title Beacon
+              .box
+                img.commit-icon(src='/images/3rd_party/commits.png')
+                h3.commits
+                  | 4,845
+                  br
+                  | commits
+        .col-md-3
+          .content-box
+            .content-data
+              h1.content-title Beacon
+              .box
+                img.commit-icon(src='/images/3rd_party/commits.png')
+                h3.commits
+                  | 4,845
+                  br
+                  | commits
+        .col-md-3
+          .content-box
+            .content-data
+              h1.content-title Beacon
+              .box
+                img.commit-icon(src='/images/3rd_party/commits.png')
+                h3.commits
+                  | 4,845
+                  br
+                  | commits
+    footer
+      | © 2017 XYZ Company
+  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);
+    }
diff --git a/utils/test/vnfcatalogue/VNF_Catalogue/views/layout.jade b/utils/test/vnfcatalogue/VNF_Catalogue/views/layout.jade
index 7cc7dfc92..89142f813 100644
--- a/utils/test/vnfcatalogue/VNF_Catalogue/views/layout.jade
+++ b/utils/test/vnfcatalogue/VNF_Catalogue/views/layout.jade
@@ -5,11 +5,49 @@ doctype html
   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
+html(lang='en')
 html
     head
         title= title
+        link(rel='stylesheet', href='/stylesheets/3rd_party/bootstrap.css')
+        link(rel='stylesheet', href='/3rd_party/materialize/css/materialize.css')
+        script(type='text/javascript', src='https://code.jquery.com/jquery-3.1.1.min.js')
+        script(src='/javascripts/global.js')
+        script(src='/3rd_party/materialize/js/materialize.js')
+        link(href='https://fonts.googleapis.com/icon?family=Material+Icons', rel='stylesheet')
         link(rel='stylesheet', href='/stylesheets/style.css')
     body
+        header
+          nav.transparent.z-depth-0
+            .nav-wrapper
+              a.button-collapse(href='#', data-activates='mobile-demo')
+                i.material-icons menu
+              ul#nav-mobile.left.hide-on-med-and-down
+                li
+                  a(href='#')
+                    img.left.brand-logo.brand-logo-extends
+                li
+                  a(href='#') Projects
+                li
+                  a(href='#') People
+                li
+                  a(href='#') About
+              ul#nav-mobile.right.hide-on-med-and-down
+                li.signup
+                  a(href='#') Sign up
+                li.option or
+                li.signin
+                  a(href='#') Sign in
+              ul#mobile-demo.side-nav
+                li
+                  a(href='#') Projects
+                li
+                  a(href='#') People
+                li
+                  a(href='#') About
+                li.signup
+                  a(href='#') Sign up
+                li.signin
+                  a(href='#') Sign in
         block content
-        script(src='http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js')
-        script(src='/javascripts/global.js')
+
diff --git a/utils/test/vnfcatalogue/VNF_Catalogue/views/search_projects.jade b/utils/test/vnfcatalogue/VNF_Catalogue/views/search_projects.jade
index 3076543af..6670d212c 100644
--- a/utils/test/vnfcatalogue/VNF_Catalogue/views/search_projects.jade
+++ b/utils/test/vnfcatalogue/VNF_Catalogue/views/search_projects.jade
@@ -1,128 +1,75 @@
-doctype html
+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
-html(lang='en')
-  head
-    meta(charset='UTF-8')
-    title Document
-    link(rel='stylesheet', href='/stylesheets/3rd_party/bootstrap.css')
-    link(rel='stylesheet', href='/stylesheets/style.css')
-  body
-    header
-      ul.navigation
-        li.logo
-        li.links
-          a(href='#') Projects
-        li.links
-          a(href='#') People
-        li.links
-          a(href='#') About
-      ul.navigation-right
-        li.signup
-          a(href='#') Sign up
-        li.option or
-        li.signin
-          a(href='#') Sign in
-    .search-box
-      h1 VNF Catalogue
-      form.search-form
-        input.search-input(type='text', placeholder='Search...')
-        .space-10
-        button.search-button(type='submit', value='Search') Search
-    .content
-      ul.most-menu
-        li.items.active
-          a(href='#') Most Popular
-        li.items
-          a(href='#') Most Active
-        li.items
-          a(href='#') Most Active Contributions
-      .container
-        .row
-          .box-container
-            .col-md-3
-              .content-box
-                .content-data
-                  h1.content-title AAA
-                  .box
-                    img.commit-icon(src='/images/3rd_party/commits.png')
-                    h3.commits
-                      | 4,845
-                      br
-                      | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-          .col-md-3
-            .content-box
-              .content-data
-                h1.content-title AAA
-                .box
-                  img.commit-icon(src='/images/3rd_party/commits.png')
-                  h3.commits
-                    | 4,845
-                    br
-                    | commits
-      footer
-        | © 2017 OPNFV
+block content
+  .search-box
+    .form-group-custom.form-group.has-feedback
+      input.search-input-rest.form-control(type='text', placeholder='Search...', id='Tags')
+      i.material-icons search
+  .content
+    .container
+      .card.card-shadow-custom.horizontal
+        .row.row-custom
+          .col.s5.card-title-div-custom
+            span.card-title.card-title-span-custom Card Title
+          .col.s5.card-title-div-custom
+            i.material-icons grade
+            span.card-title PenguinScore: 42
+          .col.s2.card-title-div-custom-right
+            form(action='#')
+              input#search_result_1(type='checkbox')
+              label(for='search_result_1') Compare
+          //
+            <div class="card-action">
+            <a href="#">This is a link</a>
+            </div>
+          .col.s4.card-image
+            img.card-image-picture-custom(src='/images/logo.png')
+          .col.s8.card-stacked
+            .card-content
+              p
+                .collection.collection-custom
+                  a.collection-item(href='#!')
+                    span
+                      i.material-icons code
+                      |                             Lines Of Code: 1.03M
+                  a.collection-item(href='#!')
+                    span
+                      i.material-icons code
+                      |                             Lines Of Code: 1.03M
+                  a.collection-item(href='#!')
+                    span
+                      i.material-icons code
+                      |                             Lines Of Code: 1.03M
+                  a.collection-item(href='#!')
+                    span
+                      i.material-icons code
+                      |                             Lines Of Code: 1.03M
+            .card-action
+              | Tags: 
+              .chip
+                a.a-custom(href='#!') Tag1
+              .chip
+                a.a-custom(href='#!') Tag2
+              .chip
+                a.a-custom(href='#!') Tag3
+              .chip
+                a.a-custom(href='#!') Tag4
+              .chip
+                a.a-custom(href='#!') Tag5
+              a.a-custom-more(href='#!') more
+          .divider
+          .card-action-custom.col.s12.card-action
+            | License: 
+            a(href='#') MIT
+            |                     Complexity: 
+            a(href='#') Atomic
+  footer
+    | © 2017 XYZ Company
+    link(rel='stylesheet', href='/stylesheets/search_projects.css')
+