4 files changed, 25 insertions, 5 deletions
diff --git a/animism-align/frontend/app/views/viewer/player/components.inline/inline.utility.js b/animism-align/frontend/app/views/viewer/player/components.inline/inline.utility.js
index d185722..7ac5997 100644
--- a/animism-align/frontend/app/views/viewer/player/components.inline/inline.utility.js
+++ b/animism-align/frontend/app/views/viewer/player/components.inline/inline.utility.js
@@ -8,14 +8,22 @@ export const Intro = ({ paragraph, media, currentParagraph, currentAnnotation, o
   const style = {
     backgroundImage: 'url(' + item.settings.file.url + ')',
   }
+  let lines = []
+  if (annotation.settings.title) {
+    lines = lines.concat(annotation.settings.title.split(/<br[^>]*>/))
+  }
+  if (annotation.settings.subtitle) {
+    lines = lines.concat(annotation.settings.subtitle.split(/<br[^>]*>/))
+  }
   return (
     <div
       className='site-intro'
       style={style}
     >
       <div className='inner'>
-        {annotation.settings.title && <span dangerouslySetInnerHTML={{ __html: annotation.settings.title }} />}
-        {annotation.settings.subtitle && <span dangerouslySetInnerHTML={{ __html: annotation.settings.subtitle }} />}
+        {lines.map((line, i) => (
+          <span key={i} dangerouslySetInnerHTML={{ __html: line }} />
+        ))}
       </div>
     </div>
   )
diff --git a/animism-align/frontend/app/views/viewer/player/components.utility/media.gallery.js b/animism-align/frontend/app/views/viewer/player/components.utility/media.gallery.js
index dd2e6db..da83c4f 100644
--- a/animism-align/frontend/app/views/viewer/player/components.utility/media.gallery.js
+++ b/animism-align/frontend/app/views/viewer/player/components.utility/media.gallery.js
@@ -31,7 +31,7 @@ export const Gallery = ({ media, annotation }) => {
 }
 
 const GalleryItem = ({ image, caption }) => {
-  console.log(image)
+  // console.log(image)
   return (
     <div className='gallery-item'>
       <div className='gallery-image'>
diff --git a/animism-align/frontend/app/views/viewer/player/components.utility/media.grid.js b/animism-align/frontend/app/views/viewer/player/components.utility/media.grid.js
index 5bba2d5..93b8696 100644
--- a/animism-align/frontend/app/views/viewer/player/components.utility/media.grid.js
+++ b/animism-align/frontend/app/views/viewer/player/components.utility/media.grid.js
@@ -26,7 +26,7 @@ export const Grid = ({ media, annotation }) => {
 }
 
 const GridItem = ({ image, caption }) => {
-  console.log(image)
+  // console.log(image)
   return (
     <div className='grid-item'>
       <div className='grid-image'>
diff --git a/animism-align/frontend/app/views/viewer/player/player.transcript.css b/animism-align/frontend/app/views/viewer/player/player.transcript.css
index dd63635..69abda2 100644
--- a/animism-align/frontend/app/views/viewer/player/player.transcript.css
+++ b/animism-align/frontend/app/views/viewer/player/player.transcript.css
@@ -168,9 +168,21 @@
   color: white;
   font-family: "Freight Text", serif;
   font-size: 12vh;
-  line-height: 1;
+  line-height: 1.3;
   text-align: center;
 }
+.site-intro .inner span {
+  box-shadow: -10px 0px 0 #000,
+               10px 0px 0 #000,
+              -10px 0px 0 #000,
+               10px 0px 0 #000;
+  box-decoration-break: clone;
+  background: black;
+  color: white;
+}
+
+/* schedule */
+
 .schedule {
   width: 45rem;
   display: flex;