#1257

stacked table on project finder list view
fixed resource tab's mobile rendering issues
added gutter to container-fluid on mobile view

Author: temi

grails-app/assets/javascripts/project-finder.js

@@ -7,6 +7,8 @@
 // leaflet
 //= require leaflet-manifest.js
 //= require_self
+// responsive table
+//= require responsive-table-stacked/stacked.js
 
 function ProjectFinder(config) {
 

grails-app/assets/stylesheets/common.css

@@ -201,6 +201,10 @@ select,input[type="text"],input[type="password"],input[type="datetime"],input[ty
     margin-left: 20px;
 }
 
+.margin-bottom-0, #overviewDocumentList input[type="text"].margin-bottom-0 {
+    margin-bottom: 0;
+}
+
 .margin-bottom-1 {
     display: inline-block;
     margin-bottom: 10px;

grails-app/assets/stylesheets/project-finder.css

@@ -2,6 +2,7 @@
  *= require leaflet-manifest
  *= require facets-filter-view.css
  *= require project-daystogo.css
+ *= require responsive-table-stacked/stacked.css
  */
 
 .projectLogo {

grails-app/views/hub/configurableHubTemplate1.gsp

@@ -33,6 +33,14 @@ section#breadcrumb {
   /* Echo out a label for the example */
   /*image display size on project finder*/
 }
+
+@media (max-width: 767px) {
+    #main-content>.container-fluid, #custom-footer .container-fluid {
+        padding-left: 5px;
+        padding-right: 5px;
+    }
+}
+
 #main-content h1, #main-content h2, #main-content h3, #main-content h4, #main-content h5 {
   font-family: Roboto, Helvetica, "Helvetica Neue", Arial, sans-serif;
   font-weight: 500;

grails-app/views/shared/_listDocuments.gsp

@@ -1,9 +1,9 @@
-<div class="row-fluid row-eq-height" id="${containerId}">
+<div class="row-fluid" id="${containerId}">
     <div class="span4">
         <div class="btn-toolbar text-right">
             <div class="input-prepend input-append text-left">
                 <span class="add-on"><i class="fa fa-filter"></i></span>
-                <input type="text" data-bind="textInput: documentFilter">
+                <input class="span2 margin-bottom-0" type="text" data-bind="textInput: documentFilter">
                 <div class="btn-group">
                     <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
                         <span data-bind="text: documentFilterField().label"></span>