An ATproto social media client -- with an independent Appview.
1import {type StyleProp, type TextStyle, type ViewStyle} from 'react-native'
2
3export type TextStyleProp = {
4 style?: StyleProp<TextStyle>
5}
6
7export type ViewStyleProp = {
8 style?: StyleProp<ViewStyle>
9}
10
11export type ThemeName = 'light' | 'dim' | 'dark'
12export type Palette = {
13 white: string
14 black: string
15 like: string
16
17 contrast_25: string
18 contrast_50: string
19 contrast_100: string
20 contrast_200: string
21 contrast_300: string
22 contrast_400: string
23 contrast_500: string
24 contrast_600: string
25 contrast_700: string
26 contrast_800: string
27 contrast_900: string
28 contrast_950: string
29 contrast_975: string
30
31 primary_25: string
32 primary_50: string
33 primary_100: string
34 primary_200: string
35 primary_300: string
36 primary_400: string
37 primary_500: string
38 primary_600: string
39 primary_700: string
40 primary_800: string
41 primary_900: string
42 primary_950: string
43 primary_975: string
44
45 positive_25: string
46 positive_50: string
47 positive_100: string
48 positive_200: string
49 positive_300: string
50 positive_400: string
51 positive_500: string
52 positive_600: string
53 positive_700: string
54 positive_800: string
55 positive_900: string
56 positive_950: string
57 positive_975: string
58
59 negative_25: string
60 negative_50: string
61 negative_100: string
62 negative_200: string
63 negative_300: string
64 negative_400: string
65 negative_500: string
66 negative_600: string
67 negative_700: string
68 negative_800: string
69 negative_900: string
70 negative_950: string
71 negative_975: string
72}
73export type ThemedAtoms = {
74 text: {
75 color: string
76 }
77 text_contrast_low: {
78 color: string
79 }
80 text_contrast_medium: {
81 color: string
82 }
83 text_contrast_high: {
84 color: string
85 }
86 text_inverted: {
87 color: string
88 }
89 bg: {
90 backgroundColor: string
91 }
92 bg_contrast_25: {
93 backgroundColor: string
94 }
95 bg_contrast_50: {
96 backgroundColor: string
97 }
98 bg_contrast_100: {
99 backgroundColor: string
100 }
101 bg_contrast_200: {
102 backgroundColor: string
103 }
104 bg_contrast_300: {
105 backgroundColor: string
106 }
107 bg_contrast_400: {
108 backgroundColor: string
109 }
110 bg_contrast_500: {
111 backgroundColor: string
112 }
113 bg_contrast_600: {
114 backgroundColor: string
115 }
116 bg_contrast_700: {
117 backgroundColor: string
118 }
119 bg_contrast_800: {
120 backgroundColor: string
121 }
122 bg_contrast_900: {
123 backgroundColor: string
124 }
125 bg_contrast_950: {
126 backgroundColor: string
127 }
128 bg_contrast_975: {
129 backgroundColor: string
130 }
131 border_contrast_low: {
132 borderColor: string
133 }
134 border_contrast_medium: {
135 borderColor: string
136 }
137 border_contrast_high: {
138 borderColor: string
139 }
140 shadow_sm: {
141 shadowRadius: number
142 shadowOpacity: number
143 elevation: number
144 shadowColor: string
145 }
146 shadow_md: {
147 shadowRadius: number
148 shadowOpacity: number
149 elevation: number
150 shadowColor: string
151 }
152 shadow_lg: {
153 shadowRadius: number
154 shadowOpacity: number
155 elevation: number
156 shadowColor: string
157 }
158 trending_hot: {
159 color: string
160 backgroundColor: string
161 }
162 trending_new: {
163 color: string
164 backgroundColor: string
165 }
166}
167export type Theme = {
168 scheme: 'light' | 'dark' // for library support
169 name: ThemeName
170 palette: Palette
171 atoms: ThemedAtoms
172}