References #108, chnaged the shown information a bit.

The solution is not perfect, but is a stp in the right direction. Apart from a few tunes needed only the image issue remains.
SmartZoos · May 16, 2017 · 96318bc · 96318bc
1 parent 6cdcc92
commit 96318bc
Show file tree

Hide file tree

Showing 7 changed files with 44 additions and 8 deletions.
diff --git a/public/css/app.css b/public/css/app.css
diff --git a/public/css/app.css.map b/public/css/app.css.map
diff --git a/public/js/play.js b/public/js/play.js
diff --git a/resources/assets/js/components/GameInformationModal.vue b/resources/assets/js/components/GameInformationModal.vue
@@ -4,7 +4,7 @@
             <div class="modal-content">
                 <div class="modal-header">
                     <button type="button" class="close" aria-label="Close" v-on:click="close()"><span aria-hidden="true">&times;</span></button>
-                    <h4 class="modal-title">{{ activity.title }}</h4>
+                    <h4 class="modal-title text-center">{{ activity.title }}</h4>
                 </div>
                 <div class="modal-body">
                     <button class="btn btn-default btn-sm pull-right" role="button" data-toggle="collapse" data-target="#iconCodes" aria-expanded="false" aria-controls="iconCodes">
@@ -23,41 +23,55 @@
                             </div>
                         </div>
                     </div>
+                    <!--
                     <h3>{{ $t('description') }}</h3>
-                    <p class="sz-display-new-lines">
+                    -->
+                    <p class="sz-display-new-lines text-center" v-if="activity.description">
                         {{ activity.description }}
                     </p>
+                    <!--
                     <h3>{{ $t('activity-type') }}</h3>
                     <p>
                         {{ activity.type }}
                     </p>
-                    <h3>{{ $t('difficulty-level') }}</h3>
+                    -->
+                    <h4>{{ $t('number-of-questions') }}</h4>
+                    <p>{{ activity.questions.length }}</p>
+                    <h4>{{ $t('difficulty-level') }}</h4>
                     <p>
                         {{ activity.difficulty_level_start }} - {{ activity.difficulty_level_end }}
                     </p>
-                    <h3>{{ $t('playing-time') }}</h3>
+                    <h4>{{ $t('playing-time') }}</h4>
                     <p>
                         {{ activity.playing_time }} {{ $t('minutes') }}
                     </p>
+                    <!--
                     <h3>{{ $t('language') }}</h3>
                     <p>
                         {{ activity.language }}
                     </p>
+                    -->
+                    <!--
                     <h3 v-if="activity.contact_information">{{ $t('contact-information') }}</h3>
                     <p v-if="activity.contact_information">
                         {{ activity.contact_information }}
                     </p>
+                    -->
+                    <!--
                     <h3>{{ $t('featured-image') }}</h3>
+                    -->
                     <p>
                         <img v-bind:src="activity.featured_image" alt="featured-image" class="img-responsive center-block">
                     </p>
+                    <!--
                     <h3>{{ $t('zoo') }}</h3>
                     <p>
                         {{ activity.zoo }}
                     </p>
+                    -->
                 </div>
                 <div class="modal-footer">
-                    <button type="button" class="btn btn-default" v-on:click="close()">{{ $t('close')}}</button>
+                    <button type="button" class="btn btn-lg center-block sz-go-btn" v-on:click="close()">{{ $t('GO!')}}</button>
                 </div>
             </div>
         </div>

diff --git a/resources/assets/sass/app.scss b/resources/assets/sass/app.scss
@@ -417,3 +417,13 @@ table.sz-table-results {
     margin: 5px 0 5px 0;
     display: inline-block;
 }
+
+.btn.sz-go-btn {
+    background-color: #65bf3b;
+    border:5px solid #cff0c6;
+    color: #ffffff;
+    letter-spacing: 2px;
+    font-weight: bold;
+    padding-left: 25px;
+    padding-right: 25px;
+}
diff --git a/resources/lang/en/pages.php b/resources/lang/en/pages.php
@@ -73,6 +73,7 @@
             'image-format-hint' => 'Please use only PNG or JPG/JPEG images.',
             'apply-item-bounds' => 'Show all available Activity Item points on the map',
             'results-heading' => 'These are your results',
+            'number-of-questions' => 'No. of Questions',
             'icons' => [
                 'help' => 'Each icon has a colour code that indicates the state of a question.',
                 'active' => 'Unanswered',

diff --git a/resources/views/activities/play.blade.php b/resources/views/activities/play.blade.php
@@ -61,6 +61,7 @@
                     'image-format-hint' => trans('pages.play.game.image-format-hint'),
                     'apply-item-bounds' => trans('pages.play.game.apply-item-bounds'),
                     'results-heading' => trans('pages.play.game.results-heading'),
+                    'number-of-questions' => trans('pages.play.game.number-of-questions'),
                     'icons' => [
                         'help' => trans('pages.play.game.icons.help'),
                         'active' => trans('pages.play.game.icons.active'),