diff --git a/src/components/EpisodeCard/index.js b/src/components/EpisodeCard/index.js index 3d4b86d..d294873 100644 --- a/src/components/EpisodeCard/index.js +++ b/src/components/EpisodeCard/index.js @@ -14,7 +14,7 @@ import Flex from '../Flex' -const EpisodeCard = ({ image, title, seriesId, beginsOn, endsOn, id, url, description, ...rest }) => { +const EpisodeCard = ({ image, title, seriesId, beginsOn, endsOn, id: episodeId, url, description, ...rest }) => { const { data: { series: allSeries } } = useEventApi() const series = seriesId ? allSeries.filter(({ id }) => id === seriesId)[0] : {} @@ -24,11 +24,24 @@ const EpisodeCard = ({ image, title, seriesId, beginsOn, endsOn, id, url, descri const { width: screenWidth } = useWindowSize() const isMobile = screenWidth < screenSizes.md + const dateString = `${new Date()}` + let tzShort = + // Works for the majority of modern browsers + dateString.match(/\(([^\)]+)\)$/) || + // IE outputs date strings in a different format: + dateString.match(/([A-Z]+) [\d]{4}$/) + + if (tzShort) { + // Old Firefox uses the long timezone name (e.g., "Central + // Daylight Time" instead of "CDT") + tzShort = tzShort[1].match(/[A-Z]/g).join('') + } + return ( - + @@ -43,7 +56,8 @@ const EpisodeCard = ({ image, title, seriesId, beginsOn, endsOn, id, url, descri - + + ) diff --git a/src/components/EpisodeCard/styles.js b/src/components/EpisodeCard/styles.js index 69f101f..9142d46 100644 --- a/src/components/EpisodeCard/styles.js +++ b/src/components/EpisodeCard/styles.js @@ -48,6 +48,8 @@ export const Left = styled(FlexColumn)` export const Center = styled(FlexColumn)` @media screen and (max-width: ${screenSizes.md}px) { order: 2; + position: relative; + top: -1em; } ` @@ -59,10 +61,15 @@ export const Title = styled(H2)` export const Right = styled.div` flex: 1; text-align: right; + + label { + display: block; + margin-bottom: 0.2em; + } @media screen and (max-width: ${screenSizes.md}px) { position: relative; - top: 1em; + top: 1.2em; order: 1; } ` diff --git a/src/components/Markdown/styles.js b/src/components/Markdown/styles.js index f6cc328..333a4f9 100644 --- a/src/components/Markdown/styles.js +++ b/src/components/Markdown/styles.js @@ -28,6 +28,10 @@ export const MarkdownWrapper = styled.span` p { margin-bottom: ${props => (props.$withLinebreaks ? '32px' : '0')}; + + &:last-of-type { + margin-bottom: ${props => (props.$withLinebreaks ? '8px' : '0')}; + } } p > p { diff --git a/src/pages/SeriesPage/index.js b/src/pages/SeriesPage/index.js index 6d2edd4..1cdd2ea 100644 --- a/src/pages/SeriesPage/index.js +++ b/src/pages/SeriesPage/index.js @@ -109,16 +109,18 @@ const SeriesPage = ({ data }) => { {credits} : null} - {orgsList.length ? - {orgsList.map((org, index) => ( - - - {`${org.orgName} - - {orgsList.length === 2 && index + 1 !== orgsList.length ? : null} - - ))} - : null} + {orgsList.length ? ( + + {orgsList.map((org, index) => ( + + + {`${org.orgName} + + {orgsList.length === 2 && index + 1 !== orgsList.length ? : null} + + ))} + + ) : null} )