From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Wed, 27 Sep 2023 16:14:07 +0000 (+0200)
Subject: wip #6300 @0.5
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=7cd9fe5a03c10075bf2fbf3ef563642910eb72b4;p=fluidbook-toolbox-quiz.git

wip #6300 @0.5
---

diff --git a/style/106-question-draganddrop.sass b/style/106-question-draganddrop.sass
index 319b899..07517d6 100644
--- a/style/106-question-draganddrop.sass
+++ b/style/106-question-draganddrop.sass
@@ -1,3 +1,15 @@
+[data-type="draganddrop"]
+
+    .fill-area
+        background-color: $standard-fill-area
+        width: 120px
+        height: 100%
+
+        &.area2
+            right: 0
+            left: auto
+
+
 .container-screen.question-draganddrop
     .screen-image
         width: auto
diff --git a/style/107-question-match.sass b/style/107-question-match.sass
index 1c5d848..7f29fe5 100644
--- a/style/107-question-match.sass
+++ b/style/107-question-match.sass
@@ -1,3 +1,9 @@
+[data-type="match"]
+    .fill-area
+        height: 160px
+        background-color: $standard-fill-area
+
+
 .question-match
 
     $transition-time: .3s
diff --git a/views/screens/question_draganddrop_area.blade.php b/views/screens/question_draganddrop_area.blade.php
index bd3104e..5271aa9 100644
--- a/views/screens/question_draganddrop_area.blade.php
+++ b/views/screens/question_draganddrop_area.blade.php
@@ -3,6 +3,8 @@
     $mobileImageKey='draganddropArea'.$area.'ImageMobile';
 @endphp
 <div class="screen-image zone-{{$area}} notDrag" data-zone="zone-{{$area}}">
+    <div class="fill-area area1"></div>
+    <div class="fill-area area2"></div>
     <img src="{{$theme->$desktopImageKey}}"/>
     <img class="mobile" src="{{$theme->$mobileImageKey}}"/>
     <div class="zone-content">
diff --git a/views/screens/question_match.blade.php b/views/screens/question_match.blade.php
index f5d9393..f2c5e4c 100644
--- a/views/screens/question_match.blade.php
+++ b/views/screens/question_match.blade.php
@@ -11,6 +11,7 @@
 @endphp
 
 <div class="container-screen none question-match" data-type="match" data-screen="q-{{$position}}">
+    <div class="fill-area"></div>
     @include('header_question', ['data' => $data, 'max' => $max, 'position' => $position])
     <div class="screen">