Selectable dropdown list

website/src/ui/style.js

@@ -26,6 +26,11 @@ let colorInfo = {
   checkboxUnchecked: '#A0A0A0',
   checkboxUncheckedHover: '#808080',
   checkmark: '#FFFFFF',
+
+  listBackground: '#FFFFFF',
+  listBackgroundActive: '#E7E5E5',
+
+  dropdownBackground: '#FFFFFF',
 }
 
 Object.assign(colorInfo, {
@@ -34,10 +39,10 @@ Object.assign(colorInfo, {
   panelButtonBackgroundActive: colorInfo.headerButtonBackgroundActive,
   panelDisabledButtonBackground: colorInfo.buttonDisabledBackground,
 
-  listBackground: '#FFFFFF',
   listBackgroundHover: colorInfo.headerButtonBackgroundHover,
-  listBackgroundActive: '#E7E5E5',
   listBorder: colorInfo.headerBorder,
+
+  dropdownBorder: colorInfo.headerBorder,
 })
 
 const sizeInfo = {
@@ -80,6 +85,11 @@ const sizeInfo = {
   listIcon: 25,
   listIconMargin: '5px 10px 5px 10px',
 
+  dropDownIconSize: 20,
+  dropdownIconMargin: 5,
+  dropdownItems: 6,
+  dropdownBorderWidth: 1,
+
   modalWidth: 450,
   modalShadowWidth: 25,
   modalMessageIcon: 150,