Style updates

src/pages/settings/components/Theming/Themes.tsx

@@ -4,6 +4,7 @@ import { useCommonHooks, useMutationAPI, useQueryAPI } from 'hooks';
 import { useEffect, useState } from 'react';
 import { FaDice } from 'react-icons/fa';
 import { FiChevronRight } from 'react-icons/fi';
+import { switchClasses } from 'styles';
 import type { Theme } from 'types';
 import SettingsHeader from '../Shared/SettingsHeader';
 import ThemeCard from './ThemeCard';
@@ -81,12 +82,13 @@ function ThemesSettings() {
 				title={'Themes'}
 				tooltip={{
 					title: 'Themes can be created here and applied to the homepage.',
-					highlightList: ['Clients', 'homepage'],
+					highlightList: ['theme', 'themes', 'homepage', 'playlist'],
 					description:
 						'Themes are combinations of 5 colors and a background image, and can be added to a playlist. If a theme has been disabled, it will only be disabled with random/shuffle is enabled. If a theme is part of a playlist, it will appear while the playlist is active, regardless of random/shuffle.',
 				}}
 				searchValue={searchValue}
 				setSearchValue={setSearchValue}
+				searchPlaceholder={'Search Themes...'}
 			/>
 			<Switch
 				label={
@@ -105,7 +107,8 @@ function ThemesSettings() {
 					setCurrentTheme(e.target.checked ? 'random' : theme.name);
 					setCurrentThemePlaylist('All');
 				}}
-				color={theme.primaryColor}
+				className={switchClasses.default}
+				classNames={switchClasses}
 				style={{
 					zIndex: 250,
 				}}