[web] Use colors from themes.css in dropdown

Summary:
Some feedback in D8136 was to use colors from `themes.css` instead of inlining them in `SWMansionIcon`.

Depends on D8337

Test Plan: Confirmed that both enabled and disabled dropdowns still look the same

Reviewers: atul, ashoat

Reviewed By: atul

Subscribers: tomek, ted

Differential Revision: https://phab.comm.dev/D8338

web/components/dropdown.css

@@ -31,6 +31,7 @@
 .dropdownIcon {
   margin-left: auto;
   font-size: var(--m-font-16);
+  color: var(--dropdown-chevron-color);
 }
 
 .dropdownList {

web/components/dropdown.react.js

@@ -34,6 +34,11 @@ function Dropdown(props: DropdownProps): React.Node {
     [css.dropdownDisabled]: !!disabled,
   });
 
+  const dropdownIconClassNames = classNames({
+    [css.dropdownIcon]: true,
+    [css.dropdownDisabled]: !!disabled,
+  });
+
   const toggleMenu = React.useCallback(() => {
     if (disabled) {
       return;
@@ -89,10 +94,9 @@ function Dropdown(props: DropdownProps): React.Node {
       <div className={css.dropdownContainer} onClick={toggleMenu}>
         <div className={dropdownMenuClassNames}>
           <p className={dropdownTextClassNames}>{activeDisplayedOption}</p>
-          <div className={css.dropdownIcon}>
+          <div className={dropdownIconClassNames}>
             <SWMansionIcon
               icon={isOpen ? 'chevron-up' : 'chevron-down'}
-              color={disabled ? 'gray' : 'white'}
               size={18}
             />
           </div>

web/theme.css

@@ -232,6 +232,7 @@
   --dropdown-option-bg: var(--shades-black-80);
   --dropdown-option-hover-bg: var(--shades-black-70);
   --dropdown-selected-option-check-color: var(--violet-dark-100);
+  --dropdown-chevron-color: var(--shades-white-100);
   --dropdown-disabled-color: var(--shades-black-60);
   --change-member-role-modal-description-text: var(--shades-white-60);
   --change-member-role-modal-generic-text: var(--shades-white-100);