octo/tooot
1
0
Fork 0
mirror of https://github.com/tooot-app/app synced 2025-06-05 22:19:13 +02:00
Code Issues Projects Releases Wiki Activity

Using new text component

Browse Source 
Need to use global accessibility checks rather than per text component which is not efficient
This commit is contained in:
Zhiyuan Zheng
2022-05-07 00:52:32 +02:00
parent 8caf315894
commit 7c48c61c99
60 changed files with 1302 additions and 1494 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/screens/Compose/Root/Header/PostingAs.tsx
View File

@ -1,12 +1,11 @@
import CustomText from '@components/Text'
import {
getInstanceAccount,
getInstanceUri
} from '@utils/slices/instancesSlice'
import { StyleConstants } from '@utils/styles/constants'
import { useTheme } from '@utils/styles/ThemeManager'
import React from 'react'
import { useTranslation } from 'react-i18next'
import { StyleSheet, Text } from 'react-native'
import { useSelector } from 'react-redux'
const ComposePostingAs = React.memo(
@ -21,21 +20,15 @@ const ComposePostingAs = React.memo(
const instanceUri = useSelector(getInstanceUri)
return (
<Text style={[styles.text, { color: colors.secondary }]}>
<CustomText fontStyle='S' style={{ color: colors.secondary }}>
{t('content.root.header.postingAs', {
acct: instanceAccount?.acct,
domain: instanceUri
})}
</Text>
</CustomText>
)
},
() => true
)
const styles = StyleSheet.create({
text: {
...StyleConstants.FontStyle.S
}
})
export default ComposePostingAs

35
src/screens/Compose/Root/Header/SpoilerInput.tsx
View File

@ -1,8 +1,9 @@
import CustomText from '@components/Text'
import { StyleConstants } from '@utils/styles/constants'
import { useTheme } from '@utils/styles/ThemeManager'
import React, { useContext, useEffect, useState } from 'react'
import React, { useContext } from 'react'
import { useTranslation } from 'react-i18next'
import { StyleSheet, Text, TextInput } from 'react-native'
import { TextInput } from 'react-native'
import formatText from '../../formatText'
import ComposeContext from '../../utils/createContext'
@ -14,13 +15,16 @@ const ComposeSpoilerInput: React.FC = () => {
return (
<TextInput
keyboardAppearance={mode}
style={[
styles.spoilerInput,
{
color: colors.primaryDefault,
borderBottomColor: colors.border
}
]}
style={{
...StyleConstants.FontStyle.M,
marginTop: StyleConstants.Spacing.S,
paddingBottom: StyleConstants.Spacing.M,
marginLeft: StyleConstants.Spacing.Global.PagePadding,
marginRight: StyleConstants.Spacing.Global.PagePadding,
borderBottomWidth: 0.5,
color: colors.primaryDefault,
borderBottomColor: colors.border
}}
autoCapitalize='none'
autoCorrect={false}
autoFocus
@ -53,20 +57,9 @@ const ComposeSpoilerInput: React.FC = () => {
})
}
>
<Text>{composeState.spoiler.formatted}</Text>
<CustomText>{composeState.spoiler.formatted}</CustomText>
</TextInput>
)
}
const styles = StyleSheet.create({
spoilerInput: {
...StyleConstants.FontStyle.M,
marginTop: StyleConstants.Spacing.S,
paddingBottom: StyleConstants.Spacing.M,
marginLeft: StyleConstants.Spacing.Global.PagePadding,
marginRight: StyleConstants.Spacing.Global.PagePadding,
borderBottomWidth: 0.5
}
})
export default ComposeSpoilerInput

31
src/screens/Compose/Root/Header/TextInput.tsx
View File

@ -1,8 +1,9 @@
import CustomText from '@components/Text'
import { StyleConstants } from '@utils/styles/constants'
import { useTheme } from '@utils/styles/ThemeManager'
import React, { useContext } from 'react'
import { useTranslation } from 'react-i18next'
import { StyleSheet, Text, TextInput } from 'react-native'
import { TextInput } from 'react-native'
import formatText from '../../formatText'
import ComposeContext from '../../utils/createContext'
@ -14,13 +15,15 @@ const ComposeTextInput: React.FC = () => {
return (
<TextInput
keyboardAppearance={mode}
style={[
styles.textInput,
{
color: colors.primaryDefault,
borderBottomColor: colors.border
}
]}
style={{
...StyleConstants.FontStyle.M,
marginTop: StyleConstants.Spacing.S,
paddingBottom: StyleConstants.Spacing.M,
marginLeft: StyleConstants.Spacing.Global.PagePadding,
marginRight: StyleConstants.Spacing.Global.PagePadding,
color: colors.primaryDefault,
borderBottomColor: colors.border
}}
autoFocus
enablesReturnKeyAutomatically
multiline
@ -52,19 +55,9 @@ const ComposeTextInput: React.FC = () => {
ref={composeState.textInputFocus.refs.text}
scrollEnabled={false}
>
<Text>{composeState.text.formatted}</Text>
<CustomText>{composeState.text.formatted}</CustomText>
</TextInput>
)
}
const styles = StyleSheet.create({
textInput: {
...StyleConstants.FontStyle.M,
marginTop: StyleConstants.Spacing.S,
paddingBottom: StyleConstants.Spacing.M,
marginLeft: StyleConstants.Spacing.Global.PagePadding,
marginRight: StyleConstants.Spacing.Global.PagePadding
}
})
export default ComposeTextInput