fix colors

lib/components/PenaLink.tsx

@@ -14,10 +14,14 @@ export function PenaLink(props: LinkProps) {
                     gap: "3px",
                     textUnderlinePosition: "under",
                     color: theme.palette.purple.main,
-                    textDecorationColor: theme.palette.purple.main,
-                    textUnderlineOffset: "3px",
+                    textDecorationColor: theme.palette.purple.dark,
+                    textUnderlineOffset: "2px",
+                    "&:hover": {
+                        textDecorationColor: theme.palette.purple.main,
+                    },
                     "&:active": {
-                        color: "#FFFFFF",
+                        color: "white",
+                        textDecorationColor: "white",
                     },
                 }
             }, props)}

lib/components/theme.ts

@@ -27,7 +27,8 @@ export const penaMuiTheme = createTheme({
             default: "#F2F3F7",
         },
         purple: {
-            main: "#7E2AEA", // from brightPurple
+            main: "#944FEE",
+            dark: "#7E2AEA", // from brightPurple -> from purple.main
             light: "#C19AF5", // from fadePurple
         },
         bg: {
@@ -224,6 +225,16 @@ export const penaMuiTheme = createTheme({
                 }
             },
         },
+        MuiAlert: {
+            styleOverrides: {
+                filledError: {
+                    backgroundColor: "#FB5607",
+                },
+                root: {
+                    borderRadius: "8px",
+                }
+            }
+        },
     },
     typography: palette => ({
         h5: {

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@frontend/kitui",
-    "version": "1.0.30",
+    "version": "1.0.31",
     "description": "test",
     "main": "./dist/index.js",
     "module": "./dist/index.js",

src/App.tsx

@@ -100,6 +100,11 @@ export function App() {
                     <ColorShowcase
                         color={theme.palette.purple.main}
                         text1="theme.palette.purple.main"
+                        text2="#944FEE"
+                    />
+                    <ColorShowcase
+                        color={theme.palette.purple.dark}
+                        text1="theme.palette.purple.dark"
                         text2="#7E2AEA"
                     />
                     <ColorShowcase