177 lines
3.4 KiB
TypeScript
177 lines
3.4 KiB
TypeScript
import { Dimensions, StyleSheet } from "react-native";
|
|
|
|
const styles = StyleSheet.create({
|
|
mainContainer: {
|
|
flex: 1,
|
|
backgroundColor: "hsl(221, 39%, 12%)",
|
|
},
|
|
closeIcon: {
|
|
position: "absolute",
|
|
top: Dimensions.get("window").height * 0.065,
|
|
right: 15,
|
|
},
|
|
participantName: {
|
|
color: "white",
|
|
fontSize: 20,
|
|
fontWeight: "600",
|
|
textAlign: "center",
|
|
marginTop: Dimensions.get("window").height * 0.06,
|
|
},
|
|
participantImage: {
|
|
width: "100%",
|
|
height: 300,
|
|
borderRadius: 0,
|
|
alignSelf: "center",
|
|
borderTopLeftRadius: 20,
|
|
borderTopRightRadius: 20,
|
|
},
|
|
participantInfoSection: {
|
|
width: "100%",
|
|
height: "auto",
|
|
flexDirection: "row",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
marginBottom: 15,
|
|
marginTop: 5,
|
|
},
|
|
participantInfo: {
|
|
color: "hsl(0, 0%, 80%)",
|
|
fontSize: 16,
|
|
textAlign: "center",
|
|
},
|
|
dot: {
|
|
width: 4,
|
|
height: 4,
|
|
borderRadius: 3,
|
|
backgroundColor: "hsl(0, 0%, 80%)",
|
|
marginHorizontal: 7,
|
|
marginTop: 2,
|
|
},
|
|
performedShowsSection: {
|
|
width: "100%",
|
|
height: "100%",
|
|
backgroundColor: "hsl(221, 39%, 0%)",
|
|
marginTop: 20,
|
|
},
|
|
performedShowsTitle: {
|
|
fontSize: 16,
|
|
fontWeight: "600",
|
|
color: "hsl(0, 0%, 80%)",
|
|
marginTop: 15,
|
|
marginLeft: 15,
|
|
},
|
|
|
|
showImage: {
|
|
width: "100%",
|
|
height: "100%",
|
|
borderRadius: 10,
|
|
},
|
|
showLabel: {
|
|
color: "white",
|
|
fontSize: 14,
|
|
fontWeight: "600",
|
|
textAlign: "center",
|
|
},
|
|
contentContainer: {
|
|
flex: 1,
|
|
padding: 10,
|
|
alignItems: "center",
|
|
},
|
|
itemContainer: {
|
|
padding: 6,
|
|
margin: 6,
|
|
backgroundColor: "#eee",
|
|
},
|
|
showTitle: {
|
|
color: "white",
|
|
fontSize: 12,
|
|
fontWeight: "600",
|
|
textAlign: "center",
|
|
marginTop: 15,
|
|
},
|
|
showSeason: {
|
|
color: "hsl(0, 0%, 80%)",
|
|
fontSize: 12,
|
|
fontWeight: "400",
|
|
textAlign: "center",
|
|
marginTop: 5,
|
|
},
|
|
showContainer: {
|
|
width: Dimensions.get("window").width - 75,
|
|
height: 200,
|
|
borderRadius: 15,
|
|
marginTop: 20,
|
|
alignItems: "center",
|
|
backgroundColor: "hsl(336, 79%, 63%)",
|
|
},
|
|
|
|
card: {
|
|
width: Dimensions.get("window").width - 75,
|
|
alignItems: "center",
|
|
},
|
|
|
|
horizontalLine: {
|
|
height: 50,
|
|
width: 2,
|
|
backgroundColor: "hsl(0, 0%, 70%)",
|
|
marginTop: 10,
|
|
alignSelf: "center",
|
|
},
|
|
partnerLabel: {
|
|
color: "hsl(0, 0%, 80%)",
|
|
fontSize: 12,
|
|
fontWeight: "400",
|
|
textAlign: "center",
|
|
marginTop: 10,
|
|
},
|
|
participantContainer: {
|
|
width: "auto",
|
|
height: "auto",
|
|
borderRadius: 15,
|
|
marginTop: 15,
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
backgroundColor: "hsl(221, 39%, 12%)",
|
|
padding: 10,
|
|
},
|
|
|
|
participantLabel: {
|
|
color: "white",
|
|
fontSize: 12,
|
|
},
|
|
participantRow: {
|
|
flexDirection: "row",
|
|
flexWrap: "wrap",
|
|
gap: 6,
|
|
|
|
alignItems: "center",
|
|
justifyContent: "flex-start",
|
|
},
|
|
|
|
participantChip: {
|
|
paddingVertical: 4,
|
|
paddingHorizontal: 8,
|
|
borderRadius: 12,
|
|
backgroundColor: "hsl(221, 39%, 18%)",
|
|
maxWidth: 160,
|
|
},
|
|
participantChipText: {
|
|
color: "hsl(0, 0%, 85%)",
|
|
fontSize: 11,
|
|
},
|
|
|
|
moreChip: {
|
|
paddingVertical: 4,
|
|
paddingHorizontal: 10,
|
|
borderRadius: 12,
|
|
backgroundColor: "hsl(221, 39%, 28%)",
|
|
},
|
|
moreChipText: {
|
|
color: "white",
|
|
fontSize: 11,
|
|
fontWeight: "600",
|
|
},
|
|
});
|
|
|
|
export default styles;
|