Dark mode toggle in settings

crabfit-frontend/src/components/Settings/Settings.tsx

@@ -49,6 +49,15 @@ const Settings = () => {
           value={store.timeFormat}
           onChange={value => store.setTimeFormat(value)}
         />
+
+        <ToggleField
+          label="Theme"
+          name="theme"
+          id="theme"
+          options={['System', 'Light', 'Dark']}
+          value={store.theme}
+          onChange={value => store.setTheme(value)}
+        />
       </Modal>
     </>
   );

crabfit-frontend/src/components/Settings/settingsStyle.ts

@@ -50,7 +50,9 @@ export const Modal = styled.div`
   top: 70px;
   right: 12px;
   background-color: ${props => props.theme.background};
-  border: 1px solid ${props => props.theme.primaryBackground};
+  ${props => props.theme.mode === 'dark' && `
+    border: 1px solid ${props.theme.primaryBackground};
+  `}
   z-index: 150;
   padding: 10px 18px;
   border-radius: 3px;