update header

This commit is contained in:
Hongbo Wu 2024-03-13 19:10:11 +08:00
parent 1fb81eaa2b
commit 53cc193bd1
3 changed files with 30 additions and 37 deletions

View file

@ -1,27 +1,18 @@
import { useCallback, useMemo, useState } from 'react'
import { styled } from '@stitches/react'
import Image from 'next/image'
import { Box, HStack, SpanBox, VStack } from '../../elements/LayoutPrimitives'
import { Button } from '../../elements/Button'
import { StyledText } from '../../elements/StyledText'
import { FormInput } from '../../elements/FormElements'
import { useRouter } from 'next/router'
import { useCallback, useMemo, useState } from 'react'
import { deleteIntegrationMutation } from '../../../lib/networking/mutations/deleteIntegrationMutation'
import { setIntegrationMutation } from '../../../lib/networking/mutations/setIntegrationMutation'
import {
Integration,
useGetIntegrationsQuery,
} from '../../../lib/networking/queries/useGetIntegrationsQuery'
import { useRouter } from 'next/router'
import { showErrorToast, showSuccessToast } from '../../../lib/toastHelpers'
import { deleteIntegrationMutation } from '../../../lib/networking/mutations/deleteIntegrationMutation'
// Styles
const Header = styled(Box, {
color: '$utilityTextDefault',
fontSize: 'x-large',
margin: '20px',
})
import { Button } from '../../elements/Button'
import { FormInput } from '../../elements/FormElements'
import { HStack, SpanBox, VStack } from '../../elements/LayoutPrimitives'
import { StyledText } from '../../elements/StyledText'
import { Header } from '../settings/SettingsTable'
export function Readwise(): JSX.Element {
const { integrations, revalidate } = useGetIntegrationsQuery()

View file

@ -6,11 +6,18 @@ import { MoreOptionsIcon } from '../../elements/images/MoreOptionsIcon'
import { InfoLink } from '../../elements/InfoLink'
import { Box, HStack, SpanBox, VStack } from '../../elements/LayoutPrimitives'
import { StyledText } from '../../elements/StyledText'
import { theme } from '../../tokens/stitches.config'
import { styled, theme } from '../../tokens/stitches.config'
import { SettingsLayout } from '../SettingsLayout'
import { usePersistedState } from '../../../lib/hooks/usePersistedState'
import { FeatureHelpBox } from '../../elements/FeatureHelpBox'
// Styles
export const Header = styled(Box, {
color: '$utilityTextDefault',
fontSize: 'x-large',
margin: '20px',
})
type SettingsTableProps = {
pageId: string
pageInfoLink?: string | undefined

View file

@ -1,4 +1,3 @@
import { styled } from '@stitches/react'
import {
Button,
Checkbox,
@ -14,13 +13,10 @@ import { CheckboxValueType } from 'antd/lib/checkbox/Group'
import Image from 'next/image'
import { useRouter } from 'next/router'
import { useMemo } from 'react'
import {
Box,
HStack,
VStack,
} from '../../../components/elements/LayoutPrimitives'
import { HStack, VStack } from '../../../components/elements/LayoutPrimitives'
import { PageMetaData } from '../../../components/patterns/PageMetaData'
import { Beta } from '../../../components/templates/Beta'
import { Header } from '../../../components/templates/settings/SettingsTable'
import { SettingsLayout } from '../../../components/templates/SettingsLayout'
import { deleteIntegrationMutation } from '../../../lib/networking/mutations/deleteIntegrationMutation'
import { setIntegrationMutation } from '../../../lib/networking/mutations/setIntegrationMutation'
@ -43,13 +39,6 @@ type FieldType = {
properties?: string[]
}
// Styles
const Header = styled(Box, {
color: '$utilityTextDefault',
fontSize: 'x-large',
margin: '20px 20px 40px 40px',
})
export default function Notion(): JSX.Element {
applyStoredTheme()
@ -138,11 +127,18 @@ export default function Notion(): JSX.Element {
<SettingsLayout>
<VStack
css={{
margin: 'auto',
margin: '0 auto',
width: '80%',
}}
>
<HStack>
<HStack
css={{
width: '100%',
pb: '$2',
borderBottom: '1px solid $utilityTextDefault',
pr: '$1',
}}
>
<Image
src="/static/icons/notion.png"
alt="Integration Image"
@ -154,12 +150,11 @@ export default function Notion(): JSX.Element {
</HStack>
{notion && (
<div style={{ width: '100%' }}>
<div style={{ width: '100%', marginTop: '40px' }}>
<Form
labelCol={{ span: 4 }}
wrapperCol={{ span: 6 }}
labelCol={{ span: 6 }}
wrapperCol={{ span: 8 }}
labelAlign="left"
style={{ width: '100%' }}
form={form}
fields={fields}
onFinish={onFinish}