From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Thu, 28 Jan 2021 12:15:00 +0000 (+0100)
Subject: wait #4225 @1.5
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=66fbb27ab8ec5a3001676e1637e12e91d3c446a1;p=fluidbook-toolbox.git

wait #4225 @1.5
---

diff --git a/app/Models/Quiz.php b/app/Models/Quiz.php
index d3e62f242..5eae05606 100644
--- a/app/Models/Quiz.php
+++ b/app/Models/Quiz.php
@@ -7,6 +7,7 @@ use App\Http\Controllers\Admin\Base\QuizController;
 use Cubist\Backpack\Magic\Models\CubistMagicAbstractModel;
 use Cubist\Util\Files\Files;
 use Illuminate\Database\Eloquent\Builder;
+use Illuminate\Support\Facades\App;
 use Spatie\MediaLibrary\MediaCollections\Models\Media;
 use Spatie\Image\Manipulations;
 use App\Fields\User;
@@ -298,6 +299,9 @@ class Quiz extends CubistMagicAbstractModel
             $d['translations'][$text] = $translation->getAttribute($text);
         }
 
+        // Countries
+        $d['countriesList'] = \Cubist\Locale\Country::getList($translation->getAttribute('locale'));
+
         // Fix boolean
         $booleans = ['multiple', 'required', 'count_for_score'];
         foreach ($d['questions'] as $qn => $q) {
diff --git a/resources/quiz/js/main.js b/resources/quiz/js/main.js
index b5f17f34e..acfa2e6de 100644
--- a/resources/quiz/js/main.js
+++ b/resources/quiz/js/main.js
@@ -150,7 +150,11 @@
                 } else if (question.type === 'textarea') {
                     $(holder).append('<textarea ' + required + ' name="answer" class="focusme" placeholder="' + question.placeholder + '"></textarea>')
                 } else if (question.type === 'country') {
-                    var select = '<select name="answer" class="focusme"></select>';
+                    var select = '<div class="select-holder"><select name="answer" class="focusme"><option value="">--</option>';
+                    $.each(DATA.countriesList, function (code, name) {
+                        select += '<option value="' + code + '">' + name + '</option>';
+                    });
+                    select += '</select></div>';
                     $(holder).append(select);
                 }
 
diff --git a/resources/quiz/style/030-quiz.less b/resources/quiz/style/030-quiz.less
index f433b3fd5..70454a2d2 100644
--- a/resources/quiz/style/030-quiz.less
+++ b/resources/quiz/style/030-quiz.less
@@ -60,7 +60,29 @@ section {
     .answers {
         margin-top: 30px;
 
-        input[type="text"], input[type="email"], textarea {
+        .select-holder {
+            position: relative;
+
+            &:after {
+                display: block;
+                content: "";
+                position: absolute;
+                right: 0rem;
+                bottom: 1.2rem;
+                width: 3rem;
+                height: 0.5rem;
+                background-image: url("data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FscXVlXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMjguMiAxNS4xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAyOC4yIDE1LjE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDozO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMjYuNywxLjUgMTQuMSwxMy42IDEuNSwxLjUgIi8+DQo8L3N2Zz4=");
+                background-size: 100% 100%;
+                background-repeat: no-repeat;
+                pointer-events: none;
+            }
+        }
+
+        select {
+            appearance: none;
+        }
+
+        input[type="text"], input[type="email"], textarea, select {
             border: 0px;
             .border-radius(5px);
             padding: 15px;
diff --git a/resources/quiz/style/style.css b/resources/quiz/style/style.css
index c3fc74203..e490d175f 100644
--- a/resources/quiz/style/style.css
+++ b/resources/quiz/style/style.css
@@ -334,9 +334,29 @@ section {
 .question .answers {
   margin-top: 30px;
 }
+.question .answers .select-holder {
+  position: relative;
+}
+.question .answers .select-holder:after {
+  display: block;
+  content: "";
+  position: absolute;
+  right: 0rem;
+  bottom: 1.2rem;
+  width: 3rem;
+  height: 0.5rem;
+  background-image: url("data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FscXVlXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMjguMiAxNS4xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAyOC4yIDE1LjE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDozO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMjYuNywxLjUgMTQuMSwxMy42IDEuNSwxLjUgIi8+DQo8L3N2Zz4=");
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  pointer-events: none;
+}
+.question .answers select {
+  appearance: none;
+}
 .question .answers input[type="text"],
 .question .answers input[type="email"],
-.question .answers textarea {
+.question .answers textarea,
+.question .answers select {
   border: 0px;
   border-radius: 5px;
   background-clip: padding-box;