From a1a6862b5afc06209e75eff912dc98b2bf049048 Mon Sep 17 00:00:00 2001
From: Jon Eugster <eugster.jon@gmail.com>
Date: Fri, 8 Dec 2023 10:18:00 +0100
Subject: [PATCH] add tmp option to test images

---
 client/src/components/level.tsx | 5 +++--
 client/src/css/level.css        | 7 ++++++-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/client/src/components/level.tsx b/client/src/components/level.tsx
index 1246398..859711c 100644
--- a/client/src/components/level.tsx
+++ b/client/src/components/level.tsx
@@ -214,7 +214,7 @@ function PlayableLevel({impressum, setImpressum}) {
   const typewriterMode = useSelector(selectTypewriterMode(gameId))
   const setTypewriterMode = (newTypewriterMode: boolean) => dispatch(changeTypewriterMode({game: gameId, typewriterMode: newTypewriterMode}))
 
-  const gameInfo = useGetGameInfoQuery({game: gameId})  
+  const gameInfo = useGetGameInfoQuery({game: gameId})
   const level = useLoadLevelQuery({game: gameId, world: worldId, level: levelId})
 
   // The state variables for the `ProofContext`
@@ -488,7 +488,8 @@ function Introduction({impressum, setImpressum}) {
           <IntroductionPanel gameInfo={gameInfo} />
           <div className="world-image-container empty">
             {image &&
-              <img src={path.join("data", gameId, image)} alt="" />
+              // TODO: Temporary for testing
+              <img className={worldId=="Proposition" ? "cover" : "contain"} src={path.join("data", gameId, image)} alt="" />
             }
 
           </div>
diff --git a/client/src/css/level.css b/client/src/css/level.css
index 01d36b6..3dc397b 100644
--- a/client/src/css/level.css
+++ b/client/src/css/level.css
@@ -342,10 +342,15 @@ td code  {
   justify-content: center;
 }
 
-.world-image-container img {
+.world-image-container img.contain {
   object-fit: contain;
 }
 
+.world-image-container img.cover {
+  height: 100%;
+  object-fit: cover;
+}
+
 .typewriter-interface .proof {
   background-color: #fff;
 }