Global tracking

This commit is contained in:
Eric Bailey
2024-09-17 14:38:37 -05:00
parent 3cd13753fb
commit 2419096e24
3 changed files with 54 additions and 52 deletions
+11 -14
View File
@@ -225,43 +225,43 @@ export const atoms = {
}, },
text_2xs: { text_2xs: {
fontSize: tokens.fontSize._2xs, fontSize: tokens.fontSize._2xs,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
text_xs: { text_xs: {
fontSize: tokens.fontSize.xs, fontSize: tokens.fontSize.xs,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
text_sm: { text_sm: {
fontSize: tokens.fontSize.sm, fontSize: tokens.fontSize.sm,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
text_md: { text_md: {
fontSize: tokens.fontSize.md, fontSize: tokens.fontSize.md,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
text_lg: { text_lg: {
fontSize: tokens.fontSize.lg, fontSize: tokens.fontSize.lg,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
text_xl: { text_xl: {
fontSize: tokens.fontSize.xl, fontSize: tokens.fontSize.xl,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
text_2xl: { text_2xl: {
fontSize: tokens.fontSize._2xl, fontSize: tokens.fontSize._2xl,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
text_3xl: { text_3xl: {
fontSize: tokens.fontSize._3xl, fontSize: tokens.fontSize._3xl,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
text_4xl: { text_4xl: {
fontSize: tokens.fontSize._4xl, fontSize: tokens.fontSize._4xl,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
text_5xl: { text_5xl: {
fontSize: tokens.fontSize._5xl, fontSize: tokens.fontSize._5xl,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
}, },
leading_tight: { leading_tight: {
lineHeight: 1.15, lineHeight: 1.15,
@@ -273,10 +273,7 @@ export const atoms = {
lineHeight: 1.5, lineHeight: 1.5,
}, },
tracking_normal: { tracking_normal: {
letterSpacing: 0, letterSpacing: tokens.TRACKING,
},
tracking_wide: {
letterSpacing: 0.25,
}, },
font_normal: { font_normal: {
fontWeight: tokens.fontWeight.normal, fontWeight: tokens.fontWeight.normal,
+4
View File
@@ -1,3 +1,7 @@
import {Platform} from 'react-native'
export const TRACKING = Platform.OS === 'android' ? 0.1 : 0
export const color = { export const color = {
temp_purple: 'rgb(105 0 255)', temp_purple: 'rgb(105 0 255)',
temp_purple_dark: 'rgb(83 0 202)', temp_purple_dark: 'rgb(83 0 202)',
+39 -38
View File
@@ -1,5 +1,6 @@
import {Platform} from 'react-native' import {Platform} from 'react-native'
import {tokens} from '#/alf'
import {darkPalette, dimPalette, lightPalette} from '#/alf/themes' import {darkPalette, dimPalette, lightPalette} from '#/alf/themes'
import {colors} from './styles' import {colors} from './styles'
import type {Theme} from './ThemeContext' import type {Theme} from './ThemeContext'
@@ -88,163 +89,163 @@ export const defaultTheme: Theme = {
typography: { typography: {
'2xl-thin': { '2xl-thin': {
fontSize: 18, fontSize: 18,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '300', fontWeight: '300',
}, },
'2xl': { '2xl': {
fontSize: 18, fontSize: 18,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '400', fontWeight: '400',
}, },
'2xl-medium': { '2xl-medium': {
fontSize: 18, fontSize: 18,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '500', fontWeight: '500',
}, },
'2xl-bold': { '2xl-bold': {
fontSize: 18, fontSize: 18,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '700', fontWeight: '700',
}, },
'2xl-heavy': { '2xl-heavy': {
fontSize: 18, fontSize: 18,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '800', fontWeight: '800',
}, },
'xl-thin': { 'xl-thin': {
fontSize: 17, fontSize: 17,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '300', fontWeight: '300',
}, },
xl: { xl: {
fontSize: 17, fontSize: 17,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '400', fontWeight: '400',
}, },
'xl-medium': { 'xl-medium': {
fontSize: 17, fontSize: 17,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '500', fontWeight: '500',
}, },
'xl-bold': { 'xl-bold': {
fontSize: 17, fontSize: 17,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '700', fontWeight: '700',
}, },
'xl-heavy': { 'xl-heavy': {
fontSize: 17, fontSize: 17,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '800', fontWeight: '800',
}, },
'lg-thin': { 'lg-thin': {
fontSize: 16, fontSize: 16,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '300', fontWeight: '300',
}, },
lg: { lg: {
fontSize: 16, fontSize: 16,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '400', fontWeight: '400',
}, },
'lg-medium': { 'lg-medium': {
fontSize: 16, fontSize: 16,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '500', fontWeight: '500',
}, },
'lg-bold': { 'lg-bold': {
fontSize: 16, fontSize: 16,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '700', fontWeight: '700',
}, },
'lg-heavy': { 'lg-heavy': {
fontSize: 16, fontSize: 16,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '800', fontWeight: '800',
}, },
'md-thin': { 'md-thin': {
fontSize: 15, fontSize: 15,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '300', fontWeight: '300',
}, },
md: { md: {
fontSize: 15, fontSize: 15,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '400', fontWeight: '400',
}, },
'md-medium': { 'md-medium': {
fontSize: 15, fontSize: 15,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '500', fontWeight: '500',
}, },
'md-bold': { 'md-bold': {
fontSize: 15, fontSize: 15,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '700', fontWeight: '700',
}, },
'md-heavy': { 'md-heavy': {
fontSize: 15, fontSize: 15,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '800', fontWeight: '800',
}, },
'sm-thin': { 'sm-thin': {
fontSize: 14, fontSize: 14,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '300', fontWeight: '300',
}, },
sm: { sm: {
fontSize: 14, fontSize: 14,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '400', fontWeight: '400',
}, },
'sm-medium': { 'sm-medium': {
fontSize: 14, fontSize: 14,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '500', fontWeight: '500',
}, },
'sm-bold': { 'sm-bold': {
fontSize: 14, fontSize: 14,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '700', fontWeight: '700',
}, },
'sm-heavy': { 'sm-heavy': {
fontSize: 14, fontSize: 14,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '800', fontWeight: '800',
}, },
'xs-thin': { 'xs-thin': {
fontSize: 13, fontSize: 13,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '300', fontWeight: '300',
}, },
xs: { xs: {
fontSize: 13, fontSize: 13,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '400', fontWeight: '400',
}, },
'xs-medium': { 'xs-medium': {
fontSize: 13, fontSize: 13,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '500', fontWeight: '500',
}, },
'xs-bold': { 'xs-bold': {
fontSize: 13, fontSize: 13,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '700', fontWeight: '700',
}, },
'xs-heavy': { 'xs-heavy': {
fontSize: 13, fontSize: 13,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '800', fontWeight: '800',
}, },
'title-2xl': { 'title-2xl': {
fontSize: 34, fontSize: 34,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '500', fontWeight: '500',
}, },
'title-xl': { 'title-xl': {
fontSize: 28, fontSize: 28,
letterSpacing: 0.25, letterSpacing: tokens.TRACKING,
fontWeight: '500', fontWeight: '500',
}, },
'title-lg': { 'title-lg': {
@@ -254,32 +255,32 @@ export const defaultTheme: Theme = {
title: { title: {
fontWeight: '500', fontWeight: '500',
fontSize: 20, fontSize: 20,
letterSpacing: 0.15, letterSpacing: tokens.TRACKING,
}, },
'title-sm': { 'title-sm': {
fontWeight: 'bold', fontWeight: 'bold',
fontSize: 17, fontSize: 17,
letterSpacing: 0.15, letterSpacing: tokens.TRACKING,
}, },
'post-text': { 'post-text': {
fontSize: 16, fontSize: 16,
letterSpacing: 0.2, letterSpacing: tokens.TRACKING,
fontWeight: '400', fontWeight: '400',
}, },
'post-text-lg': { 'post-text-lg': {
fontSize: 20, fontSize: 20,
letterSpacing: 0.2, letterSpacing: tokens.TRACKING,
fontWeight: '400', fontWeight: '400',
}, },
'button-lg': { 'button-lg': {
fontWeight: '500', fontWeight: '500',
fontSize: 18, fontSize: 18,
letterSpacing: 0.5, letterSpacing: tokens.TRACKING,
}, },
button: { button: {
fontWeight: '500', fontWeight: '500',
fontSize: 14, fontSize: 14,
letterSpacing: 0.5, letterSpacing: tokens.TRACKING,
}, },
mono: { mono: {
fontSize: 14, fontSize: 14,