142 lines
2.7 KiB
TypeScript
142 lines
2.7 KiB
TypeScript
import { StyleSheet } from "react-native";
|
|
|
|
const styles = StyleSheet.create({
|
|
mainContainer: {
|
|
flex: 1,
|
|
backgroundColor: "hsl(221, 39%, 12%)",
|
|
},
|
|
showImage: {
|
|
width: 200,
|
|
height: 200,
|
|
alignSelf: "center",
|
|
resizeMode: "contain",
|
|
bottom: 10,
|
|
},
|
|
showMainInfoSection: {
|
|
width: "auto",
|
|
height: "auto",
|
|
alignSelf: "center",
|
|
flexDirection: "row",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
bottom: 25,
|
|
},
|
|
showInfoText: {
|
|
color: "hsl(0, 0%, 80%)",
|
|
fontSize: 14,
|
|
},
|
|
dot: {
|
|
width: 4,
|
|
height: 4,
|
|
borderRadius: 3,
|
|
backgroundColor: "hsl(0, 0%, 80%)",
|
|
marginHorizontal: 7,
|
|
marginTop: 2,
|
|
},
|
|
showBannerLogoContainer: {
|
|
width: "100%",
|
|
height: 200,
|
|
alignSelf: "center",
|
|
borderTopLeftRadius: 80,
|
|
borderTopRightRadius: 80,
|
|
marginTop: 15,
|
|
},
|
|
showBannerLogo: {
|
|
width: "100%",
|
|
height: "100%",
|
|
borderTopLeftRadius: 30,
|
|
borderTopRightRadius: 30,
|
|
},
|
|
infoContainner: {
|
|
width: "100%",
|
|
height: "auto",
|
|
paddingHorizontal: 20,
|
|
paddingVertical: 15,
|
|
backgroundColor: "hsl(221, 39%, 0%)",
|
|
flexDirection: "row",
|
|
gap: 20,
|
|
},
|
|
infoLabel: {
|
|
fontWeight: "300",
|
|
color: "hsl(0, 0%, 80%)",
|
|
fontSize: 16,
|
|
},
|
|
participantsDetailsContainer: {
|
|
width: "100%",
|
|
height: "100%",
|
|
backgroundColor: "hsl(221, 39%, 2%)",
|
|
},
|
|
participantContainer: {
|
|
height: 160,
|
|
width: 110,
|
|
backgroundColor: "hsl(336, 79%, 63%)",
|
|
borderRadius: 10,
|
|
marginBottom: 30,
|
|
},
|
|
participantSection: {
|
|
flexDirection: "row",
|
|
flexWrap: "wrap",
|
|
gap: 15,
|
|
paddingLeft: 15,
|
|
paddingTop: 15,
|
|
},
|
|
seasonsSection: {
|
|
width: "100%",
|
|
height: 40,
|
|
backgroundColor: "hsl(221, 39%, 2%)",
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
gap: 10,
|
|
paddingHorizontal: 20,
|
|
},
|
|
seasonList: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
gap: 10,
|
|
paddingLeft: 5,
|
|
paddingRight: 5,
|
|
},
|
|
seasonContainer: {
|
|
width: 35,
|
|
height: 35,
|
|
borderRadius: 5,
|
|
backgroundColor: "hsl(0, 0%, 20%)",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
},
|
|
seasonLabel: {
|
|
color: "white",
|
|
fontWeight: "bold",
|
|
},
|
|
participantLabel: {
|
|
color: "white",
|
|
fontWeight: "500",
|
|
textAlign: "center",
|
|
fontSize: 11,
|
|
marginTop: 10,
|
|
},
|
|
seasonsLabel: {
|
|
color: "hsl(0, 0%, 80%)",
|
|
fontWeight: "500",
|
|
fontSize: 16,
|
|
},
|
|
detailTitle: {
|
|
color: "hsl(0, 0%, 100%)",
|
|
fontSize: 14,
|
|
fontWeight: "bold",
|
|
marginTop: 10,
|
|
marginLeft: 20,
|
|
marginBottom: 5,
|
|
},
|
|
detailLabel: {
|
|
color: "hsl(0, 0%, 80%)",
|
|
fontSize: 14,
|
|
lineHeight: 20,
|
|
width: "90%",
|
|
fontWeight: "300",
|
|
marginLeft: 20,
|
|
marginTop: 5,
|
|
},
|
|
});
|
|
export default styles;
|