Segment.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. import variable from "./../variables/platform";
  2. export default (variables = variable) => {
  3. const platform = variables.platform;
  4. const segmentTheme = {
  5. height: 45,
  6. borderColor: variables.segmentBorderColorMain,
  7. flexDirection: "row",
  8. justifyContent: "center",
  9. backgroundColor: variables.segmentBackgroundColor,
  10. "NativeBase.Button": {
  11. alignSelf: "center",
  12. borderRadius: 0,
  13. paddingHorizontal: 20,
  14. height: 30,
  15. backgroundColor: "transparent",
  16. borderWidth: 1,
  17. borderColor: variables.segmentBorderColor,
  18. elevation: 0,
  19. ".active": {
  20. backgroundColor: variables.segmentActiveBackgroundColor,
  21. "NativeBase.Text": {
  22. color: variables.segmentActiveTextColor
  23. }
  24. },
  25. ".first": {
  26. borderTopLeftRadius: platform === "ios" ? 5 : undefined,
  27. borderBottomLeftRadius: platform === "ios" ? 5 : undefined,
  28. borderRightWidth: 0
  29. },
  30. ".last": {
  31. borderTopRightRadius: platform === "ios" ? 5 : undefined,
  32. borderBottomRightRadius: platform === "ios" ? 5 : undefined,
  33. borderLeftWidth: 0
  34. },
  35. "NativeBase.Text": {
  36. color: variables.segmentTextColor,
  37. fontSize: 14
  38. }
  39. }
  40. };
  41. return segmentTheme;
  42. };