gib/tech-tracker-expo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Clean up login page

Browse Source
This commit is contained in:
Gabriel Brown
2025-03-10 15:18:50 -05:00
parent f9fd5dafc5
commit 6e41fd3ddf
9 changed files with 817 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
components/theme/buttons/ThemedButton.tsx
View File

@ -1,5 +1,5 @@
import React from 'react';
import { StyleSheet, Pressable, PressableProps } from 'react-native';
import { StyleSheet, Pressable, PressableProps, DimensionValue } from 'react-native';
import ThemedView from '@/components/theme/default/ThemedView';
import { Colors } from '@/constants/Colors';
import { useColorScheme } from '@/hooks/useColorScheme';
@ -8,8 +8,8 @@ const DEFAULT_WIDTH = 320;
const DEFAULT_HEIGHT = 68;
type ThemedButtonProps = PressableProps & {
width?: number;
height?: number;
width?: DimensionValue;
height?: DimensionValue;
containerStyle?: object;
buttonStyle?: object;
};

17
components/theme/buttons/ThemedTextButton.tsx
View File

@ -1,18 +1,17 @@
import React from 'react';
import { TextStyle, PressableProps } from 'react-native';
import { TextStyle, PressableProps, DimensionValue } from 'react-native';
import ThemedButton from '@/components/theme/buttons/ThemedButton';
import ThemedText from '@/components/theme/default/ThemedText';
import { Colors } from '@/constants/Colors';
import { useColorScheme } from '@/hooks/useColorScheme';
const DEFAULT_FONT_SIZE = 16;
// Extend ThemedButton props (which already extends PressableProps)
type ThemedTextButtonProps = Omit<PressableProps, 'children'> & {
width?: number;
height?: number;
width?: DimensionValue;
height?: DimensionValue;
text: string;
fontSize?: number;
fontWeight?: 'normal' | 'semibold' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
textStyle?: TextStyle;
containerStyle?: object;
buttonStyle?: object;
@ -22,13 +21,15 @@ const ThemedTextButton: React.FC<ThemedTextButtonProps> = ({
width,
height,
text,
fontSize,
fontSize = 16,
fontWeight = 'normal',
textStyle,
containerStyle,
buttonStyle,
...restProps // This includes onPress and all other Pressable props
}) => {
const scheme = useColorScheme() ?? 'dark';
if (fontWeight === 'semibold') fontWeight = '600';
return (
<ThemedButton
@ -42,7 +43,9 @@ const ThemedTextButton: React.FC<ThemedTextButtonProps> = ({
style={[
{
color: Colors[scheme].background,
fontSize: fontSize ?? DEFAULT_FONT_SIZE,
fontSize,
lineHeight: fontSize * 1.5,
fontWeight,
},
textStyle,
]}

10
components/theme/default/ThemedText.tsx
View File

@ -7,23 +7,29 @@ export type ThemedViewProps = ViewProps & {
darkColor?: string;
};
export type ThemedTextProps = TextProps & {
fontSize?: number;
fontWeight?: 'normal' | 'semibold' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
lightColor?: string;
darkColor?: string;
type?: 'default' | 'title' | 'defaultSemiBold' | 'subtitle' | 'link';
type?: 'custom' | 'default' | 'title' | 'defaultSemiBold' | 'subtitle' | 'link';
};
const ThemedText = ({
fontSize = 16,
fontWeight = 'normal',
style,
lightColor,
darkColor,
type = 'default',
type='default',
...rest
}: ThemedTextProps) => {
const color = useThemeColor({ light: lightColor, dark: darkColor }, 'text');
if (fontWeight === 'semibold') fontWeight = '600';
return (
<Text
style={[
{ color },
type === 'custom' ? { fontSize, lineHeight: fontSize * 1.5, fontWeight } : undefined,
type === 'default' ? styles.default : undefined,
type === 'title' ? styles.title : undefined,
type === 'defaultSemiBold' ? styles.defaultSemiBold : undefined,