3 files changed, 21 insertions, 7 deletions
diff --git a/client/components/Details.jsx b/client/components/Details.jsx
index fff06e0..4994a3b 100644
--- a/client/components/Details.jsx
+++ b/client/components/Details.jsx
@@ -11,6 +11,7 @@ export default class Details extends Component {
   render() {
     const painting = this.props.painting
     if (! painting) return
+
     const source_images = findImages(painting.parameters)
     const parameters = breakUpJSON(painting.parameters)
     return (
diff --git a/client/components/Modal.jsx b/client/components/Modal.jsx
index 6e7e574..9220e11 100644
--- a/client/components/Modal.jsx
+++ b/client/components/Modal.jsx
@@ -3,12 +3,23 @@ import { Link } from 'react-router-dom'
 
 export default class Modal extends Component {
   render() {
-    const className = this.props.visible ? 'modal visible' : 'modal'
+    if (this.props.visible) {
+      document.body.classList.add("inModal")
+    }
+    else {
+      document.body.classList.remove("inModal")
+    }
+
+    const className = this.props.visible
+      ? 'modal visible'
+      : 'modal'
+    
     return (
       <div class={className}>
-        {this.props.children}
+        <div class='inner'>
+          {this.props.children}
+        </div>
       </div>
     )
   }
 }
-
diff --git a/client/components/Scroller.jsx b/client/components/Scroller.jsx
index 2c67a9a..05758b8 100644
--- a/client/components/Scroller.jsx
+++ b/client/components/Scroller.jsx
@@ -1,6 +1,7 @@
 import { h, Component } from 'preact'
 import { Lethargy } from 'lethargy'
 import { Link } from 'react-router-dom'
+import util from '../util'
 
 export default class Scroller extends Component {
   constructor() {
@@ -15,6 +16,7 @@ export default class Scroller extends Component {
     document.body.addEventListener('DOMMouseScroll', this.onWheel)
   }
   onWheel(e) {
+    if (util.isMobile) return;
     e.preventDefault()
     e.stopPropagation()
     const scrollDirection = this.lethargy.check(e)
@@ -35,10 +37,10 @@ export default class Scroller extends Component {
           </div>
           <div class='about'>
             <div>
-              {painting.title}<br/>
-              {painting.medium}<br/>
-              {painting.date}<br/>
-              {painting.image.caption}<br/>
+              <div>{painting.title}</div>
+              <div>{painting.medium}</div>
+              <div>{painting.date}</div>
+              <div>{painting.image.caption}</div>
               <br/>
               <Link to={'/painting/' + painting.id}>
                 More info &gt;