Implement Dark Mode

[darkwing]

Describe the bug

The following are tasks required for implementing dark mode:

• [x] Import new colors library from @georgewrmarshall #13657
• [x] Buttons https://github.com/MetaMask/metamask-extension/pull/13651
• [x] Box #13725
• [x] Typography #13758
• [x] AccountList #13864 @georgewrmarshall
• [x] Callout @georgewrmarshall https://github.com/MetaMask/metamask-extension/pull/13831
• [x] SnapsSettingCard @georgewrmarshall
• [x] Card @georgewrmarshall https://github.com/MetaMask/metamask-extension/pull/13831
• [x] Chip @georgewrmarshall https://github.com/MetaMask/metamask-extension/pull/13831
• [ ] Icons @georgewrmarshall
  • [x] https://github.com/MetaMask/metamask-extension/pull/13861
• [x] Form fields @darkwing
  • [x] Text inputs https://github.com/MetaMask/metamask-extension/pull/13821
  • [x] Password inputs https://github.com/MetaMask/metamask-extension/pull/13821
  • [x] Select dropdowns https://github.com/MetaMask/metamask-extension/pull/13875
  • [x] Textareas https://github.com/MetaMask/metamask-extension/pull/13821
  • [x] Settings toggles
• [x] Basic content background and border colors https://github.com/MetaMask/metamask-extension/pull/13764
• [x] Basic content text colors
  • [x] Headings
  • [x] Paragraphs
  • [x] Links
• [x] Dropdowns, modals, and popovers
  • [x] Networks dropdown
  • [x] Accounts dropdown
  • [x] Account details modal
  • [x] Connected account popover https://github.com/MetaMask/metamask-extension/pull/13932
• [x] Home activity feed and transaction list
• [x] Settings screen
• [x] Hardware wallet connectivity screens
• [ ] Tooltips
• [x] Confirmation screens
• [ ] ActionableMessages & warnings
• [x] Swaps screens

Color list

• [x] --Blue-300 @GuillaumeRx
• [x] --Blue-400 @GuillaumeRx
• [x] --Blue-500 / --primary-blue @GuillaumeRx
• [x] --Grey-000 @GuillaumeRx
• [x] --Grey-100 @GuillaumeRx
• [x] --Grey-200 @GuillaumeRx
• [x] --Grey-400 @GuillaumeRx
• [x] --Grey-500 @GuillaumeRx
• [x] --Red-000 @GuillaumeRx
• [x] --Red-300 @GuillaumeRx
• [x] --Red-500 / --accent-red @GuillaumeRx
• [x] --Orange-500 @GuillaumeRx
• [x] --Yellow-100 @GuillaumeRx
• [x] --Yellow-500 @GuillaumeRx
• [x] --Black-100 @GuillaumeRx
• [x] --primary-1
• [x] --secondary-1
• [x] --secondary-3
• [x] --error-1
• [x] --alert-1
• [x] --success-1
• [x] --success-3
• [x] --ui-black
• [x] --ui-grey
• [x] --ui-white
• [x] --ui-1 @GuillaumeRx
• [x] --ui-2 @GuillaumeRx
• [x] --ui-3 @GuillaumeRx
• [x] --ui-4 @GuillaumeRx
• [x] --ui-5 @GuillaumeRx
• [ ] --flask-purpl
• [ ] --white
• [ ] --black
• [ ] --orange
• [ ] --red
• [ ] --gray
• [ ] --dusty-gray
• [ ] --alto
• [x] --alabaster
• [ ] --silver-chalice
• [ ] --tundora
• [ ] --scorpion
• [x] --silver
• [ ] --monzo
• [x] --malibu-blue
• [x] --athens-grey
• [ ] --geyser
• [ ] --mid-gray
• [ ] --dodger-blue

COLORS object

• [x] UI1 @georgewrmarshall
• [x] UI2 @georgewrmarshall
• [x] UI3 @georgewrmarshall
• [x] UI4 @georgewrmarshall
• [x] GREY @georgewrmarshall
• [x] NEUTRAL_GREY @georgewrmarshall
• [x] WHITE @georgewrmarshall
• [x] PRIMARY1 @georgewrmarshall
• [x] PRIMARY2 @georgewrmarshall
• [x] PRIMARY3 @georgewrmarshall
• [x] SECONDARY1 @georgewrmarshall
• [x] SECONDARY2 @georgewrmarshall
• [x] SECONDARY3 @georgewrmarshall
• [x] SUCCESS1 @georgewrmarshall
• [x] SUCCESS2 @georgewrmarshall
• [x] SUCCESS3 @georgewrmarshall
• [x] ERROR1 @georgewrmarshall
• [x] ERROR2 @georgewrmarshall
• [x] ERROR3 @georgewrmarshall
• [x] ALERT1 @georgewrmarshall
• [x] ALERT2 @georgewrmarshall
• [x] ALERT3 @georgewrmarshall

[georgewrmarshall]

Apologies! I had no intention of closing this issue. I think it closed automatically when a PR related to this issue was merged?