From 688dcc020f099748daad4397e4169d03041b18c9 Mon Sep 17 00:00:00 2001 From: Colin Darie Date: Wed, 22 Mar 2023 11:04:36 +0100 Subject: [PATCH] fix(a11y): increase upload progress bar contrast when focused Closes #8555 --- app/assets/stylesheets/direct_uploads.scss | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/app/assets/stylesheets/direct_uploads.scss b/app/assets/stylesheets/direct_uploads.scss index 54fa203b1..73785f9cc 100644 --- a/app/assets/stylesheets/direct_uploads.scss +++ b/app/assets/stylesheets/direct_uploads.scss @@ -11,7 +11,7 @@ } .direct-upload--pending { - opacity: 0.6; + opacity: 0.7; } .direct-upload__progress { @@ -19,18 +19,21 @@ top: 0; left: 0; bottom: 0; - opacity: 0.2; - background: #0076ff; + background-color: var(--background-contrast-grey); transition: width 120ms ease-out, opacity 60ms 60ms ease-in; transform: translate3d(0, 0, 0); } +.direct-upload__filename { + position: relative; // set a position so it appears above the progress bar +} + .direct-upload--complete .direct-upload__progress { - opacity: 0.4; + background-color: var(--background-overlap-grey); } .direct-upload--error { - border-color: red; + border-color: var(--border-plain-error); } input[type=file][data-direct-upload-url][disabled],