Styled the navbar; allowed collapsing it to give the user more screen space

Gemfile

@@ -1,6 +1,7 @@
 source 'https://rubygems.org'
 
 gem 'sinatra', '~> 3.0'
+gem 'sinatra-contrib', '~> 3.0'
 gem 'puma', '~> 6.0'
 
 gem 'sequel', '~> 5.63'

Gemfile.lock

@@ -6,6 +6,7 @@ GEM
     listen (3.7.1)
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
+    multi_json (1.15.0)
     mustermann (3.0.0)
       ruby2_keywords (~> 0.0.1)
     nio4r (2.5.8)
@@ -26,6 +27,12 @@ GEM
       rack (~> 2.2, >= 2.2.4)
       rack-protection (= 3.0.4)
       tilt (~> 2.0)
+    sinatra-contrib (3.0.4)
+      multi_json
+      mustermann (~> 3.0)
+      rack-protection (= 3.0.4)
+      sinatra (= 3.0.4)
+      tilt (~> 2.0)
     sqlite3 (1.5.4-x64-mingw-ucrt)
     sqlite3 (1.5.4-x86_64-linux)
     tilt (2.0.11)
@@ -39,6 +46,7 @@ DEPENDENCIES
   rerun
   sequel (~> 5.63)
   sinatra (~> 3.0)
+  sinatra-contrib (~> 3.0)
   sqlite3 (~> 1.5)
 
 BUNDLED WITH

Gruntfile.js

@@ -19,6 +19,21 @@ module.exports = function(grunt) {
       }
     },
 
+    coffee: {
+      options: {
+        sourceMap: true,
+        style: 'compressed'
+      },
+      files: {
+        expand: true,
+        flatten: true,
+        cwd: 'assets/coffee',
+        src: ['*.coffee'],
+        dest: 'public/js',
+        ext: '.js'
+      }
+    },
+
     watch: {
       css: {
         files: ['assets/styles/**/*.scss'],
@@ -27,15 +42,24 @@ module.exports = function(grunt) {
           atBegin: true,
           spawn: false
         }
+      },
+      js: {
+        files: ['assets/coffee/*.coffee'],
+        tasks: ['coffee'],
+        options: {
+          atBegin: true,
+          spawn: false
+        }
       }
     }
   });
 
   // Load plugins.
-  grunt.loadNpmTasks('grunt-contrib-watch');
   grunt.loadNpmTasks('grunt-contrib-sass');
+  grunt.loadNpmTasks('grunt-contrib-coffee');
+  grunt.loadNpmTasks('grunt-contrib-watch');
 
-  // CLI tasks.
+  // Default task(s).
-  grunt.registerTask('default', ['sass']);
+  grunt.registerTask('default', ['sass', 'coffee']);
 
 };

Rakefile

@@ -1,3 +1,5 @@
+require 'bundler/setup'
+
 require 'sequel'
 require 'sqlite3'
 

assets/coffee/gargoyle.coffee

@@ -0,0 +1,12 @@
+$(document).ready( ->
+
+  $('#nav-toggle').on('click', toggleNav)
+
+)
+
+toggleNav = () ->
+  bodyElem = $('body')
+  if bodyElem.hasClass('collapsed')
+    bodyElem.removeClass('collapsed')
+  else
+    bodyElem.addClass('collapsed')

assets/styles/kraken.scss

@@ -6,6 +6,14 @@ $box-shadow-2: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
 body{
   background: lightgrey;
   padding-left: $nav-width;
+  transition: padding-left 230ms ease-in-out;
+}
+
+.card{
+  padding: 20px 30px;
+  background: white;
+  border-radius: 5px;
+  box-shadow: $box-shadow-2;
 }
 
 #main-nav{
@@ -19,9 +27,21 @@ body{
   color: white;
   box-shadow: $box-shadow-1;
   box-sizing: border-box;
+  transition: left 230ms ease-in-out;
 
   h3{
-    text-align: center;
+    padding-left: 15px;
+    text-align: left;
+
+    i{
+      position: absolute;
+      right: 22px;
+      margin-top: 5px;
+      font-size: 3rem;
+      &:hover{
+        cursor: pointer;
+      }
+    }
   }
 
   ul{
@@ -34,6 +54,13 @@ body{
       &:first-child{
         border-top: 1px solid #999;
       }
+
+      i{
+        position: absolute;
+        right: 18px;
+        margin-top: 5px;
+        font-size: 3rem;
+      }
     }
 
     a{
@@ -53,13 +80,38 @@ body{
   }
 }
 
+body.collapsed{
+  padding-left: 64px;
+}
+body.collapsed #main-nav{
+  left: calc($nav-width * -1 + 64px);
+}
+
+#main-actions{
+  width: 100%;
+  max-width: 100%;
+  margin-top: 0;
+  margin-bottom: 25px;
+
+  form,
+  input{
+    margin: 0;
+  }
+}
+
 #main-wrapper{
   max-width: 1200px;
   margin-top: 25px;
-  padding: 20px 30px;
+}
-  background: white;
+
-  border-radius: 5px;
+#main-wrapper.container.fluid{
-  box-shadow: $box-shadow-2;
+  width: 100%;
+  max-width: 100%;
+  margin: 0;
+}
+
+#site-header{
+  margin-bottom: 0;
 }
 
 #item-header,

db/migrations/0001_add_items_table.rb

@@ -10,8 +10,8 @@ Sequel.migration do
       String :type
       String :purchased_from
       DateTime :purchased_at
-      DateTime :created_at
+      DateTime :created_at, default: Sequel::CURRENT_TIMESTAMP
-      DateTime :updated_at
+      DateTime :updated_at, default: Sequel::CURRENT_TIMESTAMP
     end
   end
 

db/migrations/0002_add_item_comments_table.rb

@@ -4,8 +4,8 @@ Sequel.migration do
     create_table(:item_comments) do
       primary_key :id
       String :body, null: false
-      DateTime :created_at
+      DateTime :created_at, default: Sequel::CURRENT_TIMESTAMP
-      DateTime :updated_at
+      DateTime :updated_at, default: Sequel::CURRENT_TIMESTAMP
     end
 
     alter_table(:item_comments) do

db/migrations/0004_add_license_comments_table.rb

@@ -4,12 +4,12 @@ Sequel.migration do
     create_table(:license_comments) do
       primary_key :id
       String :body, null: false
-      DateTime :created_at
+      DateTime :created_at, default: Sequel::CURRENT_TIMESTAMP
-      DateTime :updated_at
+      DateTime :updated_at, default: Sequel::CURRENT_TIMESTAMP
     end
 
     alter_table(:license_comments) do
-      add_foreign_key :license_id, :items
+      add_foreign_key :license_id, :licenses
     end
   end
 

lib/models/item.rb

@@ -2,6 +2,10 @@ class Item < Sequel::Model
 
   one_to_many :item_comments
 
+  def getLink()
+    return "/item/#{self.id}"
+  end
+
   def type_selected?(option)
     if self.type == option
       return 'selected'

lib/models/license.rb

@@ -2,4 +2,8 @@ class License < Sequel::Model
 
   one_to_many :license_comments
 
+  def getLink()
+    return "/license/#{self.id}"
+  end
+
 end

lib/routes.rb

@@ -1,163 +1,7 @@
-get '/' do
+require_relative 'routes/index.rb'
-  items = Item.reverse(:updated_at).limit(10).all()
-  erb :index, :locals => {
-    :title => 'Dashboard',
-    :items => items
-  }
-end
 
-get '/item' do
+require_relative 'routes/item.rb'
-  redirect '/item/list'
-end
-get '/item/list' do
-  items = Item.reverse(:updated_at).all()
-  erb :'item/list', :locals => {
-    :title => 'List of Items',
-    :items => items
-  }
-end
 
-get '/item/create' do
+require_relative 'routes/license.rb'
-  erb :'item/create', :locals => {
-    :title => 'Create New Item'
-  }
-end
-post '/item/create' do
-  item = Item.create(
-    name: params[:item_name],
-    serial_number: params[:item_serial],
-    sku_number: params[:item_sku],
-    purchased_from: params[:item_purchase_from],
-    purchased_at: params[:item_purchase_date],
-    manufacturer: params[:item_manufacturer],
-    type: params[:item_type]
-  )
 
-  redirect "/item/#{item.id}"
+require_relative 'routes/search.rb'
-end
-
-get '/item/:item_id' do
-  item = Item.where(id: params[:item_id]).first()
-  puts "#{item.name}"
-  erb :'item/view', :locals => {
-    :title => item.name,
-    :item => item
-  }
-end
-
-get '/item/:item_id/edit' do
-  item = Item.where(id: params[:item_id]).first()
-  puts "#{item.name}"
-  erb :'item/edit', :locals => {
-    :title => "Editing: #{item.name}",
-    :item => item
-  }
-end
-post '/item/:item_id/edit' do
-  item = Item.where(id: params[:item_id]).first()
-
-  item.name = params[:item_name]
-  item.serial_number = params[:item_serial]
-  item.sku_number = params[:item_sku]
-  item.purchased_from = params[:item_purchase_from]
-  item.purchased_at = params[:item_purchase_date]
-  item.manufacturer = params[:item_manufacturer]
-  item.type = params[:item_type]
-  item.save()
-
-  redirect "/item/#{item.id}"
-end
-
-get '/item/:item_id/delete' do
-  item = Item.where(id: params[:item_id]).first()
-  item.delete()
-
-  redirect '/item/list'
-end
-
-post '/item/:item_id/comment' do
-  item = Item.first(id: params[:item_id])
-
-  comment = ItemComment.create(body: params[:comment_body])
-  item.add_item_comment(comment)
-
-  redirect "/item/#{item.id}"
-end
-
-get '/license' do
-  redirect '/license/list'
-end
-get '/license/list' do
-  licenses = License.reverse(:updated_at).all()
-  erb :'license/list', :locals => {
-    :title => 'List of Licenses',
-    :licenses => licenses
-  }
-end
-
-get '/license/create' do
-  erb :'license/create', :locals => {
-    :title => 'Create New License'
-  }
-end
-post '/license/create' do
-  license = License.create(
-    name: params[:license_name],
-    key: params[:license_key],
-    manufacturer: params[:license_manufacturer],
-    seats_used: params[:license_seats_used],
-    seats_total: params[:license_seats_total],
-    purchased_from: params[:license_purchase_from],
-    purchased_at: params[:license_purchase_date]
-  )
-
-  redirect "/license/#{license.id}"
-end
-
-get '/license/:license_id' do
-  license = License.where(id: params[:license_id]).first()
-  puts "#{license.name}"
-  erb :'license/view', :locals => {
-    :title => license.name,
-    :license => license
-  }
-end
-
-get '/license/:license_id/edit' do
-  license = License.where(id: params[:license_id]).first()
-  puts "#{license.name}"
-  erb :'license/edit', :locals => {
-    :title => "Editing: #{license.name}",
-    :license => license
-  }
-end
-post '/license/:license_id/edit' do
-  license = License.where(id: params[:license_id]).first()
-
-  license.name = params[:license_name]
-  license.key = params[:license_key]
-  license.manufacturer = params[:license_manufacturer]
-  license.seats_used = params[:license_seats_used]
-  license.seats_total = params[:license_seats_total]
-  license.purchased_from = params[:license_purchase_from]
-  license.purchased_at = params[:license_purchase_date]
-  license.save()
-
-  redirect "/license/#{license.id}"
-end
-
-get '/license/:license_id/delete' do
-  license = License.where(id: params[:license_id]).first()
-  license.delete()
-
-  redirect '/license/list'
-end
-
-post '/license/:license_id/comment' do
-  license = License.first(id: params[:license_id])
-
-  comment = LicenseComment.create(body: params[:comment_body])
-  license.add_license_comment(comment)
-
-  redirect "/license/#{license.id}"
-end

lib/routes/index.rb

@@ -0,0 +1,14 @@
+namespace '/' do
+
+  get '' do
+    items = Item.reverse(:updated_at).limit(10).all()
+    licenses = License.reverse(:updated_at).limit(10).all()
+    erb :index, :locals => {
+      :title => 'Dashboard',
+      :items => items,
+      :licenses => licenses
+    }
+  end
+
+end
+

lib/routes/item.rb

@@ -0,0 +1,81 @@
+namespace '/item' do
+
+  get '' do
+    redirect '/item/list'
+  end
+  get '/list' do
+    items = Item.reverse(:updated_at).all()
+    erb :'item/list', :locals => {
+      :title => 'List of Items',
+      :items => items
+    }
+  end
+  
+  get '/create' do
+    erb :'item/create', :locals => {
+      :title => 'Create New Item'
+    }
+  end
+  post '/create' do
+    item = Item.create(
+      name: params[:item_name],
+      serial_number: params[:item_serial],
+      sku_number: params[:item_sku],
+      purchased_from: params[:item_purchase_from],
+      purchased_at: params[:item_purchase_date],
+      manufacturer: params[:item_manufacturer],
+      type: params[:item_type]
+    )
+  
+    redirect "/item/#{item.id}"
+  end
+  
+  get '/:item_id' do
+    item = Item.where(id: params[:item_id]).first()
+    puts "#{item.name}"
+    erb :'item/view', :locals => {
+      :title => item.name,
+      :item => item
+    }
+  end
+  
+  get '/:item_id/edit' do
+    item = Item.where(id: params[:item_id]).first()
+    puts "#{item.name}"
+    erb :'item/edit', :locals => {
+      :title => "Editing: #{item.name}",
+      :item => item
+    }
+  end
+  post '/:item_id/edit' do
+    item = Item.where(id: params[:item_id]).first()
+  
+    item.name = params[:item_name]
+    item.serial_number = params[:item_serial]
+    item.sku_number = params[:item_sku]
+    item.purchased_from = params[:item_purchase_from]
+    item.purchased_at = params[:item_purchase_date]
+    item.manufacturer = params[:item_manufacturer]
+    item.type = params[:item_type]
+    item.save()
+  
+    redirect "/item/#{item.id}"
+  end
+  
+  get '/:item_id/delete' do
+    item = Item.where(id: params[:item_id]).first()
+    item.delete()
+  
+    redirect '/item/list'
+  end
+  
+  post '/:item_id/comment' do
+    item = Item.first(id: params[:item_id])
+  
+    comment = ItemComment.create(body: params[:comment_body])
+    item.add_item_comment(comment)
+  
+    redirect "/item/#{item.id}"
+  end
+
+end

lib/routes/license.rb

@@ -0,0 +1,81 @@
+namespace '/license' do
+
+  get '' do
+    redirect '/license/list'
+  end
+  get '/list' do
+    licenses = License.reverse(:updated_at).all()
+    erb :'license/list', :locals => {
+      :title => 'List of Licenses',
+      :licenses => licenses
+    }
+  end
+  
+  get '/create' do
+    erb :'license/create', :locals => {
+      :title => 'Create New License'
+    }
+  end
+  post '/create' do
+    license = License.create(
+      name: params[:license_name],
+      key: params[:license_key],
+      manufacturer: params[:license_manufacturer],
+      seats_used: params[:license_seats_used],
+      seats_total: params[:license_seats_total],
+      purchased_from: params[:license_purchase_from],
+      purchased_at: params[:license_purchase_date]
+    )
+  
+    redirect "/license/#{license.id}"
+  end
+  
+  get '/:license_id' do
+    license = License.where(id: params[:license_id]).first()
+    puts "#{license.name}"
+    erb :'license/view', :locals => {
+      :title => license.name,
+      :license => license
+    }
+  end
+  
+  get '/:license_id/edit' do
+    license = License.where(id: params[:license_id]).first()
+    puts "#{license.name}"
+    erb :'license/edit', :locals => {
+      :title => "Editing: #{license.name}",
+      :license => license
+    }
+  end
+  post '/:license_id/edit' do
+    license = License.where(id: params[:license_id]).first()
+  
+    license.name = params[:license_name]
+    license.key = params[:license_key]
+    license.manufacturer = params[:license_manufacturer]
+    license.seats_used = params[:license_seats_used]
+    license.seats_total = params[:license_seats_total]
+    license.purchased_from = params[:license_purchase_from]
+    license.purchased_at = params[:license_purchase_date]
+    license.save()
+  
+    redirect "/license/#{license.id}"
+  end
+  
+  get '/:license_id/delete' do
+    license = License.where(id: params[:license_id]).first()
+    license.delete()
+  
+    redirect '/license/list'
+  end
+  
+  post '/:license_id/comment' do
+    license = License.first(id: params[:license_id])
+  
+    comment = LicenseComment.create(body: params[:comment_body])
+    license.add_license_comment(comment)
+  
+    redirect "/license/#{license.id}"
+  end
+
+end

lib/routes/search.rb

@@ -0,0 +1,15 @@
+namespace '/search' do
+  get '' do
+    search_parameter = params[:query]
+    items = Item.where(Sequel.ilike(:name, "%#{search_parameter}%")).all()
+    licenses = License.where(Sequel.ilike(:name, "%#{search_parameter}%")).all()
+
+    results = items.concat(licenses)
+
+    erb :'search/list', :locals => {
+      :title => 'Search Results',
+      :results => results,
+      :query => search_parameter
+    }
+  end
+end

package-lock.json

@@ -11,6 +11,7 @@
       "devDependencies": {
         "grunt": "^1.5.3",
         "grunt-cli": "^1.4.3",
+        "grunt-contrib-coffee": "^2.1.0",
         "grunt-contrib-sass": "^2.0.0",
         "grunt-contrib-watch": "^1.1.0",
         "sass": "^1.55.0"
@@ -192,6 +193,19 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/coffeescript": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/coffeescript/-/coffeescript-2.7.0.tgz",
+      "integrity": "sha512-hzWp6TUE2d/jCcN67LrW1eh5b/rSDKQK6oD6VMLlggYVUUFexgTH9z3dNYihzX4RMhze5FTUsUmOXViJKFQR/A==",
+      "dev": true,
+      "bin": {
+        "cake": "bin/cake",
+        "coffee": "bin/coffee"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/color-convert": {
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
@@ -640,6 +654,24 @@
         "nopt": "bin/nopt.js"
       }
     },
+    "node_modules/grunt-contrib-coffee": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/grunt-contrib-coffee/-/grunt-contrib-coffee-2.1.0.tgz",
+      "integrity": "sha512-lgP+pPY3mHl+gqAU0T+7BcocBWu0FyeeJnAG/iIp2I0GPa5LvZJ7Wqga6QwKQtQCTs+1gPEa12nuap9Lj08lhw==",
+      "dev": true,
+      "dependencies": {
+        "chalk": "^2.4.2",
+        "coffeescript": "^2.3.2",
+        "lodash": "^4.17.11",
+        "uri-path": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "peerDependencies": {
+        "grunt": ">=0.4.5"
+      }
+    },
     "node_modules/grunt-contrib-sass": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/grunt-contrib-sass/-/grunt-contrib-sass-2.0.0.tgz",
@@ -1679,6 +1711,15 @@
       "integrity": "sha512-VE0SOVEHCk7Qc8ulkWw3ntAzXuqf7S2lvwQaDLRnUeIEaKNQJzV6BwmLKhOqT61aGhfUMrXeaBk+oDGCzvhcug==",
       "dev": true
     },
+    "node_modules/uri-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/uri-path/-/uri-path-1.0.0.tgz",
+      "integrity": "sha512-8pMuAn4KacYdGMkFaoQARicp4HSw24/DHOVKWqVRJ8LhhAwPPFpdGvdL9184JVmUwe7vz7Z9n6IqI6t5n2ELdg==",
+      "dev": true,
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
     "node_modules/util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -1881,6 +1922,12 @@
         "readdirp": "~3.6.0"
       }
     },
+    "coffeescript": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/coffeescript/-/coffeescript-2.7.0.tgz",
+      "integrity": "sha512-hzWp6TUE2d/jCcN67LrW1eh5b/rSDKQK6oD6VMLlggYVUUFexgTH9z3dNYihzX4RMhze5FTUsUmOXViJKFQR/A==",
+      "dev": true
+    },
     "color-convert": {
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
@@ -2229,6 +2276,18 @@
         }
       }
     },
+    "grunt-contrib-coffee": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/grunt-contrib-coffee/-/grunt-contrib-coffee-2.1.0.tgz",
+      "integrity": "sha512-lgP+pPY3mHl+gqAU0T+7BcocBWu0FyeeJnAG/iIp2I0GPa5LvZJ7Wqga6QwKQtQCTs+1gPEa12nuap9Lj08lhw==",
+      "dev": true,
+      "requires": {
+        "chalk": "^2.4.2",
+        "coffeescript": "^2.3.2",
+        "lodash": "^4.17.11",
+        "uri-path": "^1.0.0"
+      }
+    },
     "grunt-contrib-sass": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/grunt-contrib-sass/-/grunt-contrib-sass-2.0.0.tgz",
@@ -3013,6 +3072,12 @@
         }
       }
     },
+    "uri-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/uri-path/-/uri-path-1.0.0.tgz",
+      "integrity": "sha512-8pMuAn4KacYdGMkFaoQARicp4HSw24/DHOVKWqVRJ8LhhAwPPFpdGvdL9184JVmUwe7vz7Z9n6IqI6t5n2ELdg==",
+      "dev": true
+    },
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",

package.json

@@ -26,6 +26,7 @@
   "devDependencies": {
     "grunt": "^1.5.3",
     "grunt-cli": "^1.4.3",
+    "grunt-contrib-coffee": "^2.1.0",
     "grunt-contrib-sass": "^2.0.0",
     "grunt-contrib-watch": "^1.1.0",
     "sass": "^1.55.0"

raven.rb

@@ -2,6 +2,7 @@ require 'logger'
 require 'sequel'
 require 'sqlite3'
 require 'sinatra'
+require 'sinatra/namespace'
 
 require_relative 'lib/config.rb'
 

views/index.erb

@@ -1,11 +1,57 @@
-<p>This is a test.</p>
+<div class="row">
+  <div class="twelve columns">
+    <h1 id="site-header">Welcome to Raven</h1>
+  </div>
+</div>
 
+<hr>
+
+<div class="row">
+  <div class="six columns">
+    <h3>Recent inventory updates</h3>
     <% if items.length > 0 %>
-  <ul>
+      <table class="u-full-width">
+        <thead>
+          <tr>
+            <th>Item name</th>
+            <th>Updated at</th>
+          </tr>
+        </thead>
+        <tbody>
           <% items.each do |item| %>
-    <li><%= item.name %></li>
+            <tr>
+              <td><%= item.name %></td>
+              <td><%= date_format(item.updated_at) %></td>
+            </tr>
           <% end %>
-  </ul>
+        </tbody>
+      </table>
     <% else %>
       <p>There are no items to display.</p>
     <% end %>
+  </div>
+
+  <div class="six columns">
+    <h3>Recent license updates</h3>
+    <% if licenses.length > 0 %>
+      <table class="u-full-width">
+        <thead>
+          <tr>
+            <th>License name</th>
+            <th>Updated at</th>
+          </tr>
+        </thead>
+        <tbody>
+          <% licenses.each do |license| %>
+            <tr>
+              <td><%= license.name %></td>
+              <td><%= date_format(license.updated_at) %></td>
+            </tr>
+          <% end %>
+        </tbody>
+      </table>
+    <% else %>
+      <p>There are no licenses to display.</p>
+    <% end %>
+  </div>
+</div>

views/layout.erb

@@ -8,19 +8,16 @@
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css">
   <link rel="stylesheet" href="/css/kraken.css">
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
+  <script src="/js/gargoyle.js"></script>
 </head>
 <body>
   <!-- Main navigation -->
-  <nav id="main-nav">
+  <%= erb :'layout/navbar', :locals => locals %>
-    <h3>Raven</h3>
-    <ul>
-      <li><a href="/">Dashboard</a></li>
-      <li><a href="/item/list">Items</a></li>
-      <li><a href="/license/list">Licenses</a></li>
-    </ul>
-  </nav>
 
-  <div id="main-wrapper" class="container">
+  <!-- Inventory search/actions bar -->
+  <%= erb :'layout/actions', :locals => locals %>
+
+  <div id="main-wrapper" class="container fluid card">
     <%= yield %>
   </div>
 </body>

views/layout/actions.erb

@@ -0,0 +1,9 @@
+<div id="main-actions" class="container fluid card">
+  <div class="row">
+    <div class="six columns">
+      <form action="/search" class="u-full-width">
+        <input id="search-field" class="u-full-width" type="text" placeholder="Search your inventory..." name="query" required <%= defined?(query) ? 'value="' + query + '"' : '' %>>
+      </form>
+    </div>
+  </div>
+</div>

views/layout/navbar.erb

@@ -0,0 +1,8 @@
+<nav id="main-nav">
+  <h3>Raven <i id="nav-toggle" class="fa-solid fa-bars"></i></h3>
+  <ul>
+    <li><a href="/">Dashboard <i class="fa-solid fa-gauge"></i></a></li>
+    <li><a href="/item/list">Items <i class="fa-solid fa-desktop"></i></a></li>
+    <li><a href="/license/list">Licenses <i class="fa-solid fa-floppy-disk"></i></a></li>
+  </ul>
+</nav>

views/search/list.erb

@@ -0,0 +1,14 @@
+<div class="row">
+  <div class="twelve columns">
+    <h4>Matching inventory:</h4>
+    <% if results.length > 0 %>
+      <ul class="u-full-width">
+        <% results.each do |r| %>
+          <li><a href="<%= r.getLink() %>"><%= r.name %></a></li>
+        <% end %>
+      </ul>
+    <% else %>
+      <p>Sorry, nothing in your hardware inventory matches that search term.</p>
+    <% end %>
+  </div>
+</div>