From 42ab20462ad6bbec32d4c43f36d8faa1e19b632a Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Mon, 12 Dec 2022 11:39:24 -0800
Subject: [PATCH 01/19] WIP dropzone styles

---
 src/components/form/file_picker/_file_picker.scss | 7 +++++--
 src/components/form/file_picker/file_picker.tsx   | 1 +
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index d3ef6d06b8c..bd9a74735f6 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -68,13 +68,14 @@
   * 4. Static height so that it doesn't shift its surrounding contents around
   */
 .euiFilePicker__prompt {
-  @include euiFormControlDefaultShadow;
+  // @include euiFormControlDefaultShadow;
   @include euiFormControlWithIcon; /* 2 */
   height: $euiFormControlHeight;
   padding-top: $euiFormControlPadding;
   padding-right: $euiFormControlPadding;
   padding-bottom: $euiFormControlPadding;
   pointer-events: none; /* 1 */
+  border: 2px dashed $euiColorLightShade;
   border-radius: $euiFormControlBorderRadius;
 
   transition:
@@ -115,7 +116,9 @@
 
   // make normal sized prompt look like placeholder
   .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) & {
-    color: $euiColorMediumShade;
+    color: $euiColorPrimaryText;
+    position: relative;
+    top: -2px;
   }
 }
 
diff --git a/src/components/form/file_picker/file_picker.tsx b/src/components/form/file_picker/file_picker.tsx
index ea68af5751d..d3b3db782c8 100644
--- a/src/components/form/file_picker/file_picker.tsx
+++ b/src/components/form/file_picker/file_picker.tsx
@@ -244,6 +244,7 @@ export class EuiFilePicker extends Component<EuiFilePickerProps> {
                 <div className="euiFilePicker__prompt" id={promptId}>
                   <EuiIcon
                     className="euiFilePicker__icon"
+                    color="primary"
                     type="importAction"
                     size={normalFormControl ? 'm' : 'l'}
                     aria-hidden="true"

From a4e1cc1f32ec1d758578d09b2d5efb9714a46ff4 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Mon, 12 Dec 2022 11:40:41 -0800
Subject: [PATCH 02/19] WIP dropzone styles

---
 .../form/file_picker/__snapshots__/file_picker.test.tsx.snap     | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap b/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap
index 91b87eee923..95ed32ad717 100644
--- a/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap
+++ b/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap
@@ -21,6 +21,7 @@ exports[`EuiFilePicker is rendered 1`] = `
       <span
         aria-hidden="true"
         class="euiFilePicker__icon"
+        color="primary"
         data-euiicon-type="importAction"
       />
       <div

From b9a69dd181a988e90c5a435ec85b593c1eb885f6 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 09:05:19 -0800
Subject: [PATCH 03/19] Variable for border width

---
 src/components/form/file_picker/_file_picker.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index bd9a74735f6..313eac73acf 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -75,7 +75,7 @@
   padding-right: $euiFormControlPadding;
   padding-bottom: $euiFormControlPadding;
   pointer-events: none; /* 1 */
-  border: 2px dashed $euiColorLightShade;
+  border: $euiBorderWidthThick dashed $euiColorLightShade;
   border-radius: $euiFormControlBorderRadius;
 
   transition:

From ea072f62f398195980d92c1906b9d72c3f7ddf6b Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 10:22:49 -0800
Subject: [PATCH 04/19] Changelog entry.

---
 upcoming_changelogs/6479.md | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 upcoming_changelogs/6479.md

diff --git a/upcoming_changelogs/6479.md b/upcoming_changelogs/6479.md
new file mode 100644
index 00000000000..16c025e309e
--- /dev/null
+++ b/upcoming_changelogs/6479.md
@@ -0,0 +1 @@
+- EuiFilePicker styles have been updated to improve interaction and accessibility.

From 19e4eab29fea1879c64845bfbef21109ed972487 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 10:24:50 -0800
Subject: [PATCH 05/19] Update
 src/components/form/file_picker/_file_picker.scss

Co-authored-by: Cee <constancecchen@users.noreply.github.com>
---
 src/components/form/file_picker/_file_picker.scss | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index 313eac73acf..ce77480b443 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -68,7 +68,6 @@
   * 4. Static height so that it doesn't shift its surrounding contents around
   */
 .euiFilePicker__prompt {
-  // @include euiFormControlDefaultShadow;
   @include euiFormControlWithIcon; /* 2 */
   height: $euiFormControlHeight;
   padding-top: $euiFormControlPadding;

From 5e92c1dd81c4401b816a564659775071c7fe6857 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 10:26:26 -0800
Subject: [PATCH 06/19] Update upcoming_changelogs/6479.md

Co-authored-by: Cee <constancecchen@users.noreply.github.com>
---
 upcoming_changelogs/6479.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/upcoming_changelogs/6479.md b/upcoming_changelogs/6479.md
index 16c025e309e..b86dedd7311 100644
--- a/upcoming_changelogs/6479.md
+++ b/upcoming_changelogs/6479.md
@@ -1 +1 @@
-- EuiFilePicker styles have been updated to improve interaction and accessibility.
+- `EuiFilePicker` styles have been updated to look more like an interactive element.

From 962fc8b84668fcedb6568136388b2a5ca61b7db6 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Mon, 12 Dec 2022 11:39:24 -0800
Subject: [PATCH 07/19] WIP dropzone styles

---
 src/components/form/file_picker/_file_picker.scss | 7 +++++--
 src/components/form/file_picker/file_picker.tsx   | 1 +
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index d3ef6d06b8c..bd9a74735f6 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -68,13 +68,14 @@
   * 4. Static height so that it doesn't shift its surrounding contents around
   */
 .euiFilePicker__prompt {
-  @include euiFormControlDefaultShadow;
+  // @include euiFormControlDefaultShadow;
   @include euiFormControlWithIcon; /* 2 */
   height: $euiFormControlHeight;
   padding-top: $euiFormControlPadding;
   padding-right: $euiFormControlPadding;
   padding-bottom: $euiFormControlPadding;
   pointer-events: none; /* 1 */
+  border: 2px dashed $euiColorLightShade;
   border-radius: $euiFormControlBorderRadius;
 
   transition:
@@ -115,7 +116,9 @@
 
   // make normal sized prompt look like placeholder
   .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) & {
-    color: $euiColorMediumShade;
+    color: $euiColorPrimaryText;
+    position: relative;
+    top: -2px;
   }
 }
 
diff --git a/src/components/form/file_picker/file_picker.tsx b/src/components/form/file_picker/file_picker.tsx
index ea68af5751d..d3b3db782c8 100644
--- a/src/components/form/file_picker/file_picker.tsx
+++ b/src/components/form/file_picker/file_picker.tsx
@@ -244,6 +244,7 @@ export class EuiFilePicker extends Component<EuiFilePickerProps> {
                 <div className="euiFilePicker__prompt" id={promptId}>
                   <EuiIcon
                     className="euiFilePicker__icon"
+                    color="primary"
                     type="importAction"
                     size={normalFormControl ? 'm' : 'l'}
                     aria-hidden="true"

From 17ae5ce401667035aecc862758c1e52f2585c75e Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Mon, 12 Dec 2022 11:40:41 -0800
Subject: [PATCH 08/19] WIP dropzone styles

---
 .../form/file_picker/__snapshots__/file_picker.test.tsx.snap     | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap b/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap
index 91b87eee923..95ed32ad717 100644
--- a/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap
+++ b/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap
@@ -21,6 +21,7 @@ exports[`EuiFilePicker is rendered 1`] = `
       <span
         aria-hidden="true"
         class="euiFilePicker__icon"
+        color="primary"
         data-euiicon-type="importAction"
       />
       <div

From e3ee79ed03261a763ef822c9852418e651ceab23 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 09:05:19 -0800
Subject: [PATCH 09/19] Variable for border width

---
 src/components/form/file_picker/_file_picker.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index bd9a74735f6..313eac73acf 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -75,7 +75,7 @@
   padding-right: $euiFormControlPadding;
   padding-bottom: $euiFormControlPadding;
   pointer-events: none; /* 1 */
-  border: 2px dashed $euiColorLightShade;
+  border: $euiBorderWidthThick dashed $euiColorLightShade;
   border-radius: $euiFormControlBorderRadius;
 
   transition:

From 2afec45f867cef96b23f1b2d105157848fa32aaa Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 10:22:49 -0800
Subject: [PATCH 10/19] Changelog entry.

---
 upcoming_changelogs/6479.md | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 upcoming_changelogs/6479.md

diff --git a/upcoming_changelogs/6479.md b/upcoming_changelogs/6479.md
new file mode 100644
index 00000000000..16c025e309e
--- /dev/null
+++ b/upcoming_changelogs/6479.md
@@ -0,0 +1 @@
+- EuiFilePicker styles have been updated to improve interaction and accessibility.

From ea0b40d67a4272acb689c1047274f7cd6fdcbe5c Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 10:24:50 -0800
Subject: [PATCH 11/19] Update
 src/components/form/file_picker/_file_picker.scss

Co-authored-by: Cee <constancecchen@users.noreply.github.com>
---
 src/components/form/file_picker/_file_picker.scss | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index 313eac73acf..ce77480b443 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -68,7 +68,6 @@
   * 4. Static height so that it doesn't shift its surrounding contents around
   */
 .euiFilePicker__prompt {
-  // @include euiFormControlDefaultShadow;
   @include euiFormControlWithIcon; /* 2 */
   height: $euiFormControlHeight;
   padding-top: $euiFormControlPadding;

From 6ec33c91bb568c262edb9866bddc1c854257ea63 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 10:37:10 -0800
Subject: [PATCH 12/19] Margin instead of positioning

---
 src/components/form/file_picker/_file_picker.scss | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index ce77480b443..4a36edf1dfd 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -116,8 +116,7 @@
   // make normal sized prompt look like placeholder
   .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) & {
     color: $euiColorPrimaryText;
-    position: relative;
-    top: -2px;
+    margin-top: calc(#{$euiSizeXS} / -2);
   }
 }
 

From 718745741206d3ab2f69012c2837481b6aae7445 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 11:20:28 -0800
Subject: [PATCH 13/19] Don't need no calc

---
 src/components/form/file_picker/_file_picker.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index 4a36edf1dfd..efd12e09339 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -116,7 +116,7 @@
   // make normal sized prompt look like placeholder
   .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) & {
     color: $euiColorPrimaryText;
-    margin-top: calc(#{$euiSizeXS} / -2);
+    margin-top: $euiSizeXS / -2;
   }
 }
 

From 8996e7b7681a7d146fdfe02f289ce31d1757f7d4 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 12:31:21 -0800
Subject: [PATCH 14/19] Fixing compressed and invalid styles

---
 src/components/form/file_picker/_file_picker.scss | 5 ++++-
 src/components/form/file_picker/file_picker.tsx   | 2 +-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index efd12e09339..306623d34b5 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -88,6 +88,7 @@
     @include euiFormControlWithIcon($compressed: true); /* 2 */
     height: $euiFormControlCompressedHeight;
     border-radius: $euiFormControlCompressedBorderRadius;
+    box-shadow: none;
   }
 
   .euiFilePicker--large & {
@@ -101,10 +102,11 @@
 
   .euiFilePicker--large.euiFilePicker--compressed & {
     height: $euiFilePickerTallHeight - $euiSizeL; /* 4 */
+    box-shadow: none;
   }
 
   .euiFilePicker-isInvalid & {
-    @include euiFormControlInvalidStyle;
+    border: $euiBorderWidthThick dashed $euiColorDanger;
   }
 }
 
@@ -161,6 +163,7 @@
 // Disabled
 .euiFilePicker__input:disabled + .euiFilePicker__prompt {
   @include euiFormControlDisabledStyle;
+  box-shadow: none;
 }
 
 // Make space for the icons on the right
diff --git a/src/components/form/file_picker/file_picker.tsx b/src/components/form/file_picker/file_picker.tsx
index d3b3db782c8..6ad1bd6d392 100644
--- a/src/components/form/file_picker/file_picker.tsx
+++ b/src/components/form/file_picker/file_picker.tsx
@@ -244,7 +244,7 @@ export class EuiFilePicker extends Component<EuiFilePickerProps> {
                 <div className="euiFilePicker__prompt" id={promptId}>
                   <EuiIcon
                     className="euiFilePicker__icon"
-                    color="primary"
+                    color={disabled ? 'subdued' : 'primary'}
                     type="importAction"
                     size={normalFormControl ? 'm' : 'l'}
                     aria-hidden="true"

From e4f1e54d482627dbe4110303abad141a7d1de26f Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 14:56:55 -0800
Subject: [PATCH 15/19] Update
 src/components/form/file_picker/_file_picker.scss

Co-authored-by: Cee <constancecchen@users.noreply.github.com>
---
 src/components/form/file_picker/_file_picker.scss | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index 306623d34b5..1db3973c2fe 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -102,7 +102,6 @@
 
   .euiFilePicker--large.euiFilePicker--compressed & {
     height: $euiFilePickerTallHeight - $euiSizeL; /* 4 */
-    box-shadow: none;
   }
 
   .euiFilePicker-isInvalid & {

From ce400de32d1a5b40ebfb8b17d3e927f9161437ba Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Tue, 13 Dec 2022 16:30:21 -0800
Subject: [PATCH 16/19] Sets a proper-looking focus state.

---
 src/components/form/file_picker/_file_picker.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index 306623d34b5..5f2e144b652 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -153,10 +153,10 @@
 // Focus
 .euiFilePicker__showDrop .euiFilePicker__prompt,
 .euiFilePicker__input:focus + .euiFilePicker__prompt {
-  @include euiFormControlFocusStyle;
+  border-color: $euiColorPrimary;
 
   .euiFilePicker--compressed & {
-    @include euiFormControlFocusStyle($borderOnly: true);
+    border-color: $euiColorPrimary;
   }
 }
 

From 34d4fc8d97b68ed81edccd3a0a9acbe4247211b9 Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Wed, 14 Dec 2022 09:14:26 -0800
Subject: [PATCH 17/19] Requested changes from code review

---
 .../form/file_picker/_file_picker.scss        | 19 ++++++++-----------
 1 file changed, 8 insertions(+), 11 deletions(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index b1f08959e8e..4c81396586b 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -64,8 +64,7 @@
 /**
   * 1. Don't block the user from dropping files onto the filepicker.
   * 2. Ensure space for import icon, loading spinner, and clear button (only if it has files)
-  * 3. Delay focus gradient or else it will only partially transition while file chooser opens
-  * 4. Static height so that it doesn't shift its surrounding contents around
+  * 3. Static height so that it doesn't shift its surrounding contents around
   */
 .euiFilePicker__prompt {
   @include euiFormControlWithIcon; /* 2 */
@@ -78,10 +77,8 @@
   border-radius: $euiFormControlBorderRadius;
 
   transition:
-    box-shadow $euiAnimSpeedFast ease-in,
-    background-color $euiAnimSpeedFast ease-in,
-    background-image $euiAnimSpeedFast ease-in,
-    background-size $euiAnimSpeedFast ease-in $euiAnimSpeedFast; /* 3 */
+    border-color $euiAnimSpeedFast ease-in,
+    background-color $euiAnimSpeedFast ease-in;
 
   .euiFilePicker--compressed & {
     @include euiFormControlStyleCompressed($includeStates: false);
@@ -114,9 +111,13 @@
   @include euiTextTruncate;
   line-height: $euiSize;
 
-  // make normal sized prompt look like placeholder
+  // Make normal sized propmpt stand out a bit more - on the large sizez we don't need this as its already identifiable
   .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) & {
     color: $euiColorPrimaryText;
+  }
+
+  // Offset/center prompt text for non-large file-pickers
+  .euiFilePicker:not(.euiFilePicker--large) & {
     margin-top: $euiSizeXS / -2;
   }
 }
@@ -153,10 +154,6 @@
 .euiFilePicker__showDrop .euiFilePicker__prompt,
 .euiFilePicker__input:focus + .euiFilePicker__prompt {
   border-color: $euiColorPrimary;
-
-  .euiFilePicker--compressed & {
-    border-color: $euiColorPrimary;
-  }
 }
 
 // Disabled

From a4efba724efd6be717f7fcaa7fbe01f4a4fe6e0c Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Wed, 14 Dec 2022 09:34:15 -0800
Subject: [PATCH 18/19] Update
 src/components/form/file_picker/_file_picker.scss

Co-authored-by: Cee <constancecchen@users.noreply.github.com>
---
 src/components/form/file_picker/_file_picker.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index 4c81396586b..48e8547ecca 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -64,7 +64,7 @@
 /**
   * 1. Don't block the user from dropping files onto the filepicker.
   * 2. Ensure space for import icon, loading spinner, and clear button (only if it has files)
-  * 3. Static height so that it doesn't shift its surrounding contents around
+  * 4. Static height so that it doesn't shift its surrounding contents around
   */
 .euiFilePicker__prompt {
   @include euiFormControlWithIcon; /* 2 */

From 5d99aac1cacd1887215ca30e7965ddfb2636c50d Mon Sep 17 00:00:00 2001
From: Davey Holler <daveyholler@hey.com>
Date: Wed, 14 Dec 2022 09:34:29 -0800
Subject: [PATCH 19/19] Update
 src/components/form/file_picker/_file_picker.scss

Co-authored-by: Cee <constancecchen@users.noreply.github.com>
---
 src/components/form/file_picker/_file_picker.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
index 48e8547ecca..b67038f232e 100644
--- a/src/components/form/file_picker/_file_picker.scss
+++ b/src/components/form/file_picker/_file_picker.scss
@@ -111,7 +111,7 @@
   @include euiTextTruncate;
   line-height: $euiSize;
 
-  // Make normal sized propmpt stand out a bit more - on the large sizez we don't need this as its already identifiable
+  // Make normal sized prompt stand out a bit more - on the large size we don't need this as it's already identifiable
   .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) & {
     color: $euiColorPrimaryText;
   }