restore custom css setting (#1024)

This commit is contained in:
Athou
2023-05-05 14:03:28 +02:00
parent b8e254dab6
commit d095e4b35a
35 changed files with 384 additions and 20 deletions

View File

@@ -10,13 +10,13 @@ export function AddPage() {
<Container size="sm" px={0}>
<Tabs defaultValue="subscribe">
<Tabs.List>
<Tabs.Tab value="subscribe" icon={<TbRss />}>
<Tabs.Tab value="subscribe" icon={<TbRss size={16} />}>
<Trans>Subscribe</Trans>
</Tabs.Tab>
<Tabs.Tab value="category" icon={<TbFolderPlus />}>
<Tabs.Tab value="category" icon={<TbFolderPlus size={16} />}>
<Trans>Add category</Trans>
</Tabs.Tab>
<Tabs.Tab value="opml" icon={<TbFileImport />}>
<Tabs.Tab value="opml" icon={<TbFileImport size={16} />}>
<Trans>OPML</Trans>
</Tabs.Tab>
</Tabs.List>

View File

@@ -122,6 +122,7 @@ export default function Layout({ sidebar, header }: LayoutProps) {
classNames={{ main: classes.mainContentWrapper }}
navbar={
<Navbar
id="sidebar"
p={sidebarPadding}
hiddenBreakpoint={Constants.layout.mobileBreakpoint}
hidden={!mobileMenuOpen}
@@ -133,7 +134,7 @@ export default function Layout({ sidebar, header }: LayoutProps) {
</Navbar>
}
header={
<Header height={Constants.layout.headerHeight} p="md">
<Header id="header" height={Constants.layout.headerHeight} p="md">
<OnMobile>
{mobileMenuOpen && (
<Group position="apart">
@@ -171,7 +172,7 @@ export default function Layout({ sidebar, header }: LayoutProps) {
if (ref) ref.id = Constants.dom.mainScrollAreaId
}}
>
<Box className={classes.mainContent}>
<Box id="content" className={classes.mainContent}>
<Suspense fallback={<Loader />}>
<Outlet />
</Suspense>

View File

@@ -2,17 +2,21 @@ import { Trans } from "@lingui/macro"
import { Container, Tabs } from "@mantine/core"
import { DisplaySettings } from "components/settings/DisplaySettings"
import { ProfileSettings } from "components/settings/ProfileSettings"
import { TbPhoto, TbUser } from "react-icons/tb"
import { TbBoxMargin, TbPhoto, TbUser } from "react-icons/tb"
import { CustomCss } from "../../components/settings/CustomCss"
export function SettingsPage() {
return (
<Container size="sm" px={0}>
<Tabs defaultValue="display">
<Tabs.List>
<Tabs.Tab value="display" icon={<TbPhoto />}>
<Tabs.Tab value="display" icon={<TbPhoto size={16} />}>
<Trans>Display</Trans>
</Tabs.Tab>
<Tabs.Tab value="profile" icon={<TbUser />}>
<Tabs.Tab value="customCss" icon={<TbBoxMargin size={16} />}>
<Trans>Custom CSS</Trans>
</Tabs.Tab>
<Tabs.Tab value="profile" icon={<TbUser size={16} />}>
<Trans>Profile</Trans>
</Tabs.Tab>
</Tabs.List>
@@ -21,6 +25,10 @@ export function SettingsPage() {
<DisplaySettings />
</Tabs.Panel>
<Tabs.Panel value="customCss" pt="xl">
<CustomCss />
</Tabs.Panel>
<Tabs.Panel value="profile" pt="xl">
<ProfileSettings />
</Tabs.Panel>