Redesign chart

config.js

@@ -1,34 +1,31 @@
-const config = {
-  columnWidth: 25,
-  xAxisHeightPercentage: 0.08,
-  xAxisHeightPercentageLarge: 0.12,
-  symptomHeightPercentage: 0.05,
-  symptomHeightPercentageLarge: 0.1,
-  temperatureScale: {
-    defaultLow: 35,
-    defaultHigh: 38,
-    min: 34,
-    max: 40,
-    step: 0.5,
-    units: 0.1,
-    verticalPadding: 0.03
-  },
-  symptoms: [
-    'bleeding',
-    'mucus',
-    'cervix',
-    'sex',
-    'desire',
-    'pain',
-    'mood',
-    'note'
-  ],
-}
-
-config.columnMiddle = config.columnWidth / 2
-
 export const ACTION_DELETE = 'delete'
 export const ACTION_EXPORT = 'export'
 export const ACTION_IMPORT = 'import'
 
-export default config
+export const SYMPTOMS = [
+  'bleeding',
+  'mucus',
+  'cervix',
+  'sex',
+  'desire',
+  'pain',
+  'mood',
+  'note'
+]
+
+export const CHART_COLUMN_WIDTH = 32
+export const CHART_COLUMN_MIDDLE = CHART_COLUMN_WIDTH / 2
+export const CHART_DOT_RADIUS = 6
+export const CHART_GRID_LINE_HORIZONTAL_WIDTH = 0.3
+export const CHART_ICON_SIZE = 20
+export const CHART_STROKE_WIDTH = 3
+export const CHART_SYMPTOM_HEIGHT_RATIO = 0.1
+export const CHART_XAXIS_HEIGHT_RATIO = 0.14
+export const CHART_YAXIS_WIDTH = 32
+
+export const TEMP_SCALE_MAX = 38
+export const TEMP_SCALE_MIN = 35
+export const TEMP_SCALE_UNITS = 0.1
+export const TEMP_MAX = 40
+export const TEMP_MIN = 34
+export const TEMP_SLIDER_STEP = 0.5