feat: add column element

This commit is contained in:
Paul Makles
2022-05-30 16:15:52 +01:00
parent 906f15f103
commit 81bf325990
7 changed files with 140 additions and 122 deletions

View File

@@ -3,7 +3,7 @@ import { observer } from "mobx-react-lite";
import styles from "./Panes.module.scss";
import { Text } from "preact-i18n";
import { Checkbox } from "@revoltchat/ui";
import { Checkbox, Column } from "@revoltchat/ui";
import { useApplicationState } from "../../../mobx/State";
import { SyncKeys } from "../../../mobx/stores/Sync";
@@ -20,26 +20,28 @@ export const Sync = observer(() => {
<h3>
<Text id="app.settings.pages.sync.categories" />
</h3>
{(
[
["appearance", "appearance.title"],
["theme", "appearance.theme"],
["locale", "language.title"],
// notifications sync is always-on
] as [SyncKeys, string][]
).map(([key, title]) => (
<Checkbox
key={key}
value={sync.isEnabled(key)}
title={<Text id={`app.settings.pages.${title}`} />}
description={
<Text
id={`app.settings.pages.sync.descriptions.${key}`}
/>
}
onChange={() => sync.toggle(key)}
/>
))}
<Column>
{(
[
["appearance", "appearance.title"],
["theme", "appearance.theme"],
["locale", "language.title"],
// notifications sync is always-on
] as [SyncKeys, string][]
).map(([key, title]) => (
<Checkbox
key={key}
value={sync.isEnabled(key)}
title={<Text id={`app.settings.pages.${title}`} />}
description={
<Text
id={`app.settings.pages.sync.descriptions.${key}`}
/>
}
onChange={() => sync.toggle(key)}
/>
))}
</Column>
{/*<h5 style={{ marginTop: "20px", color: "grey" }}>
Last sync at 12:00
</h5>*/}