diff --git a/frontend/src/App/notifications/index.tsx b/frontend/src/App/notifications/index.tsx index f55fd5157..d4f3806b4 100644 --- a/frontend/src/App/notifications/index.tsx +++ b/frontend/src/App/notifications/index.tsx @@ -96,7 +96,7 @@ const ProgressToast: FunctionComponent = ({ return ( - + {header} diff --git a/frontend/src/App/notifications/style.scss b/frontend/src/App/notifications/style.scss index 8fb53b696..d8e77a635 100644 --- a/frontend/src/App/notifications/style.scss +++ b/frontend/src/App/notifications/style.scss @@ -1,4 +1,9 @@ @import "../../@scss/variable.scss"; +@import "../../@scss/bazarr.scss"; + +@function theme-color($key: "primary") { + @return map-get($theme-colors, $key); +} .alert-container { position: fixed; @@ -17,6 +22,25 @@ backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); + + .toast-body { + span { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + width: 100%; + display: inline-block; + } + .progress { + .progress-bar { + text-shadow: -2px -2px 5px theme-color("primary"), + 2px -2px 5px theme-color("primary"), + -2px 2px 5px theme-color("primary"), + 2px 2px 5px theme-color("primary"); + overflow: visible; + } + } + } } } }