diff --git a/media/css/impala/developers.less b/media/css/impala/developers.less index 1051c7c549..8a1f58cc22 100644 --- a/media/css/impala/developers.less +++ b/media/css/impala/developers.less @@ -484,42 +484,40 @@ /* Invisible file inputs */ .invisible-upload { - position: relative; + cursor: pointer; display: inline-block; overflow: hidden; - cursor: pointer; + position: relative; input { display: block; + cursor: pointer; + height: 110%; + opacity: 0; + outline: none; + position: absolute; right: 0; bottom: 0; width: auto; - height: 110%; - cursor: pointer; - /* stack this below the navbar: */ + /* Stack this below the navbar. */ z-index: 0; - outline: none; } - a.button { - display: none; - } - &.modern { + &:hover { input { - opacity: 0; - position: absolute; + // Large target fix so the input is always clickable. + font-size: 1000px; } - &:hover { - input { - // Large target fix so the input is always clickable. - font-size: 1000px; - } + } + &:hover a.button, &:focus a.button { + border-color: #25f; + .box-shadow(inset 0 0 2px #fff); + } + &.legacy { + input { + opacity: 1; + position: static; } a.button { - position: relative; - display: inline-block; - } - &:hover a.button, &:focus a.button { - border-color: #25f; - .box-shadow(inset 0 0 2px #fff); + display: none; } } a.link { @@ -532,4 +530,4 @@ } .edit-addon-section #icons_default { margin-bottom: 1em; -} \ No newline at end of file +} diff --git a/media/js/zamboni/devhub.js b/media/js/zamboni/devhub.js index 41e0ac3829..de816d59f6 100644 --- a/media/js/zamboni/devhub.js +++ b/media/js/zamboni/devhub.js @@ -656,8 +656,8 @@ function initUploadPreview() { } function initInvisibleUploads() { - if (z.capabilities.fileAPI) { - $('.invisible-upload').addClass('modern'); + if (!z.capabilities.fileAPI) { + $('.invisible-upload').addClass('legacy'); } } diff --git a/media/js/zamboni/upload.js b/media/js/zamboni/upload.js index a9b0691794..bb48872318 100644 --- a/media/js/zamboni/upload.js +++ b/media/js/zamboni/upload.js @@ -163,6 +163,10 @@ $upload_field.before(ui_link); $upload_field.parent().after(ui_details); + if (!z.capabilities.fileAPI) { + $('.invisible-upload').addClass('legacy'); + } + /* Get things started */ var upload_box, upload_title, upload_progress_outside, upload_progress_inside,