diff options
Diffstat (limited to 'storybook/views')
-rw-r--r-- | storybook/views/index.ts | 6 | ||||
-rw-r--r-- | storybook/views/story-screen.tsx | 14 | ||||
-rw-r--r-- | storybook/views/story.tsx | 8 | ||||
-rw-r--r-- | storybook/views/use-case.tsx | 28 |
4 files changed, 33 insertions, 23 deletions
diff --git a/storybook/views/index.ts b/storybook/views/index.ts index a722e53..fb7ed3e 100644 --- a/storybook/views/index.ts +++ b/storybook/views/index.ts @@ -1,3 +1,3 @@ -export * from "./story-screen" -export * from "./story" -export * from "./use-case" +export * from './story-screen' +export * from './story' +export * from './use-case' diff --git a/storybook/views/story-screen.tsx b/storybook/views/story-screen.tsx index d83f6f5..1e59efd 100644 --- a/storybook/views/story-screen.tsx +++ b/storybook/views/story-screen.tsx @@ -1,15 +1,19 @@ -import * as React from "react" -import { ViewStyle, KeyboardAvoidingView, Platform } from "react-native" +import * as React from 'react' +import { ViewStyle, KeyboardAvoidingView, Platform } from 'react-native' -const ROOT: ViewStyle = { backgroundColor: "#f0f0f0", flex: 1 } +const ROOT: ViewStyle = { backgroundColor: '#f0f0f0', flex: 1 } export interface StoryScreenProps { children?: React.ReactNode } -const behavior = Platform.OS === "ios" ? "padding" : undefined +const behavior = Platform.OS === 'ios' ? 'padding' : undefined export const StoryScreen = (props: StoryScreenProps) => ( - <KeyboardAvoidingView style={ROOT} behavior={behavior} keyboardVerticalOffset={50}> + <KeyboardAvoidingView + style={ROOT} + behavior={behavior} + keyboardVerticalOffset={50} + > {props.children} </KeyboardAvoidingView> ) diff --git a/storybook/views/story.tsx b/storybook/views/story.tsx index c85f7f0..68d298e 100644 --- a/storybook/views/story.tsx +++ b/storybook/views/story.tsx @@ -1,5 +1,5 @@ -import * as React from "react" -import { ScrollView, View, ViewStyle } from "react-native" +import * as React from 'react' +import { ScrollView, View, ViewStyle } from 'react-native' export interface StoryProps { children?: React.ReactNode @@ -10,7 +10,9 @@ const ROOT: ViewStyle = { flex: 1 } export function Story(props: StoryProps) { return ( <View style={ROOT}> - <ScrollView keyboardShouldPersistTaps="handled">{props.children}</ScrollView> + <ScrollView keyboardShouldPersistTaps="handled"> + {props.children} + </ScrollView> </View> ) } diff --git a/storybook/views/use-case.tsx b/storybook/views/use-case.tsx index 08b04b9..b7f6647 100644 --- a/storybook/views/use-case.tsx +++ b/storybook/views/use-case.tsx @@ -1,33 +1,33 @@ -import * as React from "react" -import { View, Text, TextStyle, ViewStyle } from "react-native" +import * as React from 'react' +import { View, Text, TextStyle, ViewStyle } from 'react-native' -const ROOT: ViewStyle = { backgroundColor: "#eee" } -const TITLE: TextStyle = { fontWeight: "600", color: "#3d3d3d" } +const ROOT: ViewStyle = { backgroundColor: '#eee' } +const TITLE: TextStyle = { fontWeight: '600', color: '#3d3d3d' } const TITLE_WRAPPER: ViewStyle = {} const USE_CASE_WRAPPER: ViewStyle = { - position: "absolute", + position: 'absolute', top: 0, left: 0, right: 0, - borderTopColor: "#e6e6e6", + borderTopColor: '#e6e6e6', borderTopWidth: 1, - flexDirection: "row", + flexDirection: 'row', } const USE_CASE: TextStyle = { fontSize: 10, - color: "#666", + color: '#666', paddingHorizontal: 4, paddingBottom: 2, } -const USAGE: TextStyle = { color: "#666", fontSize: 10, paddingTop: 0 } +const USAGE: TextStyle = { color: '#666', fontSize: 10, paddingTop: 0 } const HEADER: ViewStyle = { paddingTop: 20, paddingBottom: 10, paddingHorizontal: 10, - borderBottomColor: "#e6e6e6", + borderBottomColor: '#e6e6e6', borderBottomWidth: 1, } -const COMPONENT: ViewStyle = { backgroundColor: "#fff" } +const COMPONENT: ViewStyle = { backgroundColor: '#fff' } export interface UseCaseProps { /** The title. */ @@ -48,7 +48,11 @@ export function UseCase(props: UseCaseProps) { const style: ViewStyle = { ...COMPONENT, ...{ padding: props.noPad ? 0 : 10 }, - ...{ backgroundColor: props.noBackground ? "rgba(0,0,0,0)" : COMPONENT.backgroundColor }, + ...{ + backgroundColor: props.noBackground + ? 'rgba(0,0,0,0)' + : COMPONENT.backgroundColor, + }, ...props.style, } |