pinar
Version:
Customizable, lightweight React Native carousel component with accessibility support
57 lines (56 loc) • 1.36 kB
JavaScript
export const defaultStyles = {
wrapper: { position: "relative" },
dotsContainerHorizontal: {
position: "absolute",
bottom: 25,
left: 0,
right: 0,
display: "flex",
flexDirection: "row",
justifyContent: "center",
alignItems: "center"
},
dotsContainerVertical: {
position: "absolute",
right: 15,
top: 0,
bottom: 0,
display: "flex",
flexDirection: "column",
justifyContent: "center",
alignItems: "center"
},
dot: {
backgroundColor: "rgba(0,0,0,.2)",
width: 8,
height: 8,
borderRadius: 4,
marginLeft: 3,
marginRight: 3,
marginTop: 3,
marginBottom: 3
},
dotActive: {
backgroundColor: "#333",
width: 8,
height: 8,
borderRadius: 4,
marginLeft: 3,
marginRight: 3,
marginTop: 3,
marginBottom: 3
},
controlsContainer: {
backgroundColor: "transparent",
flexDirection: "row",
position: "absolute",
top: 0,
left: 0,
flex: 1,
paddingHorizontal: 10,
paddingVertical: 10,
justifyContent: "space-between",
alignItems: "center"
},
buttonText: { color: "#333", fontSize: 50, padding: 20 }
};