Merge remote-tracking branch 'origin/develop' into develop

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

@@ -2,6 +2,7 @@
 <!-- Instrucction tab-->
 <!-- Instrucction tab-->
 <div class="panel panel-default student_tab_panel">
 <div class="panel panel-default student_tab_panel">
  	<div class="panel-body">
  	<div class="panel-body">
+
 	  	  <!-- Select to add new method -->
 	  	  <!-- Select to add new method -->
 	      <div class="form-group">
 	      <div class="form-group">
 	        <select class="form-control" name="method_select" id="method_select" ng-model="method_selected">
 	        <select class="form-control" name="method_select" id="method_select" ng-model="method_selected">
@@ -30,13 +31,12 @@
 	      <!-- Method instructions -->
 	      <!-- Method instructions -->
         <div class="method_details" ng-repeat="m in methods">
         <div class="method_details" ng-repeat="m in methods">
 
 
+          <div class="method-header">
             <input type="text" class="editable title" ng-model="m.name " ng-blur="update_method(m)"/>
             <input type="text" class="editable title" ng-model="m.name " ng-blur="update_method(m)"/>
-
-
-		    <div class="options">
-
-		      	<a ng-click="save_as_template(m)" popover="{{ 'save_as_template' | translate}}" popover-trigger="mouseenter"><span class="text_medium color_black glyphicon glyphicon-floppy-disk" aria-hidden="true"></span></a>
-		      	<a ng-click="delete_method(m)" popover="{{ 'delete' | translate}}" popover-trigger="mouseenter"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a>
+            <div class="method-header-options">
+              	<a ng-click="save_as_template(m)" popover="{{ 'save_as_template' | translate}}" popover-trigger="mouseenter"><span class="text_medium color_black glyphicon glyphicon-floppy-disk options-button" aria-hidden="true"></span></a>
+              	<a ng-click="delete_method(m)" popover="{{ 'delete' | translate}}" popover-trigger="mouseenter"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle options-button" aria-hidden="true"></span></a>
+            </div>
           </div>
           </div>
 
 
         	<textarea class="editable" ng-model="m.description " placeholder="{{'description' | translate}}" ng-blur="update_method(m)"></textarea>
         	<textarea class="editable" ng-model="m.description " placeholder="{{'description' | translate}}" ng-blur="update_method(m)"></textarea>
@@ -82,7 +82,7 @@
                 	'glyphicon-minus': i.status == null
                 	'glyphicon-minus': i.status == null
                 }" aria-hidden="true" popover="{{(i.status || 'nobegin') | translate}}" popover-trigger="mouseenter" ng-click="change_status(i)"></span>
                 }" aria-hidden="true" popover="{{(i.status || 'nobegin') | translate}}" popover-trigger="mouseenter" ng-click="change_status(i)"></span>
               </td>
               </td>
-	          <td><a confirmed-click="delete_instruction(i);" ng-confirm-click="{{ 'confirmation' | translate}}" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
+              <td><a confirmed-click="delete_instruction(i);" ng-confirm-click="{{ 'confirmation' | translate}}" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle options-button" aria-hidden="true"></span></a></td>
             </tr>
             </tr>
           </table>
           </table>
 
 

sails/src/assets/styles/main.css

@@ -256,20 +256,34 @@ tr:hover .ops a{
  }
  }
 
 
  /* Panel Instrucciones */
  /* Panel Instrucciones */
+
+.method-header {
+    background-color: #F5F5F3;
+    padding: 5px;
+    margin-bottom: 5px;
+    border: 1px solid #DDDDDD;
+    border-top-left-radius: 10px;
+    border-top-right-radius: 10px;
+}
+
+.method_details {
+    margin-bottom: 30px;
+}
+
 #method_select{
 #method_select{
 	max-width: 300px;
 	max-width: 300px;
 	display: inline-block;
 	display: inline-block;
 	padding-top: 2px;
 	padding-top: 2px;
 }
 }
 
 
-.table_instructions .delete,
-.method_details .options{
-	visibility: hidden;
+.method-header-options{
 	float: right;
 	float: right;
 }
 }
-.table_instructions tr:hover .delete,
-.method_details:hover .options{
-	visibility: visible;
+.options-button{
+	opacity: .2;
+}
+.options-button:hover{
+	opacity: 1;
 }
 }
 
 
 .method_details input.title{
 .method_details input.title{
@@ -306,16 +320,24 @@ td.editable input{
 	text-overflow: ellipsis;
 	text-overflow: ellipsis;
 }
 }
 
 
-
 input.editable{
 input.editable{
 	min-width: 400px;
 	min-width: 400px;
-	border: 1px solid #fff;
+	border: none;
 	background: none;
 	background: none;
 	padding: 6px;
 	padding: 6px;
 }
 }
 
 
 .editable:focus {
 .editable:focus {
-	border-width: 1px;
+	border-width: 0px;
+	border-style: solid;
+	border-radius: 5px;
+	outline: none;
+  border-color: #9ecaed;
+  box-shadow: 0 0 10px #9ecaed;
+}
+
+.editable:hover {
+	border-width: 0px;
 	border-style: solid;
 	border-style: solid;
 	border-radius: 5px;
 	border-radius: 5px;
 	outline: none;
 	outline: none;