refactor: normalize colors with AlertUI tokens

HathorNetwork · Nov 1, 2023 · a849641 · a849641
1 parent f072c47
commit a849641
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 7 deletions.
diff --git a/src/screens/NetworkSettings/CustomNetworkSettingsScreen.js b/src/screens/NetworkSettings/CustomNetworkSettingsScreen.js
@@ -12,6 +12,7 @@ import errorIcon from '../../assets/images/icErrorBig.png';
 import checkIcon from '../../assets/images/icCheckBig.png';
 import Spinner from '../../components/Spinner';
 import { hasSucceed, hasFailed, isLoading } from './helper';
+import { AlertUI } from '../../styles/themes';
 
 const customNetworkSettingsTitleText = t`Custom Network Settings`.toUpperCase();
 const warningText = t`Any token outside mainnet network bear no value. Only change if you know what you are doing.`;
@@ -65,14 +66,14 @@ const styles = StyleSheet.create({
   },
   warningContainer: {
     borderRadius: 8,
-    backgroundColor: 'hsl(47, 100%, 86%)', // warning yellow
+    backgroundColor: AlertUI.lightColor,
     marginBottom: 32,
     borderWidth: 1,
-    borderColor: 'hsl(47, 100%, 70%)', // warning yellow - 16% light
+    borderColor: AlertUI.baseHslColor.addLightness(4).toString(),
   },
   warningMessage: {
     fontSize: 14,
-    color: 'hsl(47, 100%, 22%)', // warning yellow - 64% light
+    color: AlertUI.darkColor,
     padding: 12,
   },
   input: {

diff --git a/src/screens/NetworkSettings/NetworkSettingsDisclaimerScreen.js b/src/screens/NetworkSettings/NetworkSettingsDisclaimerScreen.js
@@ -13,7 +13,7 @@ import {
 import { t } from 'ttag';
 import HathorHeader from '../../components/HathorHeader';
 import NewHathorButton from '../../components/NewHathorButton';
-import { COLORS } from '../../styles/themes';
+import { AlertUI, COLORS } from '../../styles/themes';
 import { NetworkPreSettingsNav } from './NetworkPreSettingsScreen';
 
 const riskDisclaimerTitleText = t`Risk Disclaimer`.toUpperCase();
@@ -31,10 +31,10 @@ const style = StyleSheet.create({
   },
   warningContainer: {
     borderRadius: 8,
-    backgroundColor: 'hsl(47, 100%, 86%)', // warning yellow
+    backgroundColor: AlertUI.lightColor,
     marginBottom: 16,
     borderWidth: 1,
-    borderColor: 'hsl(47, 100%, 70%)', // warning yellow - 16% light
+    borderColor: AlertUI.baseHslColor.addLightness(4).toString(),
     shadowColor: COLORS.textColor,
     shadowOffset: {
       width: 0,
@@ -46,7 +46,7 @@ const style = StyleSheet.create({
   },
   warningMessage: {
     fontSize: 16,
-    color: 'hsl(47, 100%, 22%)', // warning yellow - 64% light
+    color: AlertUI.darkColor,
     padding: 16,
     paddingBottom: 48,
   },