Adjusted questionset to make dots more visible. Removed optional title.
parent
1c69ec8442
commit
355d847bb1
|
@ -7,31 +7,38 @@
|
||||||
.questionset .h5p-multichoice > .h5p-show-solution {
|
.questionset .h5p-multichoice > .h5p-show-solution {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.questionset > .title {
|
|
||||||
font-size: 2em;
|
|
||||||
margin: 0.5em 0.16em 0.16em;
|
|
||||||
}
|
|
||||||
.dots-container {
|
.dots-container {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
line-height: 2em;
|
||||||
}
|
}
|
||||||
.progress-dot {
|
.progress-dot {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 10px;
|
width: 0.75em;
|
||||||
height: 10px;
|
height: 0.75em;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
border: 1px solid #494949;
|
margin: 0 0.25em;
|
||||||
margin: 0 3px;
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
background: #fff;
|
||||||
|
border: 0.0625em solid #c7c7c7;
|
||||||
|
}
|
||||||
|
.progress-dot:hover {
|
||||||
|
box-shadow: 0 0 0.5em #c7c7c7;
|
||||||
}
|
}
|
||||||
.progress-dot.answered {
|
.progress-dot.answered {
|
||||||
background: #494949;
|
border: 0.0625em solid #fff;
|
||||||
|
background: #bccade;
|
||||||
}
|
}
|
||||||
.progress-dot.current {
|
.progress-dot.current {
|
||||||
box-shadow: 1px 1px 4px #494949;
|
width: 1em;
|
||||||
margin: -1px 4px 1px 2px;
|
height: 1em;
|
||||||
}
|
border: 0.0625em solid #fff;
|
||||||
.intro-page {
|
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 {
|
.intro-page .title {
|
||||||
font-size: 2em;
|
font-size: 2em;
|
||||||
|
|
|
@ -3,14 +3,6 @@ var H5P = H5P || {};
|
||||||
/**
|
/**
|
||||||
* Will render a Question with multiple choices for answers.
|
* 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:
|
* Events provided:
|
||||||
* - h5pQuestionSetFinished: Triggered when a question is finished. (User presses Finish-button)
|
* - h5pQuestionSetFinished: Triggered when a question is finished. (User presses Finish-button)
|
||||||
*
|
*
|
||||||
|
@ -35,7 +27,6 @@ H5P.QuestionSet = function (options, contentId) {
|
||||||
'</div>' +
|
'</div>' +
|
||||||
'<% } %>' +
|
'<% } %>' +
|
||||||
'<div class="questionset<% if (introPage.showIntroPage) { %> hidden<% } %>">' +
|
'<div class="questionset<% if (introPage.showIntroPage) { %> hidden<% } %>">' +
|
||||||
' <% if (title !== "") { %><div class="title"><%= title %></div><% } %>' +
|
|
||||||
' <% for (var i=0; i<questions.length; i++) { %>' +
|
' <% for (var i=0; i<questions.length; i++) { %>' +
|
||||||
' <div class="question-container" id="q-<%= i %>">' +
|
' <div class="question-container" id="q-<%= i %>">' +
|
||||||
' <div><%= questions[i].library %></div>' +
|
' <div><%= questions[i].library %></div>' +
|
||||||
|
@ -68,7 +59,6 @@ H5P.QuestionSet = function (options, contentId) {
|
||||||
'</div>';
|
'</div>';
|
||||||
|
|
||||||
var defaults = {
|
var defaults = {
|
||||||
title: '',
|
|
||||||
randomOrder: false,
|
randomOrder: false,
|
||||||
initialQuestion: 0,
|
initialQuestion: 0,
|
||||||
backgroundImage: undefined,
|
backgroundImage: undefined,
|
||||||
|
@ -299,7 +289,7 @@ H5P.QuestionSet = function (options, contentId) {
|
||||||
$('#qdot-'+i, $myDom).removeClass('unanswered').addClass('answered');
|
$('#qdot-'+i, $myDom).removeClass('unanswered').addClass('answered');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Allow other libraries to add transitions after the questions have been inited
|
// Allow other libraries to add transitions after the questions have been inited
|
||||||
$('.questionset', $myDom).addClass('started');
|
$('.questionset', $myDom).addClass('started');
|
||||||
|
|
||||||
|
|
|
@ -1,9 +1,5 @@
|
||||||
{
|
{
|
||||||
"semantics": [
|
"semantics": [
|
||||||
{
|
|
||||||
"label": "Tittel",
|
|
||||||
"description": "Spørsmålssettets tittel (valgfri)."
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
"label": "Bakgrunnsbilde",
|
"label": "Bakgrunnsbilde",
|
||||||
"description": "Bakgrunnsbilde for spørsmålssettet(ikke obligatorisk)."
|
"description": "Bakgrunnsbilde for spørsmålssettet(ikke obligatorisk)."
|
||||||
|
@ -61,8 +57,8 @@
|
||||||
"label": "Ledetekster",
|
"label": "Ledetekster",
|
||||||
"fields": [
|
"fields": [
|
||||||
{
|
{
|
||||||
"label": "Tilbake-knappen",
|
"label": "Forrige-knappen",
|
||||||
"default": "Tilbake"
|
"default": "Forrige"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"label": "Neste-knappen",
|
"label": "Neste-knappen",
|
||||||
|
|
|
@ -1,10 +1,4 @@
|
||||||
[
|
[
|
||||||
{
|
|
||||||
"name": "title",
|
|
||||||
"type": "text",
|
|
||||||
"label": "Title",
|
|
||||||
"description": "Question set title (optional)."
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
"name": "backgroundImage",
|
"name": "backgroundImage",
|
||||||
"type": "image",
|
"type": "image",
|
||||||
|
|
Loading…
Reference in New Issue