fix: styles for sceneCard

3DStreet · Sep 25, 2023 · 99c8882 · 99c8882
1 parent 07f2934
commit 99c8882
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/src/components/components/SceneCard/SceneCard.component.jsx b/src/components/components/SceneCard/SceneCard.component.jsx
@@ -22,7 +22,14 @@ const SceneCard = ({ scenesData, handleSceneClick }) => (
         onClick={() => handleSceneClick(scene)}
         title={scene.data().title}
       >
-        <img src={ScenePlaceholder} alt="scene" className={styles.img} />
+        <div
+          className={styles.img}
+          style={{
+            backgroundImage: `url(${ScenePlaceholder})`,
+            backgroundSize: 'cover',
+            backgroundPosition: 'center'
+          }}
+        />
         <p className={styles.title}>{scene.data().title}</p>
         <p className={styles.date}>
           <LastModified timestamp={scene.data().updateTimestamp} />

diff --git a/src/components/components/SceneCard/SceneCard.module.scss b/src/components/components/SceneCard/SceneCard.module.scss
@@ -8,16 +8,16 @@
   .img {
     margin-bottom: 6px;
     object-fit: cover;
-    width: 246px;
-    height: 144px;
+    width: 272px;
+    height: 204px;
   }
 
   .card {
     border-radius: 4px;
     border: 1px solid rgba(237, 235, 239, 0.2);
     padding: 8px 8px 12px 8px;
-    width: 246px;
-    height: 187px;
+    width: 272px;
+    height: 275px;
     position: relative;
     cursor: pointer;