Add footer to clientFS

src/client/components/perspectives/sampo/client_fs/ClientFSMain.js

@@ -5,6 +5,7 @@ import Typography from '@material-ui/core/Typography'
 import Paper from '@material-ui/core/Paper'
 import intl from 'react-intl-universal'
 import bgImage from '../../../../img/main_page/bg2.jpg'
+import Footer from '../Footer'
 
 const styles = theme => ({
   root: {
@@ -47,27 +48,30 @@ const styles = theme => ({
 const ClientFSMain = props => {
   const { classes } = props
   return (
-    <Paper className={classes.root}>
-      <div className={classes.content}>
-        <div className={classes.textContainer}>
-          <Typography className={classes.frontPageHeading} component='h1' variant='h3' align='center' color='textPrimary' gutterBottom>
-            {intl.getHTML('appTitle.long')}
-          </Typography>
-          <Typography className={classes.frontPageText} variant='h5' align='left' color='textPrimary' paragraph>
-            {intl.get('appDescription1')}
-          </Typography>
-          <Typography className={classes.frontPageText} variant='h5' align='left' color='textPrimary' paragraph>
-            {intl.get('appDescription2')}
-          </Typography>
-          <Typography className={classes.frontPageText} variant='h5' align='left' color='textPrimary' paragraph>
-            {intl.get('appDescription3')}
-          </Typography>
-          <Typography className={classes.frontPageText} variant='h5' align='left' color='textPrimary' paragraph>
-            {intl.get('appDescription4')}
-          </Typography>
+    <>
+      <Paper className={classes.root}>
+        <div className={classes.content}>
+          <div className={classes.textContainer}>
+            <Typography className={classes.frontPageHeading} component='h1' variant='h3' align='center' color='textPrimary' gutterBottom>
+              {intl.getHTML('appTitle.long')}
+            </Typography>
+            <Typography className={classes.frontPageText} variant='h5' align='left' color='textPrimary' paragraph>
+              {intl.get('appDescription1')}
+            </Typography>
+            <Typography className={classes.frontPageText} variant='h5' align='left' color='textPrimary' paragraph>
+              {intl.get('appDescription2')}
+            </Typography>
+            <Typography className={classes.frontPageText} variant='h5' align='left' color='textPrimary' paragraph>
+              {intl.get('appDescription3')}
+            </Typography>
+            <Typography className={classes.frontPageText} variant='h5' align='left' color='textPrimary' paragraph>
+              {intl.get('appDescription4')}
+            </Typography>
+          </div>
         </div>
-      </div>
-    </Paper>
+      </Paper>
+      <Footer />
+    </>
   )
 }
 

src/client/components/perspectives/sampo/client_fs/ClientFSPerspective.js

@@ -9,6 +9,7 @@ import ResultInfo from '../../../facet_results/ResultInfo'
 import VirtualizedTable from '../../../facet_results/VirtualizedTable'
 import Pie from '../../../facet_results/Pie.js'
 import CSVButton from '../../../facet_results/CSVButton'
+import Footer from '../Footer'
 
 const ClientFSPerspective = props => {
   const { rootUrl, perspective } = props
@@ -103,6 +104,7 @@ const ClientFSPerspective = props => {
         render={() =>
           <CSVButton results={props.clientFSResults} />}
       />
+      <Footer />
     </>
   )
 }

src/client/containers/SemanticPortal.js

@@ -175,6 +175,9 @@ const useStyles = makeStyles(theme => ({
       height: '100%',
       overflow: 'auto'
     },
+    [theme.breakpoints.down('md')]: {
+      marginBottom: theme.spacing(1)
+    },
     paddingLeft: theme.spacing(0.5),
     paddingRight: theme.spacing(0.5)
   },