diff --git a/components/cycle-day/symptom-box.js b/components/cycle-day/symptom-box.js index 27d84cb..c77945d 100644 --- a/components/cycle-day/symptom-box.js +++ b/components/cycle-day/symptom-box.js @@ -1,7 +1,7 @@ import React, { Component } from 'react' import PropTypes from 'prop-types' import { StyleSheet, View, TouchableOpacity } from 'react-native' -import { moderateScale, scale, verticalScale } from 'react-native-size-matters' +import { scale } from 'react-native-size-matters' import AppText from '../common/app-text' import DripIcon from '../../assets/drip-icons' @@ -109,13 +109,13 @@ const styles = StyleSheet.create({ container: { alignItems: 'center', backgroundColor: 'white', - borderRadius: moderateScale(10), + borderRadius: scale(10), elevation: 4, flexDirection: 'row', - height: verticalScale(110), - marginBottom: verticalScale(Spacing.base), - paddingHorizontal: scale(Spacing.small), - paddingVertical: verticalScale(Spacing.base), + height: scale(110), + marginBottom: Spacing.base, + paddingHorizontal: Spacing.small, + paddingVertical: Spacing.base, width: Spacing.symptomTileWidth }, symptomName: { @@ -138,7 +138,7 @@ const styles = StyleSheet.create({ text: { fontSize: Sizes.small, fontStyle: 'italic', - lineHeight: scale(14) + lineHeight: Sizes.small }, textDisabled: { color: Colors.greyLight diff --git a/components/helpers/calendar.js b/components/helpers/calendar.js index 1ae762b..49c3776 100644 --- a/components/helpers/calendar.js +++ b/components/helpers/calendar.js @@ -1,4 +1,5 @@ import { LocalDate } from 'js-joda' +import { verticalScale } from 'react-native-size-matters' import { Colors, Fonts, Sizes } from '../../styles' @@ -12,7 +13,7 @@ export const toCalFormat = (bleedingDaysSortedByDate) => { customStyles: { container: { backgroundColor: shades[day.bleeding.value], - paddingTop: 2, + paddingTop: verticalScale(2), }, text: { color: Colors.turquoiseLight, diff --git a/config.js b/config.js index a085920..7b4fa8e 100644 --- a/config.js +++ b/config.js @@ -1,5 +1,5 @@ import { PixelRatio, StatusBar } from 'react-native' -import { scale, verticalScale, moderateScale } from 'react-native-size-matters' +import { scale, verticalScale } from 'react-native-size-matters' export const ACTION_DELETE = 'delete' export const ACTION_EXPORT = 'export' @@ -19,13 +19,13 @@ export const SYMPTOMS = [ export const CHART_COLUMN_WIDTH = 32 export const CHART_COLUMN_MIDDLE = CHART_COLUMN_WIDTH / 2 -export const CHART_DOT_RADIUS = moderateScale(6) +export const CHART_DOT_RADIUS = scale(6) export const CHART_GRID_LINE_HORIZONTAL_WIDTH = PixelRatio.roundToNearestPixel(0.3) -export const CHART_ICON_SIZE = moderateScale(20) +export const CHART_ICON_SIZE = scale(20) export const CHART_STROKE_WIDTH = scale(3) -export const CHART_SYMPTOM_HEIGHT_RATIO = verticalScale(0.08) -export const CHART_XAXIS_HEIGHT_RATIO = verticalScale(0.1) +export const CHART_SYMPTOM_HEIGHT_RATIO = scale(0.08) +export const CHART_XAXIS_HEIGHT_RATIO = scale(0.1) export const CHART_YAXIS_WIDTH = scale(32) export const CHART_TICK_WIDTH = scale(44)