collection interface changes

sails/src/assets/scripts/modules/student/views/collections.html

@@ -4,13 +4,13 @@
 
     <!-- Grid header -->
     <div class="container-fluid">
-      <div class="col-xs-8" style="margin-bottom:1em;">
+      <div class="col-xs-8" style="margin-top:0.6em;margin-bottom:1em;">
         <i class="fa fa-pencil-square-o fa-2x text-muted" aria-hidden="true"style="margin-right:0.25em;"></i>
         <input type="text" class="grid-header-name" ng-model="viewingGrid.name" ng-blur="update_grid(viewingGrid)">
       </div>
       <!-- Grid header -->
-      <div class="col-xs-2 text-center" style="margin-bottom:1em;">
-        <button type="button" class="btn btn-danger btn-grid-back" ng-if="breadcrumbs.length != 0" ng-click="showLastGrid()">
+      <div class="col-xs-4 text-right" style="margin-bottom:1em;">
+        <button type="button" class="btn btn-default btn-grid-back" ng-if="breadcrumbs.length != 0" ng-click="showLastGrid()">
           <i class="fa fa-arrow-circle-left" aria-hidden="true"></i> {{ 'return_to' | translate }} <b>{{ breadcrumbs[breadcrumbs.length-1].name }}</b>
         </button>
       </div>
@@ -120,9 +120,9 @@
       </div>
     </div><!--/. col-xs-10 -->
 
-    <div class="col-xs-2 text-center">
+    <div class="col-xs-2 text-center grid-panel">
 
-      <label style="margin-bottom:1em;">{{ 'grid_options' | translate }}</label>
+      <label class="grid-panel-head">{{ 'grid_options' | translate }}</label>
 
       <div class="form-group row">
         <button type="button" ng-if="!viewingGrid.active" class="btn btn-default" ng-click="viewingGrid.active=true;activate_grid(viewingGrid)" style="min-width:9.5em;">{{ 'grid_activate' | translate }}</button>
@@ -141,11 +141,11 @@
 
       <hr>
 
-      <label style="margin-bottom:1em;">{{ 'show_grids' | translate }}</label>
+      <label class="grid-panel-head">{{ 'show_grids' | translate }}</label>
 
       <div class="form-group row">
-        <select ng-model="grid" ng-change="showGrid(grid,false)" style="min-width:9.5em;">
-          <option value="{{grid.id}}" ng-repeat="grid in gridsList track by $index" ng-selected="grid.active">
+        <select class="grid-panel-select" ng-model="grid" ng-change="showGrid(grid,false)" size="7">
+          <option value="{{grid.id}}" ng-repeat="grid in gridsList track by $index" ng-selected="grid.active" ng-class="(grid.active) ? 'grid-panel-select-optionselected' : '' ">
             {{ grid.name }}
           </option>
         </select>

sails/src/assets/styles/main.css

@@ -1129,9 +1129,28 @@ input.editable.grid-name {
 }
 
 .grid-header-name{
-  font-size: 30px;
+  font-size: 22px;
   font-weight: 600;
   border: none;
+	width:90%;
+}
+
+.grid-panel{
+  border: 1px solid #e7e7e7;
+  border-radius: 5px;
+  padding-top: 1em;
+  padding-bottom: 1em;
+}
+.grid-panel-head{
+    width: 100%;
+    margin-bottom: 1em;
+}
+.grid-panel-select{
+    border: 1px solid #e7e7e7;
+    min-width:9.5em;
+}
+.grid-panel-select-optionselected{
+    background-color:#c5e4c5;
 }
 
 /* Cambiar tamaño imagen */