1import { H4 } from '@expo/html-elements';
2import * as React from 'react';
3import { StyleSheet, View, ScrollView } from 'react-native';
4
5export function Page({ children }: { children: any }) {
6  return <View style={{ paddingHorizontal: 12, paddingBottom: 12 }}>{children}</View>;
7}
8
9export function ScrollPage({ children }: { children: any }) {
10  return (
11    <ScrollView style={{ flex: 1, paddingHorizontal: 12, paddingBottom: 12 }}>
12      {children}
13    </ScrollView>
14  );
15}
16
17export function Section({ title, children, row }: { title: string; children: any; row?: boolean }) {
18  return (
19    <View
20      style={{
21        borderBottomColor: 'rgba(0,0,0,0.1)',
22        borderBottomWidth: StyleSheet.hairlineWidth,
23        paddingBottom: 8,
24      }}>
25      <H4 style={{ marginTop: 8 }}>{title}</H4>
26      <View style={{ flexDirection: row ? 'row' : 'column' }}>{children}</View>
27    </View>
28  );
29}
30