fix error notifications on dark theme

Author: jacekkolasa

src/components/notifications/notifications.tsx

@@ -20,10 +20,10 @@ export const showCloudInstallationProblemNotification = () => {
   }
   const notificationComponent = createUINotification({
     ...uiNotification,
-    success: false,
+    error: true,
     leftContent: (
       <S.NodeIconContainer>
-        <Icon name="gear" size="large" />
+        <Icon name="gear" size="large" color="error" />
       </S.NodeIconContainer>
     ),
   })
@@ -44,10 +44,10 @@ export const showCloudConnectionProblemNotification = () => {
   }
   const notificationComponent = createUINotification({
     ...uiNotification,
-    success: false,
+    error: true,
     leftContent: (
       <S.NodeIconContainer>
-        <Icon name="gear" size="large" />
+        <Icon name="gear" size="large" color="error" />
       </S.NodeIconContainer>
     ),
   })

src/components/notifications/styled.tsx

@@ -1,5 +1,5 @@
 import styled from "styled-components"
-import { getColor, getSizeBy } from "@netdata/netdata-ui"
+import { getSizeBy } from "@netdata/netdata-ui"
 
 export const NodeIconContainer = styled.div`
   width: ${getSizeBy(5)};
@@ -8,9 +8,6 @@ export const NodeIconContainer = styled.div`
   display: flex;
   justify-content: center;
   align-items: center;
-  & > svg use {
-    fill: ${getColor(["neutral", "limedSpruce"])};
-  }
 `
 
 export const NotificationLink = styled.a`

src/components/ui-notification/styled.ts

@@ -32,5 +32,4 @@ export const HeaderText = styled(Text)<{ error?: boolean; success?: boolean }>`
 export const ContentText = styled(TextSmall)<{ error?: boolean; success?: boolean }>`
   display: block;
   color: ${({ error }) => (error && getColor("error")) || getColor("text")};
-  font-weight: ${({ error }) => error && "bold"};
 `