@tactics/toddle-styleguide 1.7.21 → 1.7.22

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tactics/toddle-styleguide",
-  "version": "1.7.21",
+  "version": "1.7.22",
   "main": "index.tsx",
   "types": "index.d.ts",
   "prepublish": "tsc",

package/src/components/molecules/inline-notice/inline-notice.component.tsx

@@ -8,20 +8,20 @@ import {SmallText} from '../../atoms/paragraph-components';
 import { Icon } from '../../../icons';
 
 type InlineNoticeProps = {
-  label: string;
+    label: string;
 };
 
 const InlineNotice = ({label}: InlineNoticeProps) => {
-  const context = useContext(ThemeCtx);
-  const styles = Stylesheet(context);
+    const context = useContext(ThemeCtx);
+    const styles = Stylesheet(context);
 
-  return (
-    <View style={styles.container}>
-      <Icon name='exclamation-circle' style='regular' color={context.colors.ui.warning.dark} />
-      <SmallText addStyle={styles.label} textColor={context.colors.ui.warning.dark}>
-        {label}
-      </SmallText>
-    </View>
-  );
+    return (
+        <View style={styles.container}>
+            <Icon name='exclamation-circle' style='regular' color={context.colors.main[0]} />
+            <SmallText addStyle={styles.label} textColor={context.colors.main[0]}>
+                {label}
+            </SmallText>
+        </View>
+    );
 };
 export {InlineNotice as InlineNotice};

package/src/components/molecules/inline-notice/inline-notice.styles.js

@@ -2,21 +2,21 @@ import {StyleSheet} from 'react-native';
 import {Scale} from '../../../theme/scale';
 
 export const Stylesheet = (context) =>
-  StyleSheet.create({
-    container: {
-      flexDirection: 'row',
-      gap: Scale.m,
-      width: '100%',
-      backgroundColor: context.colors.ui.warning.xlight,
-      borderRadius: Scale.s,
-      alignItems: 'center',
-      justifyContent: 'flex-start',
-      paddingLeft: Scale.m,
-      paddingTop: Scale.m,
-      paddingRight: Scale.m,
-      paddingBottom: Scale.m,
-    },
-    label: {
-      flex: 1
-    }
-  });
+    StyleSheet.create({
+        container: {
+            flexDirection: 'row',
+            gap: Scale.m,
+            width: '100%',
+            backgroundColor: context.colors.main[9],
+            borderRadius: Scale.s,
+            alignItems: 'center',
+            justifyContent: 'flex-start',
+            paddingLeft: Scale.m,
+            paddingTop: Scale.m,
+            paddingRight: Scale.m,
+            paddingBottom: Scale.m,
+        },
+        label: {
+            flex: 1
+        }
+    });