diff --git a/frontend/src/pages/HomePage.js b/frontend/src/pages/HomePage.js index 951dc19..bc88bd2 100644 --- a/frontend/src/pages/HomePage.js +++ b/frontend/src/pages/HomePage.js @@ -1,6 +1,6 @@ import _ from 'lodash' import React from 'react' -import {Tab, Message, Grid, Loader, Statistic, Segment, Header, Item} from 'semantic-ui-react' +import {Message, Grid, Loader, Statistic, Segment, Header, Item} from 'semantic-ui-react' import {useObservable} from 'rxjs-hooks' import {of, pipe, from} from 'rxjs' import {map, switchMap, distinctUntilChanged} from 'rxjs/operators' @@ -11,6 +11,7 @@ import api from '../api' import {Map, Page} from '../components' import {TrackListItem} from './TracksPage' +import styles from './HomePage.module.scss' function formatDuration(seconds) { return Duration.fromMillis((seconds ?? 0) * 1000) @@ -20,7 +21,7 @@ function formatDuration(seconds) { function WelcomeMap() { return ( - + @@ -70,7 +71,7 @@ function MostRecentTrack() { () => of(null).pipe( switchMap(() => from(api.fetch('/tracks?limit=1'))), - map(({tracks}) => tracks[0]) + map((response) => response?.tracks?.[0]) ), null, [] @@ -94,7 +95,7 @@ function MostRecentTrack() { export default function HomePage() { return ( - + diff --git a/frontend/src/pages/HomePage.module.scss b/frontend/src/pages/HomePage.module.scss new file mode 100644 index 0000000..32a71d5 --- /dev/null +++ b/frontend/src/pages/HomePage.module.scss @@ -0,0 +1,9 @@ +.welcomeMap { + height: 60rem; + max-height: 80vh; + + @media screen and (max-width: 767px) { + margin: -35px -32px 0 -32px; + max-height: 70vh; + } +} diff --git a/frontend/src/styles.scss b/frontend/src/styles.scss index 3398b85..d65caf5 100644 --- a/frontend/src/styles.scss +++ b/frontend/src/styles.scss @@ -1,4 +1,5 @@ @mixin container { max-width: 1200px; margin: 0 auto; + padding: 0 16px; }