From 2f519bd66e7f0eeb374dfcd59043ad020196140e Mon Sep 17 00:00:00 2001 From: Paul Frazee Date: Thu, 6 Apr 2023 22:53:58 -0500 Subject: Add tos, community guidelines, and copyright policy (#410) * Add tos, community guidelines, and copyright policy * Fix lint --- src/view/com/util/Html.tsx | 69 ++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 61 insertions(+), 8 deletions(-) (limited to 'src/view/com/util/Html.tsx') diff --git a/src/view/com/util/Html.tsx b/src/view/com/util/Html.tsx index 245952e40..dbf24a83a 100644 --- a/src/view/com/util/Html.tsx +++ b/src/view/com/util/Html.tsx @@ -3,6 +3,7 @@ import {StyleSheet, View} from 'react-native' import {usePalette} from 'lib/hooks/usePalette' import {Text} from './text/Text' import {TextLink} from './Link' +import {isDesktopWeb} from 'platform/detection' /** * These utilities are used to define long documents in an html-like @@ -54,12 +55,26 @@ export function P({children}: React.PropsWithChildren<{}>) { ) } -export function UL({children}: React.PropsWithChildren<{}>) { - return {children} +export function UL({ + children, + isChild, +}: React.PropsWithChildren<{isChild: boolean}>) { + return ( + + {markChildProps(children)} + + ) } -export function OL({children}: React.PropsWithChildren<{}>) { - return {children} +export function OL({ + children, + isChild, +}: React.PropsWithChildren<{isChild: boolean}>) { + return ( + + {markChildProps(children)} + + ) } export function LI({ @@ -71,7 +86,7 @@ export function LI({ {value || <>•} - {children} + {markChildProps(children)} ) @@ -89,6 +104,33 @@ export function A({children, href}: React.PropsWithChildren<{href: string}>) { ) } +export function STRONG({children}: React.PropsWithChildren<{}>) { + const pal = usePalette('default') + return ( + + {children} + + ) +} + +export function EM({children}: React.PropsWithChildren<{}>) { + const pal = usePalette('default') + return ( + + {children} + + ) +} + +function markChildProps(children) { + return React.Children.map(children, child => { + if (React.isValidElement(child)) { + return React.cloneElement(child, {isChild: true}) + } + return child + }) +} + const styles = StyleSheet.create({ h1: { marginTop: 20, @@ -112,15 +154,23 @@ const styles = StyleSheet.create({ }, ul: { marginBottom: 10, - paddingLeft: 18, + paddingLeft: isDesktopWeb ? 18 : 4, + }, + ulChild: { + paddingTop: 10, + marginBottom: 0, }, ol: { marginBottom: 10, - paddingLeft: 18, + paddingLeft: isDesktopWeb ? 18 : 4, + }, + olChild: { + paddingTop: 10, + marginBottom: 0, }, li: { flexDirection: 'row', - paddingRight: 10, + paddingRight: 20, marginBottom: 10, }, liBullet: { @@ -130,4 +180,7 @@ const styles = StyleSheet.create({ a: { marginBottom: 10, }, + em: { + fontStyle: 'italic', + }, }) -- cgit 1.4.1