33 lines
895 B
JavaScript
33 lines
895 B
JavaScript
import React from "react";
|
||
import { View, Text } from "react-native";
|
||
|
||
export const StateBox = ({ text, title, style }) => (
|
||
<View style={{ ...boxStyle, ...style }}>
|
||
<Text style={{ fontSize: 12, color: "#0099CC" }}>{title}</Text>
|
||
<View style={{ flex: 1 }} />
|
||
<View style={{ fontSize: 25, color: "#0099CC", textAlign: "right" }}>
|
||
{text?.match("～") ? (
|
||
<>
|
||
<Text style={boxTextStyle}>{text.split("～")[0]}</Text>
|
||
<Text style={{ color: "#0099CC", textAlign: "right" }}>～</Text>
|
||
<Text style={boxTextStyle}>{text.split("～")[1]}</Text>
|
||
</>
|
||
) : (
|
||
<Text style={boxTextStyle}>{text}</Text>
|
||
)}
|
||
</View>
|
||
</View>
|
||
);
|
||
const boxStyle = {
|
||
flex: 1,
|
||
backgroundColor: "white",
|
||
borderRadius: 10,
|
||
padding: 10,
|
||
margin: 10,
|
||
};
|
||
const boxTextStyle = {
|
||
fontSize: 25,
|
||
color: "#0099CC",
|
||
textAlign: "right",
|
||
};
|