192 lines
3.9 KiB
TypeScript
192 lines
3.9 KiB
TypeScript
import { Colors } from "@/constants/colors";
|
|
import { Dimensions, StyleSheet } from "react-native";
|
|
|
|
const styles = StyleSheet.create({
|
|
mainContainer: {
|
|
flex: 1,
|
|
backgroundColor: Colors.background,
|
|
paddingTop: Dimensions.get("screen").height * 0.1,
|
|
},
|
|
logoContainer: {
|
|
alignItems: "center",
|
|
paddingTop: 8,
|
|
paddingBottom: 4,
|
|
},
|
|
showLogo: {
|
|
width: 100,
|
|
height: 80,
|
|
},
|
|
showImage: {
|
|
width: 200,
|
|
height: 200,
|
|
alignSelf: "center",
|
|
resizeMode: "contain",
|
|
bottom: 10,
|
|
},
|
|
showMainInfoSection: {
|
|
alignSelf: "center",
|
|
flexDirection: "row",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
gap: 8,
|
|
marginBottom: 8,
|
|
},
|
|
showInfoText: {
|
|
color: "rgba(255,255,255,0.7)",
|
|
fontSize: 13,
|
|
fontWeight: "500",
|
|
},
|
|
dot: {
|
|
width: 4,
|
|
height: 4,
|
|
borderRadius: 2,
|
|
backgroundColor: "rgba(255,255,255,0.3)",
|
|
marginHorizontal: 6,
|
|
},
|
|
showBannerLogoContainer: {
|
|
width: "100%",
|
|
height: 220,
|
|
alignSelf: "center",
|
|
marginTop: 8,
|
|
},
|
|
showBannerLogo: {
|
|
width: "100%",
|
|
height: "100%",
|
|
borderTopLeftRadius: 28,
|
|
borderTopRightRadius: 28,
|
|
},
|
|
infoContainner: {
|
|
width: "100%",
|
|
minHeight: "auto",
|
|
paddingHorizontal: 20,
|
|
paddingVertical: 14,
|
|
backgroundColor: "transparent",
|
|
flexDirection: "row",
|
|
gap: 6,
|
|
},
|
|
infoLabel: {
|
|
fontWeight: "500",
|
|
color: "rgba(255,255,255,0.5)",
|
|
fontSize: 15,
|
|
paddingHorizontal: 16,
|
|
paddingVertical: 8,
|
|
borderRadius: 20,
|
|
overflow: "hidden",
|
|
letterSpacing: 0.3,
|
|
},
|
|
participantsDetailsContainer: {
|
|
width: "100%",
|
|
minHeight: 200,
|
|
backgroundColor: "transparent",
|
|
},
|
|
participantWrapper: {
|
|
width: (Dimensions.get("window").width - 32 - 24) / 3,
|
|
alignItems: "center",
|
|
marginBottom: 16,
|
|
},
|
|
participantContainer: {
|
|
width: "100%",
|
|
aspectRatio: 0.72,
|
|
borderRadius: 16,
|
|
overflow: "hidden",
|
|
shadowColor: "#000",
|
|
shadowOffset: { width: 0, height: 4 },
|
|
shadowOpacity: 0.2,
|
|
shadowRadius: 8,
|
|
elevation: 4,
|
|
},
|
|
participantSection: {
|
|
flexDirection: "row",
|
|
flexWrap: "wrap",
|
|
gap: 12,
|
|
paddingHorizontal: 16,
|
|
paddingTop: 12,
|
|
},
|
|
seasonsSection: {
|
|
width: "100%",
|
|
minHeight: 50,
|
|
backgroundColor: "transparent",
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
gap: 12,
|
|
paddingHorizontal: 20,
|
|
paddingVertical: 8,
|
|
},
|
|
seasonList: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
gap: 8,
|
|
paddingLeft: 4,
|
|
paddingRight: 8,
|
|
},
|
|
seasonContainer: {
|
|
width: 40,
|
|
height: 40,
|
|
borderRadius: 20,
|
|
backgroundColor: "rgba(255,255,255,0.08)",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
borderWidth: StyleSheet.hairlineWidth,
|
|
borderColor: "rgba(255,255,255,0.06)",
|
|
},
|
|
seasonLabel: {
|
|
color: Colors.text,
|
|
fontWeight: "700",
|
|
fontSize: 14,
|
|
},
|
|
participantLabel: {
|
|
color: Colors.text,
|
|
fontWeight: "600",
|
|
textAlign: "center",
|
|
fontSize: 12,
|
|
marginTop: 6,
|
|
letterSpacing: 0.1,
|
|
width: "100%",
|
|
},
|
|
seasonsLabel: {
|
|
color: "rgba(255,255,255,0.6)",
|
|
fontWeight: "600",
|
|
fontSize: 15,
|
|
letterSpacing: 0.2,
|
|
},
|
|
detailTitle: {
|
|
color: "rgba(255,255,255,0.95)",
|
|
fontSize: 15,
|
|
fontWeight: "700",
|
|
marginTop: 10,
|
|
marginLeft: 20,
|
|
marginBottom: 5,
|
|
letterSpacing: 0.2,
|
|
},
|
|
detailLabel: {
|
|
color: "rgba(255,255,255,0.6)",
|
|
fontSize: 14,
|
|
lineHeight: 22,
|
|
width: "90%",
|
|
fontWeight: "400",
|
|
marginLeft: 20,
|
|
marginTop: 5,
|
|
},
|
|
startDate: {
|
|
color: "rgba(255,255,255,0.5)",
|
|
fontSize: 14,
|
|
textAlign: "center",
|
|
marginTop: 14,
|
|
fontWeight: "500",
|
|
letterSpacing: 0.5,
|
|
textTransform: "uppercase",
|
|
},
|
|
loadingContainer: {
|
|
flex: 1,
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
},
|
|
sectionLoading: {
|
|
width: "100%",
|
|
paddingVertical: 40,
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
},
|
|
});
|
|
export default styles;
|