Cambios mockup #1745

front/salix/styles/photo-list.scss

@@ -17,6 +17,8 @@
             box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),
                         0 3px 1px -2px rgba(0,0,0,.2),
                         0 1px 5px 0 rgba(0,0,0,.12);
+            background: no-repeat center center fixed;
+            background-size: cover !important;
             overflow: hidden;
             cursor: zoom-in;
             height: 100%;

modules/claim/front/dms/index/index.html

@@ -4,7 +4,13 @@
     limit="20"
     data="$ctrl.photos">
 </vn-crud-model>
-<vn-horizontal class="photo-list" vn-droppable="true" on-drop="$ctrl.onDrop(event)">
+
+<section class="drop-zone" vn-droppable="true" on-drop="$ctrl.onDrop(event)">
+    <section><vn-icon icon="add_circle"></vn-icon></section>
+    <section translate>Drag & Drop files here...</section>
+</section>
+
+<vn-horizontal class="photo-list">
     <section class="photo" ng-repeat="photo in $ctrl.photos">
         <section class="image mdl-shadow--2dp" on-error-src 
             ng-style="{'background': 'url(/api/dms/' + photo.dmsFk + '/downloadFile?access_token=' + $ctrl.accessToken + ')'}"

modules/claim/front/dms/index/style.scss

@@ -1,10 +1,22 @@
 @import "./variables";
 
 vn-claim-dms-index {
-    .photo-list {
+    .drop-zone {
         border: 2px dashed $color-font-secondary;
+        color: $color-font-secondary;
         box-sizing: border-box;
+        padding: 2em $pad-medium;
         border-radius: 0.5em;
+        text-align: center;
+        font-size: 1.4em;
+
+        vn-icon {
+            font-size: 3em
+        }
+    }
+
+    .photo-list {
+        
         padding: $pad-medium;
         min-height: 100%;
 
@@ -13,9 +25,4 @@ vn-claim-dms-index {
             height: 18em;
         }
     }
-
-    vn-empty-rows {
-        color: $color-font-secondary;
-        font-size: 2em
-    }
 }

modules/claim/front/dms/locale/es.yml

@@ -1,4 +1,4 @@
 Are you sure you want to continue?: ¿Seguro que quieres continuar?
-Drag & Drop files here...: Arrasta y suelta archivos aquí...
+Drag & Drop files here...: Arrastra y suelta archivos aquí...
 Photo deleted: Foto eliminada
 Photo uploaded!: Foto subida!