diff --git a/modules/backend/formwidgets/fileupload/assets/css/fileupload.css b/modules/backend/formwidgets/fileupload/assets/css/fileupload.css index 491dc875a..75630f841 100644 --- a/modules/backend/formwidgets/fileupload/assets/css/fileupload.css +++ b/modules/backend/formwidgets/fileupload/assets/css/fileupload.css @@ -225,34 +225,28 @@ width: 76px; height: 76px; } -.field-fileupload.style-image-multi .upload-button table { +.field-fileupload.style-image-multi .upload-button .upload-button-icon { position: absolute; - height: 100%; - width: 100%; + width: 22px; + height: 22px; + top: 50%; + left: 50%; + margin-top: -11px; + margin-left: -11px; } -.field-fileupload.style-image-multi .upload-button table td { - line-height: 16px; - font-size: 11px; - vertical-align: middle; - height: 100%; -} -.field-fileupload.style-image-multi .upload-button table td:before { +.field-fileupload.style-image-multi .upload-button .upload-button-icon:before { text-align: center; - width: 100%; display: block; font-size: 22px; + height: 22px; + width: 22px; + line-height: 22px; color: rgba(0, 0, 0, 0.1); - vertical-align: middle; -} -.field-fileupload.style-image-multi .upload-button table td span { - display: block; - padding: 10px; - text-align: center; } .field-fileupload.style-image-multi .upload-button:hover { border: 2px dotted rgba(0, 0, 0, 0.2); } -.field-fileupload.style-image-multi .upload-button:hover table td:before { +.field-fileupload.style-image-multi .upload-button:hover .upload-button-icon:before { color: #5cb85c; color: rgba(0, 0, 0, 0.2); } @@ -260,7 +254,7 @@ border: 2px solid rgba(0, 0, 0, 0.3); background: transparent; } -.field-fileupload.style-image-multi .upload-button:focus table td:before { +.field-fileupload.style-image-multi .upload-button:focus .upload-button-icon:before { color: #5cb85c; color: rgba(0, 0, 0, 0.2); } @@ -382,35 +376,31 @@ border: 2px dotted rgba(0, 0, 0, 0.1); position: relative; outline: none; + min-height: 100px; + min-width: 100px; } -.field-fileupload.style-image-single .upload-button table { +.field-fileupload.style-image-single .upload-button .upload-button-icon { position: absolute; - height: 100%; - width: 100%; + width: 22px; + height: 22px; + top: 50%; + left: 50%; + margin-top: -11px; + margin-left: -11px; } -.field-fileupload.style-image-single .upload-button table td { - line-height: 16px; - font-size: 11px; - vertical-align: middle; - height: 100%; -} -.field-fileupload.style-image-single .upload-button table td:before { +.field-fileupload.style-image-single .upload-button .upload-button-icon:before { text-align: center; - width: 100%; display: block; font-size: 22px; + height: 22px; + width: 22px; + line-height: 22px; color: rgba(0, 0, 0, 0.1); - vertical-align: middle; -} -.field-fileupload.style-image-single .upload-button table td span { - display: block; - padding: 10px; - text-align: center; } .field-fileupload.style-image-single .upload-button:hover { border: 2px dotted rgba(0, 0, 0, 0.2); } -.field-fileupload.style-image-single .upload-button:hover table td:before { +.field-fileupload.style-image-single .upload-button:hover .upload-button-icon:before { color: #5cb85c; color: rgba(0, 0, 0, 0.2); } @@ -418,15 +408,10 @@ border: 2px solid rgba(0, 0, 0, 0.3); background: transparent; } -.field-fileupload.style-image-single .upload-button:focus table td:before { +.field-fileupload.style-image-single .upload-button:focus .upload-button-icon:before { color: #5cb85c; color: rgba(0, 0, 0, 0.2); } -.field-fileupload.style-image-single .upload-button, -.field-fileupload.style-image-single .upload-button > table { - min-height: 100px; - min-width: 100px; -} .field-fileupload.style-image-single .upload-object { padding-bottom: 66px; } diff --git a/modules/backend/formwidgets/fileupload/assets/less/fileupload.base.less b/modules/backend/formwidgets/fileupload/assets/less/fileupload.base.less index 4134e65c9..cc2b64286 100644 --- a/modules/backend/formwidgets/fileupload/assets/less/fileupload.base.less +++ b/modules/backend/formwidgets/fileupload/assets/less/fileupload.base.less @@ -41,38 +41,31 @@ border: 2px dotted rgba(0,0,0,.1); position: relative; outline: none; - table { - position: absolute; - height: 100%; - width: 100%; - } - table td { - line-height: 16px; - font-size: 11px; - vertical-align: middle; - height: 100%; + .upload-button-icon { + position: absolute; + width: 22px; + height: 22px; + top: 50%; + left: 50%; + margin-top: -11px; + margin-left: -11px; &:before { text-align: center; - width: 100%; display: block; font-size: 22px; + height: 22px; + width: 22px; + line-height: 22px; color: rgba(0,0,0,.1); - vertical-align: middle; - } - - span { - display: block; - padding: 10px; - text-align: center; } } &:hover { border: 2px dotted rgba(0,0,0,.2); - table td:before { + .upload-button-icon:before { color: @brand-success; color: rgba(0,0,0,.2); } @@ -82,7 +75,7 @@ border: 2px solid rgba(0,0,0,.3); background: transparent; - table td:before { + .upload-button-icon:before { color: @brand-success; color: rgba(0,0,0,.2); } diff --git a/modules/backend/formwidgets/fileupload/assets/less/fileupload.imagesingle.less b/modules/backend/formwidgets/fileupload/assets/less/fileupload.imagesingle.less index 7ab672d4f..c17530480 100644 --- a/modules/backend/formwidgets/fileupload/assets/less/fileupload.imagesingle.less +++ b/modules/backend/formwidgets/fileupload/assets/less/fileupload.imagesingle.less @@ -11,10 +11,8 @@ .upload-button { .uploader-block-button(); - &, > table { - min-height: 100px; - min-width: 100px; - } + min-height: 100px; + min-width: 100px; } .upload-object { diff --git a/modules/backend/formwidgets/fileupload/partials/_image_multi.htm b/modules/backend/formwidgets/fileupload/partials/_image_multi.htm index 5fefe77f4..27001789d 100644 --- a/modules/backend/formwidgets/fileupload/partials/_image_multi.htm +++ b/modules/backend/formwidgets/fileupload/partials/_image_multi.htm @@ -12,7 +12,7 @@ -
+
diff --git a/modules/backend/formwidgets/fileupload/partials/_image_single.htm b/modules/backend/formwidgets/fileupload/partials/_image_single.htm index 0a762befe..ac855f408 100644 --- a/modules/backend/formwidgets/fileupload/partials/_image_single.htm +++ b/modules/backend/formwidgets/fileupload/partials/_image_single.htm @@ -14,7 +14,7 @@ href="javascript:;" style="" class="upload-button"> -
+ diff --git a/modules/cms/formwidgets/mediafinder/assets/css/mediafinder.css b/modules/cms/formwidgets/mediafinder/assets/css/mediafinder.css index c0e02ec12..c4151dc11 100644 --- a/modules/cms/formwidgets/mediafinder/assets/css/mediafinder.css +++ b/modules/cms/formwidgets/mediafinder/assets/css/mediafinder.css @@ -59,35 +59,31 @@ border: 2px dotted rgba(0, 0, 0, 0.1); position: relative; outline: none; + min-height: 100px; + min-width: 100px; } -.field-mediafinder.style-image-single .find-button table { +.field-mediafinder.style-image-single .find-button .find-button-icon { position: absolute; - height: 100%; - width: 100%; + width: 22px; + height: 22px; + top: 50%; + left: 50%; + margin-top: -11px; + margin-left: -11px; } -.field-mediafinder.style-image-single .find-button table td { - line-height: 16px; - font-size: 11px; - vertical-align: middle; - height: 100%; -} -.field-mediafinder.style-image-single .find-button table td:before { +.field-mediafinder.style-image-single .find-button .find-button-icon:before { text-align: center; - width: 100%; display: block; font-size: 22px; + height: 22px; + width: 22px; + line-height: 22px; color: rgba(0, 0, 0, 0.1); - vertical-align: middle; -} -.field-mediafinder.style-image-single .find-button table td span { - display: block; - padding: 10px; - text-align: center; } .field-mediafinder.style-image-single .find-button:hover { border: 2px dotted rgba(0, 0, 0, 0.2); } -.field-mediafinder.style-image-single .find-button:hover table td:before { +.field-mediafinder.style-image-single .find-button:hover .find-button-icon:before { color: #5cb85c; color: rgba(0, 0, 0, 0.2); } @@ -95,15 +91,10 @@ border: 2px solid rgba(0, 0, 0, 0.3); background: transparent; } -.field-mediafinder.style-image-single .find-button:focus table td:before { +.field-mediafinder.style-image-single .find-button:focus .find-button-icon:before { color: #5cb85c; color: rgba(0, 0, 0, 0.2); } -.field-mediafinder.style-image-single .find-button, -.field-mediafinder.style-image-single .find-button > table { - min-height: 100px; - min-width: 100px; -} .field-mediafinder.style-image-single .find-object { display: none; padding-bottom: 39px; diff --git a/modules/cms/formwidgets/mediafinder/assets/less/mediafinder.base.less b/modules/cms/formwidgets/mediafinder/assets/less/mediafinder.base.less index a7c3a1327..261328004 100644 --- a/modules/cms/formwidgets/mediafinder/assets/less/mediafinder.base.less +++ b/modules/cms/formwidgets/mediafinder/assets/less/mediafinder.base.less @@ -4,38 +4,31 @@ border: 2px dotted rgba(0,0,0,.1); position: relative; outline: none; - table { - position: absolute; - height: 100%; - width: 100%; - } - table td { - line-height: 16px; - font-size: 11px; - vertical-align: middle; - height: 100%; + .find-button-icon { + position: absolute; + width: 22px; + height: 22px; + top: 50%; + left: 50%; + margin-top: -11px; + margin-left: -11px; &:before { text-align: center; - width: 100%; display: block; font-size: 22px; + height: 22px; + width: 22px; + line-height: 22px; color: rgba(0,0,0,.1); - vertical-align: middle; - } - - span { - display: block; - padding: 10px; - text-align: center; } } &:hover { border: 2px dotted rgba(0,0,0,.2); - table td:before { + .find-button-icon:before { color: @brand-success; color: rgba(0,0,0,.2); } @@ -45,7 +38,7 @@ border: 2px solid rgba(0,0,0,.3); background: transparent; - table td:before { + .find-button-icon:before { color: @brand-success; color: rgba(0,0,0,.2); } diff --git a/modules/cms/formwidgets/mediafinder/assets/less/mediafinder.imagesingle.less b/modules/cms/formwidgets/mediafinder/assets/less/mediafinder.imagesingle.less index f22a29f3e..affe3ccca 100644 --- a/modules/cms/formwidgets/mediafinder/assets/less/mediafinder.imagesingle.less +++ b/modules/cms/formwidgets/mediafinder/assets/less/mediafinder.imagesingle.less @@ -3,10 +3,8 @@ .find-button { .finder-block-button(); - &, > table { - min-height: 100px; - min-width: 100px; - } + min-height: 100px; + min-width: 100px; } .find-object { diff --git a/modules/cms/formwidgets/mediafinder/partials/_image_single.htm b/modules/cms/formwidgets/mediafinder/partials/_image_single.htm index dd5e257f1..a9390bb67 100644 --- a/modules/cms/formwidgets/mediafinder/partials/_image_single.htm +++ b/modules/cms/formwidgets/mediafinder/partials/_image_single.htm @@ -6,7 +6,7 @@ -
+