diff --git a/ui/src/style/theme/_alerts.scss b/ui/src/style/theme/_alerts.scss deleted file mode 100644 index 209677f705..0000000000 --- a/ui/src/style/theme/_alerts.scss +++ /dev/null @@ -1,99 +0,0 @@ -/* - Alerts - ----------------------------------------------------------------------------- -*/ - -.alert { - border-style: solid; - border-width: 0; - border-radius: $ix-radius; - position: relative; - padding: $ix-marg-c; - margin-bottom: $ix-marg-c; - font-weight: 500; - @extend %no-user-select; -} - -.alert-icon { - padding-left: ($ix-marg-e - $ix-marg-b); - - > span.icon { - position: absolute; - top: 50%; - left: $ix-marg-c; - transform: translateY(-50%); - width: ($ix-text-base-2 + 4px); - margin: 0; - font-size: $ix-text-base-2; - } -} - -.alert-close { - outline: none; - position: absolute; - top: 50%; - background-color: transparent; - transform: translateY(-50%); - right: ($ix-marg-c - $ix-marg-a); - font-size: $ix-text-base; - width: 20px; - height: 20px; - opacity: 0.25; - transition: - opacity 0.25s ease; - - &:hover { - opacity: 1; - } -} - -// Mixin for Alert Themes -// ---------------------------------------------------------------------------- -@mixin alert-styles( - $bg-color, - $bg-color-2, - $text-color, - $link-color, - $link-hover) { - font-size: 16px; - - @include gradient-h($bg-color,$bg-color-2); - color: $text-color; - - a:link, - a:visited { - color: $link-color; - font-weight: 700; - text-decoration: underline; - transition: - color 0.25s ease; - } - a:hover { - color: $link-hover; - border-color: $link-hover; - } - span.icon { - color: $text-color; - } -} - -// Alert Themes -// ---------------------------------------------------------------------------- -.alert-success { - @include alert-styles($c-rainforest,$c-pool,$g20-white,$c-wasabi,$g20-white); -} -.alert-primary { - @include alert-styles($c-pool,$c-ocean,$g20-white,$c-neutrino,$g20-white); -} -.alert-warning { - @include alert-styles($c-star,$c-pool,$g20-white,$c-neutrino,$g20-white); -} -.alert-danger { - @include alert-styles($c-curacao,$c-star,$g20-white,$c-marmelade,$g20-white); -} -.alert-info { - @include alert-styles($g20-white,$g16-pearl,$g8-storm,$ix-link-default,$ix-link-default-hover); -} -.alert-dark { - @include alert-styles($c-sapphire,$c-shadow,$c-moonstone,$ix-link-default,$ix-link-default-hover); -} diff --git a/ui/src/style/theme/_notifications.scss b/ui/src/style/theme/_notifications.scss index aae627edcb..e878320e77 100644 --- a/ui/src/style/theme/_notifications.scss +++ b/ui/src/style/theme/_notifications.scss @@ -44,7 +44,6 @@ $notification-margin: 12px; font-size: 14px; line-height: 16px; } - .notification-close { outline: none; position: absolute;