diff --git a/src/assets/css/pages/Game.scss b/src/assets/css/pages/Game.scss index 9e09eb7..37431f9 100644 --- a/src/assets/css/pages/Game.scss +++ b/src/assets/css/pages/Game.scss @@ -32,16 +32,32 @@ @apply w-fit h-full relative; .lhoist-blocks-focus-object { - // user-drag: none; - // cursor: url("../../img/cursors/cursor-hand-pointer.svg"), auto; cursor: url("../../img/cursors/cursor-hand-glass@2x.png"), auto; @apply absolute w-auto block object-contain; - // filter: brightness(10%) sepia(100%) saturate(10000%) hue-rotate(10deg); - &--inactive { + img { + @apply h-full; + } + + &--inactive img { filter: contrast(50%) saturate(0%) brightness(1.6); pointer-events: none; } + + &--unsafe::after, + &--safe::after { + @apply block absolute top-1/2 left-1/2 w-16 h-16; + + content: ""; + z-index: 11; + transform: translate(-50%, -50%); + } + &--unsafe::after { + background-image: url("../../img/icons/anwser_icon_unsafe.svg"); + } + &--safe::after { + background-image: url("../../img/icons/anwser_icon_safe.svg"); + } } } } diff --git a/src/components/game/GameObjects.jsx b/src/components/game/GameObjects.jsx index c7bee35..bc58c64 100644 --- a/src/components/game/GameObjects.jsx +++ b/src/components/game/GameObjects.jsx @@ -11,39 +11,39 @@ export default function GameObjects({ blocks }) { <> {blocks.map((block, id) => { const hasAnswered = answers && answers[id]?.userAnswer; + const correctAnswerType = answers && answers[id]?.correctAnswer; return ( - {block.attrs.objectPictureAlt} console.log(block.attrs.objectBehaviourDescription)} - // onClick={() => console.log(block.attrs.objectBehaviourDescription)} - onClick={() => - setCurrentGameModal( - - ) - } - /> + key={id}> + {block.attrs.objectPictureAlt} + setCurrentGameModal( + + ) + } + /> + ); })}