kuppayam 0.1.5 → 0.1.6dev2

data/app/views/kuppayam/images/edit.js.erb

@@ -1,8 +1,8 @@
 <% if @image_type %>
-	heading = "Edit <%= @image_type.split('::').last.titleize %>";
+	var heading = "Edit <%= @image_type.split('::').last.titleize %>";
 <% else %>
-	heading = "Edit Image";
+	var heading = "Edit Image";
 <% end %>
 
 bodyContent = "<%= escape_javascript(render(:partial=>'form')) %>";
-showGenericModal(heading, bodyContent);
+showImageUploadModal(heading, bodyContent, true);

data/app/views/kuppayam/images/index.html.erb

@@ -8,8 +8,15 @@
       <div class="tab-pane active">
 
         <div id="div_event_action_buttons">
-          <%= render :partial=>"kuppayam/images/action_buttons" %>
+          <div class="row">
+            <div class="col-md-4">
+            </div>
+            <div class="col-md-8">
+              <%#= search_form_kuppayam(Image::Base, images_path, text: @filters[:query]) %>
+            </div>
+          </div>
         </div>
+        
         <%= clear_tag(10) %>
 
         <div id="div_event_index">

data/app/views/kuppayam/images/new.js.erb

@@ -5,4 +5,4 @@
 <% end %>
 
 bodyContent = "<%= escape_javascript(render(:partial=>'form')) %>";
-showGenericModal(heading, bodyContent);
+showImageUploadModal(heading, bodyContent);

data/app/views/kuppayam/images/update.html.erb

@@ -11,7 +11,7 @@
 
 			bodyContent = "<%= escape_javascript(render(:partial=>'form')) %>";
 
-			this.parent.showGenericModal(heading, bodyContent);
+			this.parent.showImageUploadModal(heading, bodyContent);
 
 			<%
 		    text = "You have few errors. They have been highlighted."
@@ -22,15 +22,15 @@
 
   	<% else %>
 
-	    this.parent.closeGenericModal();
+	    this.parent.closeImageUploadModal();
 
 	    // var heading = "Crop Image";
 	    // var bodyContent = "<%#= escape_javascript(render(:partial=>'crop_form')) %>";
-	    // this.parent.showGenericModal(heading, bodyContent);
+	    // this.parent.showGenericModal(heading, bodyContent, true);
 	    // this.parent.cropImage("form_crop_photo");
 
-	    this.parent.$(".<%= @resource.id %>-large-image").attr("src", "<%= @image.image.large.url %>");
-	    this.parent.$(".<%= @resource.id %>-small-image").attr("src", "<%= @image.image.small.url %>");
+	    this.parent.$(".<%= @image.id %>-large-image").attr("src", "<%= @image.image.large.url %>");
+	    this.parent.$(".<%= @image.id %>-small-image").attr("src", "<%= @image.image.small.url %>");
     
     <% end %>
 

data/app/views/kuppayam/import_data/new.js.erb

@@ -5,7 +5,7 @@
 	heading = "Import Data";
 <% end %>
 bodyContent = "<%= escape_javascript(render(:partial=>'form')) %>";
-showGenericModal(heading, bodyContent);
+showGenericModal(heading, bodyContent, true);
 
 // When the document upload form is submitted, the server response will appear in this iframe -->
 var $div = $('<iframe id="iframe_document" name="iframe_document" width="100%" style="display:none"></iframe>').appendTo('body');

data/app/views/kuppayam/import_data/update.html.erb

@@ -4,7 +4,7 @@
 
     // var heading = "Crop Document";
     // var bodyContent = "<%#= escape_javascript(render(:partial=>'crop_form')) %>";
-    // this.parent.showGenericModal(heading, bodyContent);
+    // this.parent.showGenericModal(heading, bodyContent, true);
     // this.parent.cropDocument("form_crop_photo");
 
     this.parent.$(".<%= @resource.id %>-large-document").attr("src", "<%= @document.document.large.url %>");

data/app/views/kuppayam/workflows/parrot/create.js.erb

@@ -1,13 +1,18 @@
 <% if @r_object.errors.blank? %>
   
   // Inserting the row on top of the table and highlighting it
-  $('#div_<%= @resource_options[:item_name] %>_index table > tbody').prepend("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: {@resource_options[:item_name].to_sym => @r_object, i: -1})) %>")
+  $('#div_<%= @resource_options[:item_name] %>_index table > tbody').prepend("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: {@resource_options[:item_name].to_sym => @r_object, i: -1})) %>");
   $("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").css("background-color", "#fffddd");
 
-  // Showing the saved data in the modal
-  var heading = "<%= raw @r_object.try(:display_name) %>";
-  var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/show")) %>";
-  showGenericModal(heading, bodyContent, false);
+  <% if @resource_options[:show_modal_after_create] %>
+    // Showing the saved data in the modal
+    var heading = "<%= raw @r_object.try(:display_name) %>";
+    var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/show")) %>";
+    showGenericModal(heading, bodyContent, false);
+  <% else %>
+    // Closing the modal if it is opened
+    closeGenericModal();
+  <% end %>
 
   // Showing Growl Like Message
   notifySuccess("<%= escape_javascript(@notification[:title]) %>", "<%= escape_javascript(@notification[:message]) %>");
@@ -17,7 +22,7 @@
   // Reload the form with errors
 	var heading = "Add an <%= @resource_options[:collection_name] %>";
 	var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/form")) %>";
-	showGenericModal(heading, bodyContent);
+	showGenericModal(heading, bodyContent, true);
 
   // Show Main Error Message on the form
   <% error_message = content_tag(:div, I18n.t('errors.errors_highlighted'), class: "alert alert-danger mt-20") %>

data/app/views/kuppayam/workflows/parrot/edit.js.erb

@@ -1,7 +1,7 @@
 // Load the form
 var heading = "Edit '<%= raw @r_object.try(:display_name) %>'";
 var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/form")) %>";
-showGenericModal(heading, bodyContent);
+showGenericModal(heading, bodyContent, true);
 
 // Initialize WYSIHTML Editor
 $(".wysihtml5").wysihtml5(

data/app/views/kuppayam/workflows/parrot/new.js.erb

@@ -1,7 +1,7 @@
 // Load the form
-var heading = "Add <%= @resource_options[:collection_name] %>";
+var heading = "Add <%= @resource_options[:collection_name].to_s.titleize %>";
 var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/form")) %>";
-showGenericModal(heading, bodyContent);
+showGenericModal(heading, bodyContent, true);
 
 // Initialize WYSIHTML Editor
 $(".wysihtml5").wysihtml5(

data/app/views/kuppayam/workflows/parrot/row.js.erb

@@ -1,7 +1,7 @@
 <% if @r_object && @r_object.errors.blank? %>
 	
 	// Updating the edited row and highlighting it
-	$("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").replaceWith("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: { @resource_options[:item_name].to_sym => @r_object, i: -1})) %>")
+	$("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").replaceWith("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: { @resource_options[:item_name].to_sym => @r_object, i: -1})) %>");
 	$("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").css("background-color", "#fffddd");
   
   // Refresh the modal content if it is open

data/app/views/kuppayam/workflows/parrot/update.js.erb

@@ -4,10 +4,15 @@
   $('#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>').replaceWith("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: { @resource_options[:item_name].to_sym => @r_object, i: -1})) %>");
   $("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").css("background-color", "#fffddd");
   
-  // Showing the saved data in the modal
-  var heading = "<%= raw @r_object.try(:display_name) %>";
-  var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/show")) %>";
-  showGenericModal(heading, bodyContent, false);
+  <% if @resource_options[:show_modal_after_update] %>
+    // Showing the saved data in the modal
+    var heading = "<%= raw @r_object.try(:display_name) %>";
+    var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/show")) %>";
+    showGenericModal(heading, bodyContent, false);
+  <% else %>
+    // Closing the modal if it is opened
+    closeGenericModal();
+  <% end %>
 
   // Showing Growl Like Message
   notifySuccess("<%= @notification[:title] %>", "<%= @notification[:message] %>");
@@ -17,7 +22,7 @@
 	// Reload the form with errors
 	var heading = "Edit '<%= raw @r_object.try(:display_name) %>'";
 	var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/form")) %>";
-	showGenericModal(heading, bodyContent);
+	showGenericModal(heading, bodyContent, true);
 
 	// Show Main Error Message on the form
   <% error_message = content_tag(:div, I18n.t('errors.errors_highlighted'), class: "alert alert-danger mt-20") %>

data/app/views/kuppayam/workflows/peacock/create.js.erb

@@ -1,13 +1,18 @@
 <% if @r_object.errors.blank? %>
   
   // Inserting the row on top of the table and highlighting it
-  $('#div_<%= @resource_options[:item_name] %>_index table > tbody').prepend("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: {@resource_options[:item_name].to_sym => @r_object})) %>")
+  $('#div_<%= @resource_options[:item_name] %>_index table > tbody').prepend("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: {@resource_options[:item_name].to_sym => @r_object, i: -1})) %>");
   $("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").css("background-color", "#fffddd");
 
-  // Showing the saved data in the modal
-  var heading = "<%= raw @r_object.try(:display_name) %>";
-  var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/show")) %>";
-  showLargeModal(heading, bodyContent, false);
+  <% if @resource_options[:show_modal_after_create] %>
+    // Showing the saved data in the modal
+    var heading = "<%= raw @r_object.try(:display_name) %>";
+    var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/show")) %>";
+    showLargeModal(heading, bodyContent, false);
+  <% else %>
+    // Closing the modal if it is opened
+    closeLargeModal();
+  <% end %>
 
   // Showing Growl Like Message
   notifySuccess("<%= escape_javascript(@notification[:title]) %>", "<%= escape_javascript(@notification[:message]) %>");
@@ -15,9 +20,9 @@
 <% else %>
 
   // Reload the form with errors
-	var heading = "Add an <%= @resource_options[:collection_name] %>";
+	var heading = "Add <%= @resource_options[:item_name] %>";
 	var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/form")) %>";
-	showLargeModal(heading, bodyContent);
+	showLargeModal(heading, bodyContent, true);
 
   // Show Main Error Message on the form
   <% error_message = content_tag(:div, I18n.t('errors.errors_highlighted'), class: "alert alert-danger mt-20") %>

data/app/views/kuppayam/workflows/peacock/edit.js.erb

@@ -1,7 +1,7 @@
 // Load the form
-var heading = "Edit '<%= raw @r_object.try(:display_name) %>'";
+var heading = "Edit <%= @resource_options[:item_name].to_s.titleize %> - '<%= raw @r_object.try(:display_name) %>'";
 var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/form")) %>";
-showLargeModal(heading, bodyContent);
+showLargeModal(heading, bodyContent, true);
 
 // Initialize WYSIHTML Editor
 $(".wysihtml5").wysihtml5(

data/app/views/kuppayam/workflows/peacock/new.js.erb

@@ -1,7 +1,7 @@
 // Load the form
-var heading = "Add <%= @resource_options[:collection_name] %>";
+var heading = "Add <%= @resource_options[:item_name].to_s.titleize %>";
 var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/form")) %>";
-showLargeModal(heading, bodyContent);
+showLargeModal(heading, bodyContent, true);
 
 // Initialize WYSIHTML Editor
 $(".wysihtml5").wysihtml5(

data/app/views/kuppayam/workflows/peacock/row.js.erb

@@ -1,7 +1,7 @@
 <% if @r_object && @r_object.errors.blank? %>
 	
 	// Updating the edited row and highlighting it
-	$("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").replaceWith("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: { @resource_options[:item_name].to_sym => @r_object, i: -1})) %>")
+	$("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").replaceWith("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: { @resource_options[:item_name].to_sym => @r_object, i: -1})) %>");
 	$("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").css("background-color", "#fffddd");
   
   // Refresh the modal content if it is open

data/app/views/kuppayam/workflows/peacock/update.js.erb

@@ -1,13 +1,18 @@
 <% if @r_object.errors.blank? %>
   
   // Updating the edited row and highlighting it
-  $('#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>').replaceWith("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: { @resource_options[:item_name].to_sym => @r_object})) %>");
+  $('#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>').replaceWith("<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/row", locals: { @resource_options[:item_name].to_sym => @r_object, i: -1})) %>");
   $("#tr_<%= @resource_options[:item_name] %>_<%= @r_object.id %>").css("background-color", "#fffddd");
   
-  // Showing the saved data in the modal
-  var heading = "<%= raw @r_object.try(:display_name) %>";
-  var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/show")) %>";
-  showLargeModal(heading, bodyContent, false);
+  <% if @resource_options[:show_modal_after_update] %>
+    // Showing the saved data in the modal
+    var heading = "<%= raw @r_object.try(:display_name) %>";
+    var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/show")) %>";
+    showLargeModal(heading, bodyContent, false);
+  <% else %>
+    // Closing the modal if it is opened
+    closeLargeModal();
+  <% end %>
 
   // Showing Growl Like Message
   notifySuccess("<%= @notification[:title] %>", "<%= @notification[:message] %>");
@@ -17,7 +22,7 @@
 	// Reload the form with errors
 	var heading = "Edit '<%= raw @r_object.try(:display_name) %>'";
 	var bodyContent = "<%= escape_javascript(render(:partial=>"#{@resource_options[:view_path]}/form")) %>";
-	showLargeModal(heading, bodyContent);
+	showLargeModal(heading, bodyContent, true);
 
 	// Show Main Error Message on the form
   <% error_message = content_tag(:div, I18n.t('errors.errors_highlighted'), class: "alert alert-danger mt-20") %>

data/app/views/layouts/kuppayam/_footer.html.erb

@@ -23,3 +23,4 @@
 	</div>
 	
 </footer>
+

data/app/views/layouts/kuppayam/_head.html.erb

@@ -9,14 +9,23 @@
 
 <title><%= title -%></title>
 
-<link rel="shortcut icon" href="/assets/kuppayam/favicon.png" />
+<link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-touch-icon.png">
+<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon-32x32.png">
+<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon-16x16.png">
+<link rel="manifest" href="/assets/manifest.json">
+<link rel="mask-icon" href="/assets/safari-pinned-tab.svg" color="#5bbad5">
+<link rel="shortcut icon" href="/assets/favicon.ico">
+<meta name="apple-mobile-web-app-title" content="Kuppayam">
+<meta name="application-name" content="Kuppayam">
+<meta name="msapplication-config" content="/assets/browserconfig.xml">
+<meta name="theme-color" content="#ffffff">
 
 <%= csrf_meta_tags %>
 
 <!-- Stylesheets -->
 <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Arimo:400,700,400italic">
 
-<%= stylesheet_link_tag  @stylesheet_filename %>
+<%= stylesheet_link_tag  @stylesheet_filename, :media => "all" %>
 
 <!-- Javascripts -->
 

data/app/views/layouts/kuppayam/_heading.html.erb

@@ -1,8 +1,17 @@
 <% if @breadcrumbs[:heading] || @breadcrumbs[:links].is_a?(Array) && @breadcrumbs[:links].any? %>
 	<div class="page-title">
 	  <div class="title-env">
-	    <h1 class="title"><%= @breadcrumbs[:heading] %></h1>
-	    <p class="description"><%= @breadcrumbs[:description] %></p>
+	  	<h1 class="title pull-left mr-10">
+	    	<% if @breadcrumbs[:icon] %>
+	    		<i class="<%= @breadcrumbs[:icon] %>" style="font-size:50px;"></i>
+	    	<% end %>
+	    </h1>
+	    <div class="pull-left">
+		    <h1 class="title">
+		    	<%= @breadcrumbs[:heading] %>
+		    </h1>
+		    <p class="description"><%= @breadcrumbs[:description] %></p>
+	    </div>
 	  </div>
 	  <%= breadcrumb if @breadcrumbs[:links].any? %>
 	</div>

data/app/views/layouts/kuppayam/_horizontal_menu.html.erb

@@ -0,0 +1,932 @@
+<nav class="navbar horizontal-menu navbar-fixed-top"><!-- set fixed position by adding class "navbar-fixed-top" -->
+	
+	<div class="navbar-inner">
+		
+		<!-- Navbar Brand -->
+		<div class="navbar-brand">
+			<a href="dashboard-1.html" class="logo">
+				<img src="/assets/logo.png" width="80" alt="" class="hidden-xs" />
+				<img src="/assets/logo.png" width="80" alt="" class="visible-xs" />
+			</a>
+			<a href="#" data-toggle="settings-pane" data-animate="true">
+				<i class="linecons-cog"></i>
+			</a>
+		</div>
+		
+		<!-- Mobile Toggles Links -->
+		<div class="nav navbar-mobile">
+			
+			<!-- This will toggle the mobile menu and will be visible only on mobile devices -->
+			<div class="mobile-menu-toggle">
+				<!-- This will open the popup with user profile settings, you can use for any purpose, just be creative -->
+				<a href="#" data-toggle="settings-pane" data-animate="true">
+					<i class="linecons-cog"></i>
+				</a>
+				
+				<a href="#" data-toggle="user-info-menu-horizontal">
+					<i class="fa-bell-o"></i>
+					<span class="badge badge-success">7</span>
+				</a>
+				
+				<!-- data-toggle="mobile-menu-horizontal" will show horizontal menu links only -->
+				<!-- data-toggle="mobile-menu" will show sidebar menu links only -->
+				<!-- data-toggle="mobile-menu-both" will show sidebar and horizontal menu links -->
+				<a href="#" data-toggle="mobile-menu-horizontal">
+					<i class="fa-bars"></i>
+				</a>
+			</div>
+			
+		</div>
+		
+		<div class="navbar-mobile-clear"></div>
+		
+		
+		
+		<!-- main menu -->
+		
+		<ul class="navbar-nav">
+			<li>
+				<a href="dashboard-1.html">
+					<i class="linecons-cog"></i>
+					<span class="title">Dashboard</span>
+				</a>
+				<ul>
+					<li>
+						<a href="dashboard-1.html">
+							<span class="title">Dashboard 1</span>
+						</a>
+					</li>
+					<li>
+						<a href="dashboard-2.html">
+							<span class="title">Dashboard 2</span>
+						</a>
+					</li>
+					<li>
+						<a href="dashboard-3.html">
+							<span class="title">Dashboard 3</span>
+						</a>
+					</li>
+					<li>
+						<a href="dashboard-4.html">
+							<span class="title">Dashboard 4</span>
+						</a>
+					</li>
+					<li>
+						<a href="skin-generator.html">
+							<span class="title">Skin Generator</span>
+						</a>
+					</li>
+					<li>
+						<a href="update-highlights.html">
+							<span class="title">Update Highlights</span>
+							<span class="label label-pink pull-right hidden-collapsed">v1.3</span>
+						</a>
+					</li>
+				</ul>
+			</li>
+			<li class="opened active">
+				<a href="layout-variants.html">
+					<i class="linecons-desktop"></i>
+					<span class="title">Layouts</span>
+				</a>
+				<ul>
+					<li>
+						<a href="layout-variants.html">
+							<span class="title">Layout Variants &amp; API</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-collapsed-sidebar.html">
+							<span class="title">Collapsed Sidebar</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-static-sidebar.html">
+							<span class="title">Static Sidebar</span>
+						</a>
+					</li>
+					<li class="active">
+						<a href="layout-horizontal-menu.html">
+							<span class="title">Horizontal Menu</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-horizontal-plus-sidebar.html">
+							<span class="title">Horizontal &amp; Sidebar Menu</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-horizontal-menu-click-to-open-subs.html">
+							<span class="title">Horizontal Open On Click</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-horizontal-menu-min.html">
+							<span class="title">Horizontal Menu Minimal</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-right-sidebar.html">
+							<span class="title">Right Sidebar</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-chat-open.html">
+							<span class="title">Chat Open</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-horizontal-sidebar-menu-collapsed-right.html">
+							<span class="title">Both Menus &amp; Collapsed</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-boxed.html">
+							<span class="title">Boxed Layout</span>
+						</a>
+					</li>
+					<li>
+						<a href="layout-boxed-horizontal-menu.html">
+							<span class="title">Boxed &amp; Horizontal Menu</span>
+						</a>
+					</li>
+				</ul>
+			</li>
+			<li>
+				<a href="ui-panels.html">
+					<i class="linecons-note"></i>
+					<span class="title">UI Elements</span>
+				</a>
+				<ul>
+					<li>
+						<a href="ui-panels.html">
+							<span class="title">Panels</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-buttons.html">
+							<span class="title">Buttons</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-tabs-accordions.html">
+							<span class="title">Tabs &amp; Accordions</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-modals.html">
+							<span class="title">Modals</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-breadcrumbs.html">
+							<span class="title">Breadcrumbs</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-blockquotes.html">
+							<span class="title">Blockquotes</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-progressbars.html">
+							<span class="title">Progress Bars</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-navbars.html">
+							<span class="title">Navbars</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-alerts.html">
+							<span class="title">Alerts</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-pagination.html">
+							<span class="title">Pagination</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-typography.html">
+							<span class="title">Typography</span>
+						</a>
+					</li>
+					<li>
+						<a href="ui-other-elements.html">
+							<span class="title">Other Elements</span>
+						</a>
+					</li>
+				</ul>
+			</li>
+			<li>
+				<a href="forms-native.html">
+					<i class="linecons-params"></i>
+					<span class="title">Forms</span>
+				</a>
+				<ul>
+					<li>
+						<a href="forms-native.html">
+							<span class="title">Native Elements</span>
+						</a>
+					</li>
+					<li>
+						<a href="forms-advanced.html">
+							<span class="title">Advanced Plugins</span>
+						</a>
+					</li>
+					<li>
+						<a href="forms-wizard.html">
+							<span class="title">Form Wizard</span>
+						</a>
+					</li>
+					<li>
+						<a href="forms-validation.html">
+							<span class="title">Form Validation</span>
+						</a>
+					</li>
+					<li>
+						<a href="forms-input-masks.html">
+							<span class="title">Input Masks</span>
+						</a>
+					</li>
+					<li>
+						<a href="forms-file-upload.html">
+							<span class="title">File Upload</span>
+						</a>
+					</li>
+					<li>
+						<a href="forms-editors.html">
+							<span class="title">Editors</span>
+						</a>
+					</li>
+					<li>
+						<a href="forms-sliders.html">
+							<span class="title">Sliders</span>
+						</a>
+					</li>
+				</ul>
+			</li>
+			<li>
+				<a href="">
+					<i class="linecons-diamond"></i>
+					<span class="title">Other</span>
+				</a>
+				<ul>
+					<li>
+						<a href="ui-widgets.html">
+							<i class="linecons-star"></i>
+							<span class="title">Widgets</span>
+						</a>
+					</li>
+					<li>
+						<a href="mailbox-main.html">
+							<i class="linecons-mail"></i>
+							<span class="title">Mailbox</span>
+							<span class="label label-success pull-right">5</span>
+						</a>
+						<ul>
+							<li>
+								<a href="mailbox-main.html">
+									<span class="title">Inbox</span>
+								</a>
+							</li>
+							<li>
+								<a href="mailbox-compose.html">
+									<span class="title">Compose Message</span>
+								</a>
+							</li>
+							<li>
+								<a href="mailbox-message.html">
+									<span class="title">View Message</span>
+								</a>
+							</li>
+						</ul>
+					</li>
+					<li>
+						<a href="tables-basic.html">
+							<i class="linecons-database"></i>
+							<span class="title">Tables</span>
+						</a>
+						<ul>
+							<li>
+								<a href="tables-basic.html">
+									<span class="title">Basic Tables</span>
+								</a>
+							</li>
+							<li>
+								<a href="tables-responsive.html">
+									<span class="title">Responsive Table</span>
+								</a>
+							</li>
+							<li>
+								<a href="tables-datatables.html">
+									<span class="title">Data Tables</span>
+								</a>
+							</li>
+						</ul>
+					</li>
+					<li>
+						<a href="extra-gallery.html">
+							<i class="linecons-beaker"></i>
+							<span class="title">Extra</span>
+							<span class="label label-purple pull-right hidden-collapsed">New Items</span>
+						</a>
+						<ul>
+							<li>
+								<a href="extra-icons-fontawesome.html">
+									<span class="title">Icons</span>
+								</a>
+								<ul>
+									<li>
+										<a href="extra-icons-fontawesome.html">
+											<span class="title">Font Awesome</span>
+										</a>
+									</li>
+									<li>
+										<a href="extra-icons-linecons.html">
+											<span class="title">Linecons</span>
+										</a>
+									</li>
+									<li>
+										<a href="extra-icons-elusive.html">
+											<span class="title">Elusive</span>
+										</a>
+									</li>
+									<li>
+										<a href="extra-icons-meteocons.html">
+											<span class="title">Meteocons</span>
+										</a>
+									</li>
+								</ul>
+							</li>
+							<li>
+								<a href="extra-maps-google.html">
+									<span class="title">Maps</span>
+								</a>
+								<ul>
+									<li>
+										<a href="extra-maps-google.html">
+											<span class="title">Google Maps</span>
+										</a>
+									</li>
+									<li>
+										<a href="extra-maps-advanced.html">
+											<span class="title">Advanced Map</span>
+										</a>
+									</li>
+									<li>
+										<a href="extra-maps-vector.html">
+											<span class="title">Vector Map</span>
+										</a>
+									</li>
+								</ul>
+							</li>
+							<li>
+								<a href="extra-members-list.html">
+									<span class="title">Members</span>
+									<span class="label label-warning pull-right">New</span>
+								</a>
+								<ul>
+									<li>
+										<a href="extra-members-list.html">
+											<span class="title">Members List</span>
+										</a>
+									</li>
+									<li>
+										<a href="extra-members-add.html">
+											<span class="title">Add Member</span>
+										</a>
+									</li>
+								</ul>
+							</li>
+							<li>
+								<a href="extra-gallery.html">
+									<span class="title">Gallery</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-calendar.html">
+									<span class="title">Calendar</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-profile.html">
+									<span class="title">Profile</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-login.html">
+									<span class="title">Login</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-lockscreen.html">
+									<span class="title">Lockscreen</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-login-light.html">
+									<span class="title">Login Light</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-timeline.html">
+									<span class="title">Timeline</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-timeline-center.html">
+									<span class="title">Timeline Centerd</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-notes.html">
+									<span class="title">Notes</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-image-crop.html">
+									<span class="title">Image Crop</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-portlets.html">
+									<span class="title">Portlets</span>
+								</a>
+							</li>
+							<li>
+								<a href="blank-sidebar.html">
+									<span class="title">Blank Page</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-search.html">
+									<span class="title">Search</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-invoice.html">
+									<span class="title">Invoice</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-not-found.html">
+									<span class="title">404 Page</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-tocify.html">
+									<span class="title">Tocify</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-loader.html">
+									<span class="title">Loading Progress</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-page-loading-ol.html">
+									<span class="title">Page Loading Overlay</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-notifications.html">
+									<span class="title">Notifications</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-nestable-lists.html">
+									<span class="title">Nestable Lists</span>
+								</a>
+							</li>
+							<li>
+								<a href="extra-scrollable.html">
+									<span class="title">Scrollable</span>
+								</a>
+							</li>
+						</ul>
+					</li>
+					<li>
+						<a href="charts-main.html">
+							<i class="linecons-globe"></i>
+							<span class="title">Charts</span>
+						</a>
+						<ul>
+							<li>
+								<a href="charts-main.html">
+									<span class="title">Chart Variants</span>
+								</a>
+							</li>
+							<li>
+								<a href="charts-range.html">
+									<span class="title">Range Selector</span>
+								</a>
+							</li>
+							<li>
+								<a href="charts-sparklines.html">
+									<span class="title">Sparklines</span>
+								</a>
+							</li>
+							<li>
+								<a href="charts-map.html">
+									<span class="title">Map Charts</span>
+								</a>
+							</li>
+							<li>
+								<a href="charts-gauges.html">
+									<span class="title">Circular Gauges</span>
+								</a>
+							</li>
+							<li>
+								<a href="charts-bar-gauges.html">
+									<span class="title">Bar Gauges</span>
+								</a>
+							</li>
+						</ul>
+					</li>
+					<li>
+						<a href="#">
+							<i class="linecons-cloud"></i>
+							<span class="title">Menu Levels</span>
+						</a>
+						<ul>
+							<li>
+								<a href="#">
+									<i class="entypo-flow-line"></i>
+									<span class="title">Menu Level 1.1</span>
+								</a>
+								<ul>
+									<li>
+										<a href="#">
+											<i class="entypo-flow-parallel"></i>
+											<span class="title">Menu Level 2.1</span>
+										</a>
+									</li>
+									<li>
+										<a href="#">
+											<i class="entypo-flow-parallel"></i>
+											<span class="title">Menu Level 2.2</span>
+										</a>
+										<ul>
+											<li>
+												<a href="#">
+													<i class="entypo-flow-cascade"></i>
+													<span class="title">Menu Level 3.1</span>
+												</a>
+											</li>
+											<li>
+												<a href="#">
+													<i class="entypo-flow-cascade"></i>
+													<span class="title">Menu Level 3.2</span>
+												</a>
+												<ul>
+													<li>
+														<a href="#">
+															<i class="entypo-flow-branch"></i>
+															<span class="title">Menu Level 4.1</span>
+														</a>
+													</li>
+												</ul>
+											</li>
+										</ul>
+									</li>
+									<li>
+										<a href="#">
+											<i class="entypo-flow-parallel"></i>
+											<span class="title">Menu Level 2.3</span>
+										</a>
+									</li>
+								</ul>
+							</li>
+							<li>
+								<a href="#">
+									<i class="entypo-flow-line"></i>
+									<span class="title">Menu Level 1.2</span>
+								</a>
+							</li>
+							<li>
+								<a href="#">
+									<i class="entypo-flow-line"></i>
+									<span class="title">Menu Level 1.3</span>
+								</a>
+							</li>
+						</ul>
+					</li>
+				</ul>
+			</li>
+		</ul>
+		
+		
+		<!-- notifications and other links -->
+		<ul class="nav nav-userinfo navbar-right">
+			
+			<li class="search-form"><!-- You can add "always-visible" to show make the search input visible -->
+				
+				<form method="get" action="extra-search.html">
+					<input type="text" name="s" class="form-control search-field" placeholder="Type to search..." />
+					
+					<button type="submit" class="btn btn-link">
+						<i class="linecons-search"></i>
+					</button>
+				</form>
+				
+			</li>
+			
+			<li class="dropdown xs-left">
+				<a href="#" data-toggle="dropdown" class="notification-icon">
+					<i class="fa-envelope-o"></i>
+					<span class="badge badge-green">15</span>
+				</a>
+				
+				<ul class="dropdown-menu messages">
+					<li>
+						
+						<ul class="dropdown-menu-list list-unstyled ps-scrollbar">
+							
+							<li class="active"><!-- "active" class means message is unread -->
+								<a href="#">
+									<span class="line">
+										<strong>Luc Chartier</strong>
+										<span class="light small">- yesterday</span>
+									</span>
+									
+									<span class="line desc small">
+										This ain’t our first item, it is the best of the rest.
+									</span>
+								</a>
+							</li>
+							
+							<li class="active">
+								<a href="#">
+									<span class="line">
+										<strong>Salma Nyberg</strong>
+										<span class="light small">- 2 days ago</span>
+									</span>
+									
+									<span class="line desc small">
+										Oh he decisively impression attachment friendship so if everything.
+									</span>
+								</a>
+							</li>
+							
+							<li>
+								<a href="#">
+									<span class="line">
+										Hayden Cartwright
+										<span class="light small">- a week ago</span>
+									</span>
+									
+									<span class="line desc small">
+										Whose her enjoy chief new young. Felicity if ye required likewise so doubtful.
+									</span>
+								</a>
+							</li>
+							
+							<li>
+								<a href="#">
+									<span class="line">
+										Sandra Eberhardt
+										<span class="light small">- 16 days ago</span>
+									</span>
+									
+									<span class="line desc small">
+										On so attention necessary at by provision otherwise existence direction.
+									</span>
+								</a>
+							</li>
+							
+							<!-- Repeated -->
+							
+							<li class="active"><!-- "active" class means message is unread -->
+								<a href="#">
+									<span class="line">
+										<strong>Luc Chartier</strong>
+										<span class="light small">- yesterday</span>
+									</span>
+									
+									<span class="line desc small">
+										This ain’t our first item, it is the best of the rest.
+									</span>
+								</a>
+							</li>
+							
+							<li class="active">
+								<a href="#">
+									<span class="line">
+										<strong>Salma Nyberg</strong>
+										<span class="light small">- 2 days ago</span>
+									</span>
+									
+									<span class="line desc small">
+										Oh he decisively impression attachment friendship so if everything.
+									</span>
+								</a>
+							</li>
+							
+							<li>
+								<a href="#">
+									<span class="line">
+										Hayden Cartwright
+										<span class="light small">- a week ago</span>
+									</span>
+									
+									<span class="line desc small">
+										Whose her enjoy chief new young. Felicity if ye required likewise so doubtful.
+									</span>
+								</a>
+							</li>
+							
+							<li>
+								<a href="#">
+									<span class="line">
+										Sandra Eberhardt
+										<span class="light small">- 16 days ago</span>
+									</span>
+									
+									<span class="line desc small">
+										On so attention necessary at by provision otherwise existence direction.
+									</span>
+								</a>
+							</li>
+							
+						</ul>
+						
+					</li>
+					
+					<li class="external">
+						<a href="mailbox-main.html">
+							<span>All Messages</span>
+							<i class="fa-link-ext"></i>
+						</a>
+					</li>
+				</ul>
+				
+			</li>
+			
+			<li class="dropdown xs-left">
+				<a href="#" data-toggle="dropdown" class="notification-icon notification-icon-messages">
+					<i class="fa-bell-o"></i>
+					<span class="badge badge-purple">7</span>
+				</a>
+				
+				<ul class="dropdown-menu notifications">
+					<li class="top">
+						<p class="small">
+							<a href="#" class="pull-right">Mark all Read</a>
+							You have <strong>3</strong> new notifications.
+						</p>
+					</li>
+					
+					<li>
+						<ul class="dropdown-menu-list list-unstyled ps-scrollbar">
+							<li class="active notification-success">
+								<a href="#">
+									<i class="fa-user"></i>
+									
+									<span class="line">
+										<strong>New user registered</strong>
+									</span>
+									
+									<span class="line small time">
+										30 seconds ago
+									</span>
+								</a>
+							</li>
+							
+							<li class="active notification-secondary">
+								<a href="#">
+									<i class="fa-lock"></i>
+									
+									<span class="line">
+										<strong>Privacy settings have been changed</strong>
+									</span>
+									
+									<span class="line small time">
+										3 hours ago
+									</span>
+								</a>
+							</li>
+							
+							<li class="notification-primary">
+								<a href="#">
+									<i class="fa-thumbs-up"></i>
+									
+									<span class="line">
+										<strong>Someone special liked this</strong>
+									</span>
+									
+									<span class="line small time">
+										2 minutes ago
+									</span>
+								</a>
+							</li>
+							
+							<li class="notification-danger">
+								<a href="#">
+									<i class="fa-calendar"></i>
+									
+									<span class="line">
+										John cancelled the event
+									</span>
+									
+									<span class="line small time">
+										9 hours ago
+									</span>
+								</a>
+							</li>
+							
+							<li class="notification-info">
+								<a href="#">
+									<i class="fa-database"></i>
+									
+									<span class="line">
+										The server is status is stable
+									</span>
+									
+									<span class="line small time">
+										yesterday at 10:30am
+									</span>
+								</a>
+							</li>
+							
+							<li class="notification-warning">
+								<a href="#">
+									<i class="fa-envelope-o"></i>
+									
+									<span class="line">
+										New comments waiting approval
+									</span>
+									
+									<span class="line small time">
+										last week
+									</span>
+								</a>
+							</li>
+						</ul>
+					</li>
+					
+					<li class="external">
+						<a href="#">
+							<span>View all notifications</span>
+							<i class="fa-link-ext"></i>
+						</a>
+					</li>
+				</ul>
+			</li>
+			
+			<li class="dropdown user-profile">
+				<a href="#" data-toggle="dropdown">
+					<img src="/assets/kuppayam/defaults/user-large.png" alt="user-image" class="img-circle img-inline userpic-32" width="28" />
+					<span>
+						Arlind Nushi
+						<i class="fa-angle-down"></i>
+					</span>
+				</a>
+				
+				<ul class="dropdown-menu user-profile-menu list-unstyled">
+					<li>
+						<a href="#edit-profile">
+							<i class="fa-edit"></i>
+							New Post
+						</a>
+					</li>
+					<li>
+						<a href="#settings">
+							<i class="fa-wrench"></i>
+							Settings
+						</a>
+					</li>
+					<li>
+						<a href="#profile">
+							<i class="fa-user"></i>
+							Profile
+						</a>
+					</li>
+					<li>
+						<a href="#help">
+							<i class="fa-info"></i>
+							Help
+						</a>
+					</li>
+					<li class="last">
+						<a href="extra-lockscreen.html">
+							<i class="fa-lock"></i>
+							Logout
+						</a>
+					</li>
+				</ul>
+			</li>
+			
+			<li>
+				<a href="#" data-toggle="chat">
+					<i class="fa-comments-o"></i>
+				</a>
+			</li>
+			
+		</ul>
+		
+	</div>
+	
+</nav>