Merge pull request ezsystems#19 from ezsystems/ezp-26915-cancel_button

Fix EZP-26915: ezmultiupload cancel button is not visible
ezpublishlegacy · Mar 23, 2017 · 47b9986 · 47b9986
2 parents 7eb146a + 1d7245d
commit 47b9986
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 1 deletion.
diff --git a/design/standard/stylesheets/ezmultiupload.css b/design/standard/stylesheets/ezmultiupload.css
@@ -75,6 +75,20 @@
     background-color: #fc8c00;
 }
 
+.content-view-ezmultiupload #uploadButtonOverlay {
+    max-width: 40%;
+}
+
 .content-view-ezmultiupload #cancelUploadButton {
     visibility: hidden;
+    width: 40%;
+    margin-top: 1em;
+    border: none rgba(0,0,0,0);
+    background-color: #e6e6e6;
+    font-size: 100%;
+    padding: .4em 1em .45em;
+    box-shadow: 0 0 0 1px rgba(0,0,0,0.25) inset, 0 2px 0 rgba(255,255,255,0.30) inset, 0 1px 2px rgba(0,0,0,0.15);
+    background-image: linear-gradient(rgba(255,255,255,0.30),rgba(255,255,255,0.15) 40%,transparent);
+    transition: .1s linear box-shadow;
+    border-radius: 4px;
 }
diff --git a/design/standard/templates/ezmultiupload/upload.tpl b/design/standard/templates/ezmultiupload/upload.tpl
@@ -42,7 +42,7 @@
     </div>
         <div class="attribute-description">
             <p>{'The files are uploaded to'|i18n('extension/ezmultiupload')} <a href={$parent_node.url_alias|ezurl}>{$parent_node.name|wash}</a></p>
-            <div id="uploadButtonOverlay" style="position: absolute; z-index: 2"></div>
+            <div id="uploadButtonOverlay"></div>
             <button id="cancelUploadButton" type="button">{'Cancel'|i18n('extension/ezmultiupload')}</button>
             <p><noscript><em style="color: red;">{'Javascript has been disabled, this is needed for multiupload!'|i18n('extension/ezmultiupload')}</em></noscript></p>
         </div>