Adjusted questionset to make dots more visible. Removed optional title.

css/questionset.css

@@ -7,31 +7,38 @@
 .questionset .h5p-multichoice > .h5p-show-solution {
   display: none;
 }
-.questionset > .title {
-  font-size: 2em;
-  margin: 0.5em 0.16em 0.16em;
-}
 .dots-container {
   text-align: center;
+  line-height: 2em;
 }
 .progress-dot {
   display: inline-block;
-  width: 10px;
-  height: 10px;
+  width: 0.75em;
+  height: 0.75em;
   border-radius: 50%;
-  border: 1px solid #494949;
-  margin: 0 3px;
+  margin: 0 0.25em;
   cursor: pointer;
+  background: #fff;
+  border: 0.0625em solid #c7c7c7;
+}
+.progress-dot:hover {
+  box-shadow: 0 0 0.5em #c7c7c7;
 }
 .progress-dot.answered {
-  background: #494949;
+  border: 0.0625em solid #fff;
+  background: #bccade;
 }
 .progress-dot.current {
-  box-shadow: 1px 1px 4px #494949;
-  margin: -1px 4px 1px 2px;
-}
-.intro-page {
-
+  width: 1em;
+  height: 1em;
+  border: 0.0625em solid #fff;
+  margin-bottom: -0.125em;
+  background: #267ec9;
+  background-image: -webkit-linear-gradient(top, #3999ea, #267ec9);
+  background-image: -moz-linear-gradient(top, #3999ea, #267ec9);
+  background-image: -o-linear-gradient(top, #3999ea, #267ec9);
+  background-image: -ms-linear-gradient(top, #3999ea, #267ec9);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3999ea', endColorstr='#267ec9',GradientType=0);
 }
 .intro-page .title {
   font-size: 2em;

js/questionset.js

@@ -3,14 +3,6 @@ var H5P = H5P || {};
 /**
  * Will render a Question with multiple choices for answers.
  *
- * Options format:
- * {
- *   title: "Optional title for question box",
- *   question: "Question text",
- *   answers: [{text: "Answer text", correct: false}, ...],
- *   singleAnswer: true, // or false, will change rendered output slightly.
- * }
- *
  * Events provided:
  * - h5pQuestionSetFinished: Triggered when a question is finished. (User presses Finish-button)
  *
@@ -35,7 +27,6 @@ H5P.QuestionSet = function (options, contentId) {
           '</div>' +
           '<% } %>' +
           '<div class="questionset<% if (introPage.showIntroPage) { %> hidden<% } %>">' +
-          '  <% if (title !== "") { %><div class="title"><%= title %></div><% } %>' +
           '  <% for (var i=0; i<questions.length; i++) { %>' +
           '    <div class="question-container" id="q-<%= i %>">' +
           '      <div><%= questions[i].library %></div>' +
@@ -68,7 +59,6 @@ H5P.QuestionSet = function (options, contentId) {
           '</div>';
 
   var defaults = {
-    title: '',
     randomOrder: false,
     initialQuestion: 0,
     backgroundImage: undefined,
@@ -299,7 +289,7 @@ H5P.QuestionSet = function (options, contentId) {
         $('#qdot-'+i, $myDom).removeClass('unanswered').addClass('answered');
       }
     }
-    
+
     // Allow other libraries to add transitions after the questions have been inited
     $('.questionset', $myDom).addClass('started');
 

language/nb.json

@@ -1,9 +1,5 @@
 {
   "semantics": [
-    {
-      "label": "Tittel",
-      "description": "Spørsmålssettets tittel (valgfri)."
-    },
     {
       "label": "Bakgrunnsbilde",
       "description": "Bakgrunnsbilde for spørsmålssettet(ikke obligatorisk)."
@@ -61,8 +57,8 @@
       "label": "Ledetekster",
       "fields": [
         {
-          "label": "Tilbake-knappen",
-          "default": "Tilbake"
+          "label": "Forrige-knappen",
+          "default": "Forrige"
         },
         {
           "label": "Neste-knappen",

semantics.json

@@ -1,10 +1,4 @@
 [
-  {
-    "name": "title",
-    "type": "text",
-    "label": "Title",
-    "description": "Question set title (optional)."
-  },
   {
     "name": "backgroundImage",
     "type": "image",