You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

styles.js 2.0KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. import {
  2. BoxModel,
  3. ColorPalette,
  4. createStyleSheet
  5. } from '../../base/styles';
  6. const LABEL_TAB = 300;
  7. export const ANDROID_UNDERLINE_COLOR = 'transparent';
  8. /**
  9. * The styles of the React {@code Components} of the feature welcome including
  10. * {@code WelcomePage} and {@code BlankPage}.
  11. */
  12. export default createStyleSheet({
  13. /**
  14. * Standardized style for a field container {@code View}.
  15. */
  16. fieldContainer: {
  17. flexDirection: 'row',
  18. alignItems: 'center',
  19. minHeight: 65
  20. },
  21. /**
  22. * Standard container for a {@code View} containing a field label.
  23. */
  24. fieldLabelContainer: {
  25. flexDirection: 'row',
  26. alignItems: 'center',
  27. width: LABEL_TAB
  28. },
  29. /**
  30. * Field container style for all but last row {@code View}.
  31. */
  32. fieldSeparator: {
  33. borderBottomWidth: 1
  34. },
  35. /**
  36. * Style for the {@code View} containing each
  37. * field values (the actual field).
  38. */
  39. fieldValueContainer: {
  40. flex: 1,
  41. justifyContent: 'flex-end',
  42. flexDirection: 'row',
  43. alignItems: 'center'
  44. },
  45. /**
  46. * Page header {@code View}.
  47. */
  48. headerContainer: {
  49. backgroundColor: ColorPalette.blue,
  50. flexDirection: 'row',
  51. alignItems: 'center',
  52. padding: 2 * BoxModel.margin
  53. },
  54. /**
  55. * The title {@code Text} of the header.
  56. */
  57. headerTitle: {
  58. color: ColorPalette.white,
  59. fontSize: 25
  60. },
  61. /**
  62. * The top level container {@code View}.
  63. */
  64. settingsContainer: {
  65. backgroundColor: ColorPalette.white,
  66. flex: 1,
  67. flexDirection: 'column',
  68. margin: 0,
  69. padding: 2 * BoxModel.padding
  70. },
  71. /**
  72. * Global {@code Text} color for the page.
  73. */
  74. text: {
  75. color: ColorPalette.black,
  76. fontSize: 20
  77. },
  78. /**
  79. * Standard text input field style.
  80. */
  81. textInputField: {
  82. fontSize: 20,
  83. flex: 1,
  84. textAlign: 'right'
  85. }
  86. });