Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2025-12-22 22:49:45 +01:00
Code Issues Packages Projects Releases Wiki Activity

uniform sizes

Browse Source
This commit is contained in:
ammarahm-ed
2021-12-16 10:20:34 +05:00
parent 10b87a7b2f
commit a663023be2
17 changed files with 45 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/mobile/src/components/ActionSheetComponent/index.js
View File

@@ -691,7 +691,7 @@ export const ActionSheetComponent = ({
/> />
</PressableButton> </PressableButton>
<Paragraph size={SIZE.xs + 2} style={{textAlign: 'center'}}> <Paragraph size={SIZE.xs + 1} style={{textAlign: 'center'}}>
{rowItem.title} {rowItem.title}
</Paragraph> </Paragraph>
</View> </View>
@@ -933,7 +933,7 @@ export const ActionSheetComponent = ({
<Icon <Icon
name="shield-key-outline" name="shield-key-outline"
color={colors.accent} color={colors.accent}
size={SIZE.sm + SIZE.xs + 2} size={SIZE.sm + SIZE.xs + 1}
/> />
<View <View

2
apps/mobile/src/components/Announcements/cta.js
View File

@@ -82,7 +82,7 @@ export const Cta = ({actions, style = {}, color, inline}) => {
<Button <Button
key={item.title} key={item.title}
title={item.title} title={item.title}
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
type="gray" type="gray"
onPress={() => onPress(item)} onPress={() => onPress(item)}
width={null} width={null}

2
apps/mobile/src/components/Header/title.js
View File

@@ -70,7 +70,7 @@ export const Title = ({heading, headerColor, screen, notebook}) => {
}} }}
color={headerColor}> color={headerColor}>
{notebook ? ( {notebook ? (
<Paragraph numberOfLines={1} size={SIZE.xs + 2}> <Paragraph numberOfLines={1} size={SIZE.xs + 1}>
{notebook?.title} {notebook?.title}
{'\n'} {'\n'}
</Paragraph> </Paragraph>

12
apps/mobile/src/components/MergeEditor/index.js
View File

@@ -342,7 +342,7 @@ const MergeEditor = () => {
borderRadius: 100, borderRadius: 100,
paddingHorizontal: 12 paddingHorizontal: 12
}} }}
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
/> />
) : null} ) : null}
<View style={{width: 10}} /> <View style={{width: 10}} />
@@ -356,7 +356,7 @@ const MergeEditor = () => {
borderRadius: 100, borderRadius: 100,
paddingHorizontal: 12 paddingHorizontal: 12
}} }}
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
accentText="light" accentText="light"
color={colors.errorText} color={colors.errorText}
onPress={onPressDiscardFromPrimaryWebView} onPress={onPressDiscardFromPrimaryWebView}
@@ -387,7 +387,7 @@ const MergeEditor = () => {
marginLeft: 10 marginLeft: 10
}} }}
type="accent" type="accent"
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
title={keepContentFrom === 'primary' ? 'Undo' : 'Keep'} title={keepContentFrom === 'primary' ? 'Undo' : 'Keep'}
onPress={onPressKeepFromPrimaryWebView} onPress={onPressKeepFromPrimaryWebView}
/> />
@@ -473,7 +473,7 @@ const MergeEditor = () => {
minWidth: 60 minWidth: 60
}} }}
type="accent" type="accent"
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
onPress={onPressSaveCopyFromSecondaryWebView} onPress={onPressSaveCopyFromSecondaryWebView}
title="Save a copy" title="Save a copy"
/> />
@@ -489,7 +489,7 @@ const MergeEditor = () => {
paddingHorizontal: 12, paddingHorizontal: 12,
minWidth: 60 minWidth: 60
}} }}
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
accentColor="red" accentColor="red"
accentText="light" accentText="light"
onPress={onPressDiscardFromSecondaryWebView} onPress={onPressDiscardFromSecondaryWebView}
@@ -520,7 +520,7 @@ const MergeEditor = () => {
marginLeft: 10 marginLeft: 10
}} }}
type="accent" type="accent"
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
title={keepContentFrom === 'secondary' ? 'Undo' : 'Keep'} title={keepContentFrom === 'secondary' ? 'Undo' : 'Keep'}
onPress={onPressKeepFromSecondaryWebView} onPress={onPressKeepFromSecondaryWebView}
/> />

2
apps/mobile/src/components/MoveNoteDialog/index.js
View File

@@ -465,7 +465,7 @@ const MoveNoteComponent = ({close, note, setNote}) => {
title="Remove" title="Remove"
type="error" type="error"
height={25} height={25}
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
style={{ style={{
margin: 1, margin: 1,
marginRight: 5, marginRight: 5,

8
apps/mobile/src/components/NoteItem/index.js
View File

@@ -122,7 +122,7 @@ const NoteItem = ({item, isTrash, tags}) => {
height={20} height={20}
icon="book-outline" icon="book-outline"
type="grayBg" type="grayBg"
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
iconSize={SIZE.sm} iconSize={SIZE.sm}
textStyle={{ textStyle={{
marginRight: 0 marginRight: 0
@@ -183,7 +183,7 @@ const NoteItem = ({item, isTrash, tags}) => {
) : null} ) : null}
<TimeSince <TimeSince
style={{ style={{
fontSize: SIZE.xs + 1, fontSize: SIZE.xs,
color: colors.icon, color: colors.icon,
marginRight: 6 marginRight: 6
}} }}
@@ -201,7 +201,7 @@ const NoteItem = ({item, isTrash, tags}) => {
marginRight: 6 marginRight: 6
}}> }}>
<Icon name="attachment" size={SIZE.md} color={colors.icon} /> <Icon name="attachment" size={SIZE.md} color={colors.icon} />
<Paragraph color={colors.icon} size={SIZE.xs + 1}> <Paragraph color={colors.icon} size={SIZE.xs}>
10 10
</Paragraph> </Paragraph>
</View> </View>
@@ -254,7 +254,7 @@ const NoteItem = ({item, isTrash, tags}) => {
textDecorationLine: 'underline' textDecorationLine: 'underline'
}} }}
hitSlop={{top: 8, bottom: 12, left: 0, right: 0}} hitSlop={{top: 8, bottom: 12, left: 0, right: 0}}
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
style={{ style={{
borderRadius: 5, borderRadius: 5,
paddingHorizontal: 2, paddingHorizontal: 2,

12
apps/mobile/src/components/NotebookItem/index.js
View File

@@ -93,7 +93,7 @@ export const NotebookItem = ({item, isTopic = false, notebookID, isTrash}) => {
fontFamily: null fontFamily: null
}} }}
type="grayBg" type="grayBg"
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
icon="bookmark-outline" icon="bookmark-outline"
textStyle={{ textStyle={{
marginRight: 0 marginRight: 0
@@ -125,7 +125,7 @@ export const NotebookItem = ({item, isTopic = false, notebookID, isTrash}) => {
}}> }}>
<Paragraph <Paragraph
color={colors.accent} color={colors.accent}
size={SIZE.xs + 1} size={SIZE.xs}
style={{ style={{
marginRight: 6 marginRight: 6
}}> }}>
@@ -136,7 +136,7 @@ export const NotebookItem = ({item, isTopic = false, notebookID, isTrash}) => {
<> <>
<Paragraph <Paragraph
color={colors.icon} color={colors.icon}
size={SIZE.xs + 1} size={SIZE.xs}
style={{ style={{
textAlignVertical: 'center', textAlignVertical: 'center',
marginRight: 6 marginRight: 6
@@ -146,7 +146,7 @@ export const NotebookItem = ({item, isTopic = false, notebookID, isTrash}) => {
</Paragraph> </Paragraph>
<Paragraph <Paragraph
color={colors.accent} color={colors.accent}
size={SIZE.xs + 1} size={SIZE.xs}
style={{ style={{
textAlignVertical: 'center', textAlignVertical: 'center',
marginRight: 6 marginRight: 6
@@ -157,7 +157,7 @@ export const NotebookItem = ({item, isTopic = false, notebookID, isTrash}) => {
) : ( ) : (
<Paragraph <Paragraph
color={colors.icon} color={colors.icon}
size={SIZE.xs + 1} size={SIZE.xs}
style={{ style={{
marginRight: 6 marginRight: 6
}}> }}>
@@ -166,7 +166,7 @@ export const NotebookItem = ({item, isTopic = false, notebookID, isTrash}) => {
)} )}
<Paragraph <Paragraph
color={colors.icon} color={colors.icon}
size={SIZE.xs + 1} size={SIZE.xs}
style={{ style={{
marginRight: 6 marginRight: 6
}}> }}>

4
apps/mobile/src/components/Premium/expiring.js
View File

@@ -108,7 +108,7 @@ export const Expiring = () => {
await sleep(300); await sleep(300);
eSendEvent(eOpenPremiumDialog, promo); eSendEvent(eOpenPremiumDialog, promo);
}} }}
size={SIZE.xs + 2} size={SIZE.xs + 1}
style={{ style={{
textDecorationLine: 'underline', textDecorationLine: 'underline',
color: colors.icon, color: colors.icon,
@@ -161,7 +161,7 @@ export const Expiring = () => {
button: 'Continue' button: 'Continue'
}); });
}} }}
fontSize={SIZE.xs + 1} fontSize={SIZE.xs}
height={30} height={30}
style={{ style={{
marginBottom: 10 marginBottom: 10

2
apps/mobile/src/components/Premium/group.js
View File

@@ -50,7 +50,7 @@ export const Group = ({item, index}) => {
style={{ style={{
marginTop: 10 marginTop: 10
}} }}
size={SIZE.xs + 1} size={SIZE.xs}
color={colors.icon}> color={colors.icon}>
{item.info} {item.info}
</Paragraph> </Paragraph>

2
apps/mobile/src/components/Premium/pricingitem.js
View File

@@ -32,7 +32,7 @@ export const PricingItem = ({product, onPress, compact}) => {
: 'Monthly'} : 'Monthly'}
</Heading> </Heading>
{product?.info && ( {product?.info && (
<Paragraph size={SIZE.xs + 1}>{product.info}</Paragraph> <Paragraph size={SIZE.xs}>{product.info}</Paragraph>
)} )}
</View> </View>
)} )}

16
apps/mobile/src/components/Premium/pricingplans.js
View File

@@ -366,7 +366,7 @@ export const PricingPlans = ({
{!user ? ( {!user ? (
<Paragraph <Paragraph
color={colors.icon} color={colors.icon}
size={SIZE.xs + 1} size={SIZE.xs}
style={{ style={{
alignSelf: 'center', alignSelf: 'center',
textAlign: 'center', textAlign: 'center',
@@ -374,13 +374,13 @@ export const PricingPlans = ({
}}> }}>
Upon signing up, your 14 day free trial of Notesnook Pro will be Upon signing up, your 14 day free trial of Notesnook Pro will be
activated automatically.{' '} activated automatically.{' '}
<Paragraph size={SIZE.xs + 1} style={{fontWeight: 'bold'}}> <Paragraph size={SIZE.xs} style={{fontWeight: 'bold'}}>
No credit card information is required. No credit card information is required.
</Paragraph>{' '} </Paragraph>{' '}
Once the free trial period ends, your account will be downgraded to Once the free trial period ends, your account will be downgraded to
basic free account.{' '} basic free account.{' '}
<Paragraph <Paragraph
size={SIZE.xs + 1} size={SIZE.xs}
onPress={() => { onPress={() => {
openLinkInBrowser('https://notesnook.com/#pricing', colors) openLinkInBrowser('https://notesnook.com/#pricing', colors)
.catch(e => {}) .catch(e => {})
@@ -401,7 +401,7 @@ export const PricingPlans = ({
{Platform.OS === 'ios' ? ( {Platform.OS === 'ios' ? (
<Paragraph <Paragraph
textBreakStrategy="balanced" textBreakStrategy="balanced"
size={SIZE.xs + 1} size={SIZE.xs}
color={colors.icon} color={colors.icon}
style={{ style={{
alignSelf: 'center', alignSelf: 'center',
@@ -414,7 +414,7 @@ export const PricingPlans = ({
</Paragraph> </Paragraph>
) : ( ) : (
<Paragraph <Paragraph
size={SIZE.xs + 1} size={SIZE.xs}
color={colors.icon} color={colors.icon}
style={{ style={{
alignSelf: 'center', alignSelf: 'center',
@@ -432,7 +432,7 @@ export const PricingPlans = ({
width: '100%' width: '100%'
}}> }}>
<Paragraph <Paragraph
size={SIZE.xs + 1} size={SIZE.xs}
color={colors.icon} color={colors.icon}
style={{ style={{
maxWidth: '100%', maxWidth: '100%',
@@ -440,7 +440,7 @@ export const PricingPlans = ({
}}> }}>
By subscribing, you agree to our{' '} By subscribing, you agree to our{' '}
<Paragraph <Paragraph
size={SIZE.xs + 1} size={SIZE.xs}
onPress={() => { onPress={() => {
openLinkInBrowser('https://notesnook.com/tos', colors) openLinkInBrowser('https://notesnook.com/tos', colors)
.catch(e => {}) .catch(e => {})
@@ -456,7 +456,7 @@ export const PricingPlans = ({
</Paragraph> </Paragraph>
and{' '} and{' '}
<Paragraph <Paragraph
size={SIZE.xs + 1} size={SIZE.xs}
onPress={() => { onPress={() => {
openLinkInBrowser('https://notesnook.com/privacy', colors) openLinkInBrowser('https://notesnook.com/privacy', colors)
.catch(e => {}) .catch(e => {})

6
apps/mobile/src/components/PublishNoteDialog/index.js
View File

@@ -189,7 +189,7 @@ const PublishNoteDialog = () => {
flexShrink: 1 flexShrink: 1
}}> }}>
<Heading size={SIZE.sm}>Published at:</Heading> <Heading size={SIZE.sm}>Published at:</Heading>
<Paragraph size={SIZE.xs + 1} numberOfLines={1}> <Paragraph size={SIZE.xs} numberOfLines={1}>
{publishUrl} {publishUrl}
</Paragraph> </Paragraph>
<Paragraph <Paragraph
@@ -198,7 +198,7 @@ const PublishNoteDialog = () => {
await openLinkInBrowser(publishUrl, colors.accent); await openLinkInBrowser(publishUrl, colors.accent);
} catch (e) {} } catch (e) {}
}} }}
size={SIZE.xs + 1} size={SIZE.xs}
style={{ style={{
marginTop: 5, marginTop: 5,
color: colors.pri color: colors.pri
@@ -349,7 +349,7 @@ const PublishNoteDialog = () => {
<Paragraph <Paragraph
color={colors.icon} color={colors.icon}
size={SIZE.xs + 1} size={SIZE.xs}
style={{ style={{
textAlign: 'center', textAlign: 'center',
marginTop: 5, marginTop: 5,

2
apps/mobile/src/components/ResultDialog/ProFeatures.js
View File

@@ -66,7 +66,7 @@ export const ProFeatures = ({count = 6}) => {
await sleep(300); await sleep(300);
eSendEvent(eOpenPremiumDialog); eSendEvent(eOpenPremiumDialog);
}} }}
size={SIZE.xs + 2} size={SIZE.xs + 1}
style={{ style={{
textDecorationLine: 'underline', textDecorationLine: 'underline',
color: colors.icon color: colors.icon

2
apps/mobile/src/components/SimpleList/card.js
View File

@@ -54,7 +54,7 @@ export const Card = ({color}) => {
marginLeft: 10, marginLeft: 10,
maxWidth: '70%' maxWidth: '70%'
}}> }}>
<Paragraph color={colors.icon} size={SIZE.xs + 1}> <Paragraph color={colors.icon} size={SIZE.xs}>
{messageBoardState.message} {messageBoardState.message}
</Paragraph> </Paragraph>
<Paragraph <Paragraph

4
apps/mobile/src/components/SimpleList/notebookheader.js
View File

@@ -48,7 +48,7 @@ export const NotebookHeader = ({notebook, onPress, onEditNotebook}) => {
borderRadius: 10, borderRadius: 10,
paddingTop: 25 paddingTop: 25
}}> }}>
<Paragraph color={colors.icon} size={SIZE.xs + 1}> <Paragraph color={colors.icon} size={SIZE.xs}>
{new Date(notebook.dateEdited).toLocaleString()} {new Date(notebook.dateEdited).toLocaleString()}
</Paragraph> </Paragraph>
<View <View
@@ -101,7 +101,7 @@ export const NotebookHeader = ({notebook, onPress, onEditNotebook}) => {
fontStyle: 'italic', fontStyle: 'italic',
fontFamily: null fontFamily: null
}} }}
size={SIZE.xs + 1} size={SIZE.xs}
color={colors.icon}> color={colors.icon}>
{notebook.topics.length === 1 {notebook.topics.length === 1
? '1 topic' ? '1 topic'

2
apps/mobile/src/components/TagItem/index.js
View File

@@ -66,7 +66,7 @@ const TagItem = React.memo(
</Heading> </Heading>
<Paragraph <Paragraph
color={colors.icon} color={colors.icon}
size={SIZE.xs + 1} size={SIZE.xs}
style={{ style={{
marginTop: 5 marginTop: 5
}}> }}>

8
apps/mobile/src/utils/SizeUtils.js
View File

@@ -62,8 +62,8 @@ export const normalize = (size) => {
} }
}; };
export const SIZE = { export const SIZE = {
xxs: normalize(9) * scale.fontScale, xxs: normalize(10.5) * scale.fontScale,
xs: normalize(11) * scale.fontScale, xs: normalize(12) * scale.fontScale,
sm: normalize(14.5) * scale.fontScale, sm: normalize(14.5) * scale.fontScale,
md: normalize(16) * scale.fontScale, md: normalize(16) * scale.fontScale,
lg: normalize(22) * scale.fontScale, lg: normalize(22) * scale.fontScale,
@@ -73,8 +73,8 @@ export const SIZE = {
}; };
export function updateSize() { export function updateSize() {
SIZE.xxs = normalize(9) * scale.fontScale; SIZE.xxs = normalize(10.5) * scale.fontScale;
SIZE.xs = normalize(11) * scale.fontScale; SIZE.xs = normalize(12) * scale.fontScale;
SIZE.sm = normalize(14.5) * scale.fontScale; SIZE.sm = normalize(14.5) * scale.fontScale;
SIZE.md = normalize(16) * scale.fontScale; SIZE.md = normalize(16) * scale.fontScale;
SIZE.lg = normalize(22) * scale.fontScale; SIZE.lg = normalize(22) * scale.fontScale;