Themes modal udpated
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
import { ActionIcon, Group, Stack, Tabs } from "@mantine/core";
|
||||
import tabClasses from '../../styles/Tabs.module.css';
|
||||
import { ActionIcon, Group, Stack, Tabs, Text } from "@mantine/core";
|
||||
import tabClasses from "../../styles/Tabs.module.css";
|
||||
import Personalization from "./components/Personalization";
|
||||
import { FiArrowLeftCircle } from "react-icons/fi";
|
||||
import { actionIconClasses } from "../../styles";
|
||||
import { actionIconClasses, textClasses } from "../../styles";
|
||||
import Messages from "./components/Messages";
|
||||
import Applications from "./components/Applications";
|
||||
import Bookmarks from "./components/Bookmarks";
|
||||
@@ -10,32 +10,60 @@ import Categories from "./components/Categories";
|
||||
import SearchProviders from "./components/SearchProviders";
|
||||
import Themes from "./components/Themes";
|
||||
|
||||
function Settings({theme}:any) {
|
||||
function Settings({ theme }: any) {
|
||||
return (
|
||||
<Stack h={'100vh'} px={'2rem'} bg={'var(--color-background)'}>
|
||||
<Group gap={0} >
|
||||
<ActionIcon className={actionIconClasses.backButton} classNames={actionIconClasses} component="a" href="/trigger"><FiArrowLeftCircle/></ActionIcon>
|
||||
<h1>Settings</h1>
|
||||
</Group>
|
||||
<Tabs orientation="vertical" defaultValue={'personalization'} className={tabClasses.settingsTabs} classNames={tabClasses}>
|
||||
<Tabs.List>
|
||||
<Tabs.Tab value="personalization">Personal Info</Tabs.Tab>
|
||||
<Tabs.Tab value="messages">Messages</Tabs.Tab>
|
||||
<Tabs.Tab value="applications">Applications</Tabs.Tab>
|
||||
<Tabs.Tab value="bookmarks">Bookmarks</Tabs.Tab>
|
||||
<Tabs.Tab value="bookmarksCategories">Categories</Tabs.Tab>
|
||||
<Tabs.Tab value="themes">Themes</Tabs.Tab>
|
||||
<Tabs.Tab value="providers">Search Providers</Tabs.Tab>
|
||||
</Tabs.List>
|
||||
<Tabs.Panel value="personalization"><Personalization/></Tabs.Panel>
|
||||
<Tabs.Panel value="messages"><Messages/></Tabs.Panel>
|
||||
<Tabs.Panel value="applications"><Applications/></Tabs.Panel>
|
||||
<Tabs.Panel value="bookmarks"><Bookmarks/></Tabs.Panel>
|
||||
<Tabs.Panel value="bookmarksCategories"><Categories/></Tabs.Panel>
|
||||
<Tabs.Panel value="themes"><Themes/></Tabs.Panel>
|
||||
<Tabs.Panel value="providers"><SearchProviders/></Tabs.Panel>
|
||||
</Tabs>
|
||||
</Stack>
|
||||
<Stack h={"100vh"} px={"2rem"} bg={"var(--color-background)"}>
|
||||
<Group gap={0}>
|
||||
<ActionIcon
|
||||
className={actionIconClasses.backButton}
|
||||
classNames={actionIconClasses}
|
||||
component="a"
|
||||
href="/trigger"
|
||||
>
|
||||
<FiArrowLeftCircle />
|
||||
</ActionIcon>
|
||||
<Text className={textClasses.settingsTitle} classNames={textClasses}>
|
||||
Settings
|
||||
</Text>
|
||||
</Group>
|
||||
<Tabs
|
||||
orientation="vertical"
|
||||
defaultValue={"personalization"}
|
||||
className={tabClasses.settingsTabs}
|
||||
classNames={tabClasses}
|
||||
>
|
||||
<Tabs.List>
|
||||
<Tabs.Tab value="personalization">Personal Info</Tabs.Tab>
|
||||
<Tabs.Tab value="messages">Messages</Tabs.Tab>
|
||||
<Tabs.Tab value="applications">Applications</Tabs.Tab>
|
||||
<Tabs.Tab value="bookmarks">Bookmarks</Tabs.Tab>
|
||||
<Tabs.Tab value="bookmarksCategories">Categories</Tabs.Tab>
|
||||
<Tabs.Tab value="themes">Themes</Tabs.Tab>
|
||||
<Tabs.Tab value="providers">Search Providers</Tabs.Tab>
|
||||
</Tabs.List>
|
||||
<Tabs.Panel value="personalization">
|
||||
<Personalization />
|
||||
</Tabs.Panel>
|
||||
<Tabs.Panel value="messages">
|
||||
<Messages />
|
||||
</Tabs.Panel>
|
||||
<Tabs.Panel value="applications">
|
||||
<Applications />
|
||||
</Tabs.Panel>
|
||||
<Tabs.Panel value="bookmarks">
|
||||
<Bookmarks />
|
||||
</Tabs.Panel>
|
||||
<Tabs.Panel value="bookmarksCategories">
|
||||
<Categories />
|
||||
</Tabs.Panel>
|
||||
<Tabs.Panel value="themes">
|
||||
<Themes theme={theme} />
|
||||
</Tabs.Panel>
|
||||
<Tabs.Panel value="providers">
|
||||
<SearchProviders />
|
||||
</Tabs.Panel>
|
||||
</Tabs>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
export default Settings;
|
||||
|
||||
Reference in New Issue
Block a user