diff --git a/src/actions/index.js b/src/actions/index.js index 8530bb8..ba528b7 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -1,5 +1,5 @@ /* global fetch, alert */ -import { urlFromEnv } from '../js/utilities' +import { urlFromEnv } from '../common/utilities' // TODO: relegate these URLs entirely to environment variables const EVENT_DATA_URL = urlFromEnv('EVENT_EXT') diff --git a/src/js/data/copy.json b/src/common/data/copy.json similarity index 100% rename from src/js/data/copy.json rename to src/common/data/copy.json diff --git a/src/js/data/es-MX.json b/src/common/data/es-MX.json similarity index 100% rename from src/js/data/es-MX.json rename to src/common/data/es-MX.json diff --git a/src/common/global.js b/src/common/global.js new file mode 100644 index 0000000..b88f71f --- /dev/null +++ b/src/common/global.js @@ -0,0 +1,13 @@ + +const colors = { + fa_red : '#eb443e', + yellow : '#ffd800', + black : '#000', + white : '#fff' +} + +export default { + darkBackground : colors.black, + primaryHighlight : colors.yellow, + secondaryHighlight : colors.white +} diff --git a/src/js/utilities.js b/src/common/utilities.js similarity index 100% rename from src/js/utilities.js rename to src/common/utilities.js diff --git a/src/components/Card.jsx b/src/components/Card.jsx index 5b27314..873150e 100644 --- a/src/components/Card.jsx +++ b/src/components/Card.jsx @@ -1,8 +1,8 @@ -import copy from '../js/data/copy.json' +import copy from '../common/data/copy.json' import { parseDate, formatterWithYear -} from '../js/utilities' +} from '../common/utilities' import React from 'react' import CardTimestamp from './presentational/Card/Timestamp' diff --git a/src/components/CardStack.jsx b/src/components/CardStack.jsx index c23a83c..d7d1c79 100644 --- a/src/components/CardStack.jsx +++ b/src/components/CardStack.jsx @@ -3,7 +3,7 @@ import { connect } from 'react-redux' import * as selectors from '../selectors' import Card from './Card.jsx' -import copy from '../js/data/copy.json' +import copy from '../common/data/copy.json' class CardStack extends React.Component { constructor () { diff --git a/src/components/InfoPopup.jsx b/src/components/InfoPopup.jsx index 5bb4fcd..4f091a0 100644 --- a/src/components/InfoPopup.jsx +++ b/src/components/InfoPopup.jsx @@ -1,5 +1,5 @@ import React from 'react' -import copy from '../js/data/copy.json' +import copy from '../common/data/copy.json' export default ({ ui, app, methods }) => { function renderIntro () { diff --git a/src/components/Layout.js b/src/components/Layout.js index 1a5914c..b9b7c37 100644 --- a/src/components/Layout.js +++ b/src/components/Layout.js @@ -16,7 +16,7 @@ import Notification from './Notification.jsx' import StaticPage from './StaticPage' import TemplateCover from './presentational/covers/TemplateCover' -import { parseDate } from '../js/utilities' +import { parseDate } from '../common/utilities' import { isMobile } from 'react-device-detect' class Dashboard extends React.Component { diff --git a/src/components/Overlay/Loading.js b/src/components/Overlay/Loading.js index 14bc32c..37bd110 100644 --- a/src/components/Overlay/Loading.js +++ b/src/components/Overlay/Loading.js @@ -1,5 +1,5 @@ import React from 'react' -import copy from '../../js/data/copy.json' +import copy from '../../common/data/copy.json' const LoadingOverlay = ({ isLoading, language }) => { let classes = 'loading-overlay' diff --git a/src/components/Overlay/Media.js b/src/components/Overlay/Media.js index f054827..c060407 100644 --- a/src/components/Overlay/Media.js +++ b/src/components/Overlay/Media.js @@ -1,7 +1,7 @@ import React from 'react' import Content from './Content' import Controls from './Controls' -import { selectTypeFromPathWithPoster } from '../../js/utilities' +import { selectTypeFromPathWithPoster } from '../../common/utilities' class SourceOverlay extends React.Component { constructor () { diff --git a/src/components/Timeline.jsx b/src/components/Timeline.jsx index f05eeeb..c752266 100644 --- a/src/components/Timeline.jsx +++ b/src/components/Timeline.jsx @@ -4,8 +4,8 @@ import { connect } from 'react-redux' import * as selectors from '../selectors' import hash from 'object-hash' -import copy from '../js/data/copy.json' -import { formatterWithYear, parseDate } from '../js/utilities' +import copy from '../common/data/copy.json' +import { formatterWithYear, parseDate } from '../common/utilities' import Header from './presentational/Timeline/Header' import Axis from './TimelineAxis.jsx' import Clip from './presentational/Timeline/Clip' diff --git a/src/components/Toolbar/CategoriesListPanel.js b/src/components/Toolbar/CategoriesListPanel.js index f0c3bf6..1011018 100644 --- a/src/components/Toolbar/CategoriesListPanel.js +++ b/src/components/Toolbar/CategoriesListPanel.js @@ -1,6 +1,6 @@ import React from 'react' import Checkbox from '../presentational/Checkbox' -import copy from '../../js/data/copy.json' +import copy from '../../common/data/copy.json' export default ({ categories, diff --git a/src/components/Toolbar/Layout.js b/src/components/Toolbar/Layout.js index 9f4e1b8..f0d53ba 100644 --- a/src/components/Toolbar/Layout.js +++ b/src/components/Toolbar/Layout.js @@ -9,8 +9,8 @@ import Search from './Search' import TagListPanel from './TagListPanel' import CategoriesListPanel from './CategoriesListPanel' import BottomActions from './BottomActions' -import copy from '../../js/data/copy.json' -import { trimAndEllipse } from '../../js/utilities.js' +import copy from '../../common/data/copy.json' +import { trimAndEllipse } from '../../common/utilities.js' class Toolbar extends React.Component { constructor (props) { diff --git a/src/components/Toolbar/Search.js b/src/components/Toolbar/Search.js index 1cec565..f881dcd 100644 --- a/src/components/Toolbar/Search.js +++ b/src/components/Toolbar/Search.js @@ -1,6 +1,6 @@ /* global fetch */ import React from 'react' -import copy from '../../js/data/copy.json' +import copy from '../../common/data/copy.json' import TagFilter from './TagFilter' export default class Search extends React.Component { diff --git a/src/components/Toolbar/TagListPanel.js b/src/components/Toolbar/TagListPanel.js index 52d830a..6097e72 100644 --- a/src/components/Toolbar/TagListPanel.js +++ b/src/components/Toolbar/TagListPanel.js @@ -1,6 +1,6 @@ import React from 'react' import Checkbox from '../presentational/Checkbox' -import copy from '../../js/data/copy.json' +import copy from '../../common/data/copy.json' function TagListPanel ({ tags, diff --git a/src/components/presentational/Card/Category.js b/src/components/presentational/Card/Category.js index 83cda74..2cc9c22 100644 --- a/src/components/presentational/Card/Category.js +++ b/src/components/presentational/Card/Category.js @@ -1,6 +1,6 @@ import React from 'react' -import { capitalizeFirstLetter } from '../../../js/utilities.js' +import { capitalizeFirstLetter } from '../../../common/utilities.js' const CardCategory = ({ categoryTitle, categoryLabel, color }) => (
diff --git a/src/components/presentational/Card/Location.js b/src/components/presentational/Card/Location.js index d2a47ad..9567324 100644 --- a/src/components/presentational/Card/Location.js +++ b/src/components/presentational/Card/Location.js @@ -1,6 +1,6 @@ import React from 'react' -import copy from '../../../js/data/copy.json' +import copy from '../../../common/data/copy.json' const CardLocation = ({ language, location, isPrecise }) => { if (location !== '') { diff --git a/src/components/presentational/Card/Summary.js b/src/components/presentational/Card/Summary.js index ea170b4..a50763b 100644 --- a/src/components/presentational/Card/Summary.js +++ b/src/components/presentational/Card/Summary.js @@ -1,6 +1,6 @@ import React from 'react' -import copy from '../../../js/data/copy.json' +import copy from '../../../common/data/copy.json' const CardSummary = ({ language, description, isHighlighted }) => { const summary = copy[language].cardstack.description diff --git a/src/components/presentational/Card/Tags.js b/src/components/presentational/Card/Tags.js index 446d819..ae9b711 100644 --- a/src/components/presentational/Card/Tags.js +++ b/src/components/presentational/Card/Tags.js @@ -1,6 +1,6 @@ import React from 'react' -import copy from '../../../js/data/copy.json' +import copy from '../../../common/data/copy.json' const CardTags = ({ tags, language }) => { const tagsLang = copy[language].cardstack.tags diff --git a/src/components/presentational/Card/Timestamp.js b/src/components/presentational/Card/Timestamp.js index f08d660..842b837 100644 --- a/src/components/presentational/Card/Timestamp.js +++ b/src/components/presentational/Card/Timestamp.js @@ -1,7 +1,7 @@ import React from 'react' -import copy from '../../../js/data/copy.json' -import { isNotNullNorUndefined } from '../../../js/utilities' +import copy from '../../../common/data/copy.json' +import { isNotNullNorUndefined } from '../../../common/utilities' const CardTimestamp = ({ timelabel, language, precision }) => { // const daytimeLang = copy[language].cardstack.timestamp diff --git a/src/components/presentational/Map/Events.jsx b/src/components/presentational/Map/Events.jsx index eec2e70..e459240 100644 --- a/src/components/presentational/Map/Events.jsx +++ b/src/components/presentational/Map/Events.jsx @@ -1,5 +1,6 @@ import React from 'react' import { Portal } from 'react-portal' +import colors from '../../../common/global.js' function MapEvents ({ getCategoryColor, categories, projectPoint, styleLocation, selected, narrative, onSelect, svg, locations }) { function getCoordinatesForPercent (radius, percent) { @@ -16,7 +17,7 @@ function MapEvents ({ getCategoryColor, categories, projectPoint, styleLocation, cx="0" cy="0" r="10" - stroke="#ffd800" + stroke={colors.primaryHighlight} fill-opacity="0.0" />} @@ -30,7 +31,7 @@ function MapEvents ({ getCategoryColor, categories, projectPoint, styleLocation, let styles = ({ fill: getCategoryColor(locCategory), - stroke: '#ffffff', + stroke: colors.darkBackground, strokeWidth: 0, fillOpacity: 0.85, ...extraStyles diff --git a/src/components/presentational/Map/SelectedEvents.jsx b/src/components/presentational/Map/SelectedEvents.jsx index 6894a60..d5c3b43 100644 --- a/src/components/presentational/Map/SelectedEvents.jsx +++ b/src/components/presentational/Map/SelectedEvents.jsx @@ -1,5 +1,6 @@ import React from 'react' import { Portal } from 'react-portal' +import colors from '../../../common/global.js' class MapSelectedEvents extends React.Component { renderMarker (event) { @@ -13,7 +14,7 @@ class MapSelectedEvents extends React.Component { > { function renderMarker (event) { @@ -7,7 +8,7 @@ const TimelineMarkers = ({ styles, getEventX, getCategoryY, transitionDuration, className='timeline-marker' cx={0} cy={0} - stroke={styles ? styles.stroke : '#ffffff'} + stroke={styles ? styles.stroke : colors.secondaryHighlight} stroke-opacity='1' stroke-width={styles ? styles['stroke-width'] : 2} stroke-linecap='' diff --git a/src/reducers/app.js b/src/reducers/app.js index f8a1012..5d0f086 100644 --- a/src/reducers/app.js +++ b/src/reducers/app.js @@ -1,5 +1,5 @@ import initial from '../store/initial.js' -import { parseDate, toggleFlagAC } from '../js/utilities' +import { parseDate, toggleFlagAC } from '../common/utilities' import { UPDATE_HIGHLIGHTED, diff --git a/src/selectors/helpers.js b/src/selectors/helpers.js index af6190c..273d70f 100644 --- a/src/selectors/helpers.js +++ b/src/selectors/helpers.js @@ -1,4 +1,4 @@ -import { parseTimestamp } from '../js/utilities' +import { parseTimestamp } from '../common/utilities' /** * Some handy helpers */ diff --git a/src/selectors/index.js b/src/selectors/index.js index bb19554..06104e6 100644 --- a/src/selectors/index.js +++ b/src/selectors/index.js @@ -1,5 +1,5 @@ import { createSelector } from 'reselect' -import { compareTimestamp, insetSourceFrom } from '../js/utilities' +import { compareTimestamp, insetSourceFrom } from '../common/utilities' import { isTimeRangedIn } from './helpers' // Input selectors diff --git a/src/store/initial.js b/src/store/initial.js index c0764c9..a408389 100644 --- a/src/store/initial.js +++ b/src/store/initial.js @@ -1,6 +1,5 @@ import { mergeDeepLeft } from 'ramda' - -const FA_RED = '#eb443e'; +import colors from '../common/global.js' const initial = { /* @@ -107,12 +106,12 @@ const initial = { tiles: 'openstreetmap', // ['openstreetmap', 'streets', 'satellite'] style: { categories: { - default: FA_RED + default: colors.fa_red }, narratives: { default: { opacity: 0.9, - stroke: FA_RED, + stroke: colors.fa_red, strokeWidth: 3 } },