style: change yellow color to marigold

Author: jamaljsr

app/src/__tests__/components/loop/ChannelBalance.spec.tsx

@@ -40,8 +40,8 @@ describe('ChannelBalance component', () => {
     const { el, remote, local } = render(0.52);
     expect(el.children.length).toBe(3);
     expect(width(local)).toBe('52%');
-    expect(bgColor(local)).toBe('rgb(255, 249, 23)');
-    expect(bgColor(remote)).toBe('rgb(255, 249, 23)');
+    expect(bgColor(local)).toBe('rgb(239, 160, 11)');
+    expect(bgColor(remote)).toBe('rgb(239, 160, 11)');
   });
 
   it('should display a bad balance', () => {

app/src/components/common/StatusArrow.tsx

@@ -9,7 +9,7 @@ const BaseIcon = styled.span`
     color: ${props => props.theme.colors.green};
   }
   &.warn {
-    color: ${props => props.theme.colors.yellow};
+    color: ${props => props.theme.colors.gold};
   }
   &.error {
     color: ${props => props.theme.colors.pink};

app/src/components/common/StatusDot.tsx

@@ -8,7 +8,7 @@ const Styled = {
       color: ${props => props.theme.colors.green};
     }
     &.warn {
-      color: ${props => props.theme.colors.yellow};
+      color: ${props => props.theme.colors.gold};
     }
     &.error {
       color: ${props => props.theme.colors.pink};

app/src/components/loop/processing/SwapProgress.tsx

@@ -48,7 +48,7 @@ const Styled = {
     height: 1px;
     width: ${props => props.pct}%;
     background-color: ${props =>
-      props.state === SUCCESS ? props.theme.colors.green : props.theme.colors.yellow};
+      props.state === SUCCESS ? props.theme.colors.green : props.theme.colors.gold};
     transition: all 1s;
   `,
 };

app/src/components/theme.tsx

@@ -35,7 +35,7 @@ export interface Theme {
     offWhite: string;
     pink: string;
     green: string;
-    yellow: string;
+    gold: string;
     purple: string;
     overlay: string;
     gradient: string;
@@ -75,7 +75,7 @@ const theme: Theme = {
     offWhite: '#f5f5f5',
     pink: '#f5406e',
     green: '#46E80E',
-    yellow: '#fff917',
+    gold: '#efa00b',
     purple: '#57038d',
     overlay: 'rgba(245,245,245,0.04)',
     gradient: 'linear-gradient(325.53deg, #252F4A 0%, #46547B 100%);',

app/src/util/balances.ts

@@ -48,6 +48,6 @@ export const statusToColor = (level: BalanceStatus, active: boolean, theme: Them
   if (!active) return theme.colors.gray;
 
   if (level === BalanceStatus.danger) return theme.colors.pink;
-  if (level === BalanceStatus.warn) return theme.colors.yellow;
+  if (level === BalanceStatus.warn) return theme.colors.gold;
   return theme.colors.green;
 };