4 files changed, 41 insertions, 7 deletions

diff --git a/frontend/site/projects/museum/views/landscape.warning.js b/frontend/site/projects/museum/views/landscape.warning.js
index eeb504c..7f03724 100644
--- a/frontend/site/projects/museum/views/landscape.warning.js
+++ b/frontend/site/projects/museum/views/landscape.warning.js
@@ -2,6 +2,7 @@ import React, { Component } from 'react'
 
 import './landscape.warning.css'
 
+import { isMobile } from 'app/utils'
 import { LastMuseumLogoNoBlur } from '../icons'
 
 const PhoneIcon = (
@@ -18,13 +19,15 @@ const RotateIcon = (
 
 export default class LandscapeWarning extends Component {
   state = {
-    landscape: false,
+    landscape: !isMobile || window.innerWidth > window.innerHeight,
   }
   constructor(props) {
     super(props)
     this.handleResize = this.handleResize.bind(this)
-    window.addEventListener("resize", this.handleResize)
-    this.handleResize()
+    if (isMobile) {
+      window.addEventListener("resize", this.handleResize)
+      setTimeout(this.handleResize, 100)
+    }
   }
 
   handleResize() {
@@ -36,7 +39,7 @@ export default class LandscapeWarning extends Component {
 
   render() {
     const { landscape } = this.state
-    if (!landscape) return null
+    if (landscape) return null
     return (
       <div className="landscape-warning">
         {RotateIcon}
diff --git a/frontend/site/projects/museum/views/mobile.css b/frontend/site/projects/museum/views/mobile.css
index cb43929..c9574ee 100644
--- a/frontend/site/projects/museum/views/mobile.css
+++ b/frontend/site/projects/museum/views/mobile.css
@@ -1,4 +1,6 @@
 @media only screen and (max-device-height: 500px) {
+  /* main nav */
+  .page .home-link,
   .museum-nav .home-link {
     font-size: 0.8rem
   }
@@ -13,12 +15,21 @@
     margin: 0;
   }
   .museum-nav .home-link.language-link {
-    padding: 1rem 0.5rem;
+    padding: 1rem 0.5rem 1rem 0;
+  }
+  .museum-nav .home-link.language-link:first-child {
+    padding-left: 1rem;
+  }
+  .page .home-link.language-link {
+    top: 2rem;
+    padding-top: 0.5rem;
   }
   .museum-nav .mute svg {
     width: 1.2rem;
     height: 1.2rem;
   }
+
+  /* footer */
   .footer,
   .footer-gradient {
     height: 3rem;
@@ -40,8 +51,19 @@
     width: 1.2rem;
     height: 1.2rem;
   }
+  .footer.no-artist {
+    pointer-events: none;
+  }
+
+  /* artist pages */
+  .page-artists .artist-location {
+    bottom: 0.5rem;
+  }
+
+  /* charles */
   .charles-text {
-    font-size: 1.7rem;
+    width: 90vw;
+    font-size: 0.8rem;
   }
   .chapter-headphones {
     font-size: 0.8rem;
@@ -51,4 +73,9 @@
   .chapter-title {
     top: 1.0625rem;
   }
+
+  /* nora */
+  .text-overlay {
+    padding: 10vw;
+  }
 }
\ No newline at end of file
diff --git a/frontend/site/projects/museum/views/nav.overlay.js b/frontend/site/projects/museum/views/nav.overlay.js
index 60f5e59..6d06fc3 100644
--- a/frontend/site/projects/museum/views/nav.overlay.js
+++ b/frontend/site/projects/museum/views/nav.overlay.js
@@ -4,7 +4,6 @@ import { connect } from 'react-redux'
 import actions from 'site/actions'
 
 import "./nav.css"
-import "./mobile.css"
 
 import TextOverlay from './text.overlay'
 import JakrawalLinks from './jakrawal.links'
diff --git a/frontend/site/projects/museum/views/titles.overlay.js b/frontend/site/projects/museum/views/titles.overlay.js
index 7f254ab..a7aae17 100644
--- a/frontend/site/projects/museum/views/titles.overlay.js
+++ b/frontend/site/projects/museum/views/titles.overlay.js
@@ -3,6 +3,8 @@ import { connect } from 'react-redux'
 
 import { HEADPHONES } from '../constants.js'
 import { SUBTITLES } from '../subtitles.js'
+import { isMobile } from 'app/utils'
+import actions from 'site/actions'
 
 import './titles.css'
 
@@ -73,6 +75,9 @@ class TitlesOverlay extends Component {
         showVideo: false,
       })
       setTimeout(SUBTITLES[page_name].headphones ? this.showHeadphones : this.showTitle, 0)
+      if (isMobile) {
+        actions.site.setPopups({ text: true })
+      }
     } else {
       this.setState({
         content: null,