1 files changed, 14 insertions, 21 deletions
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 d92f360..0d08c11 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
@@ -1,36 +1,29 @@
 import React, { Component } from 'react'
-import { useKeenSlider } from "keen-slider/react"
-import "keen-slider/keen-slider.min.css"
 
 export const Gallery = ({ media }) => {
   const { image_order, image_lookup, display_lookup, thumbnail_lookup } = media.settings
 
-  const [sliderRef] = useKeenSlider({
-    slidesPerView: 2,
-    mode: "free-snap",
-    spacing: 15,
-    centered: true,
-    loop: false
-  });
-  console.log(display_lookup)
+  // console.log(display_lookup)
   // console.log(width)
   return (
-    <div ref={sliderRef} className='keen-slider gallery-items'>
-      {image_order.map(id => {
-        const image = display_lookup[id]
-        console.log(image)
-        return (
-          <GalleryItem key={id} image={image} />
-        )
-      })}
+    <div className='gallery-items'>
+      <div className='gallery-scroll'>
+        {image_order.map(id => {
+          const image = display_lookup[id]
+          // console.log(image)
+          return (
+            <GalleryItem key={id} image={image} />
+          )
+        })}
+      </div>
     </div>
   )
 }
 
 const GalleryItem = ({ image }) => {
   return (
-    <div className='keen-slider__slide gallery-item' style={{
-      backgroundImage: 'url(' + image.url + ')',
-    }} />
+    <div className='gallery-item'>
+      <img src={image.url} />
+    </div>
   )
 }