patrick@87: @charset "UTF-8";
patrick@87: 
patrick@87: /* $Id$ */
patrick@87: 
patrick@87: @import url(publidoc.css);
patrick@87: 
patrick@87: 
patrick@87: publiquiz {
patrick@87:   display: block;
patrick@87:   font-family: sans-serif;
patrick@87:   padding: 0;
patrick@87: }
patrick@87: 
patrick@87: 
patrick@87: /* Component level ========================================================= */
patrick@87: 
patrick@87: quiz:before  {
patrick@87:   display: block;
patrick@87:   color: #7f7f7f;
patrick@87:   background-color: #ddddcc;
patrick@87:   border: 1px solid #aeaea0;
patrick@87:   font-weight: bold;
patrick@87:   padding: .5em 5px .5em 5px;
patrick@87:   content: collapser() " " insert-before-button() insert-after-button()
patrick@87:            " " add-attribute-button() " Quiz";
patrick@87: }
patrick@87: 
Patrick@158: quiz[id]:before {
Patrick@158:   content: collapser() " " insert-before-button() insert-after-button()
Patrick@158:            " " add-attribute-button() " Quiz"
Patrick@158:            " – ID = " text-field(attribute, "id", columns, 15, color, black);
Patrick@158: }
Patrick@158: quiz[type]:before {
Patrick@158:   content: collapser() " " insert-before-button() insert-after-button()
Patrick@158:            " " add-attribute-button() " Quiz"
Patrick@158:            " – Type = " text-field(attribute, type, columns, 10, color, black);
Patrick@158: }
Patrick@158: quiz[id][type]:before {
Patrick@158:   content: collapser() " " insert-before-button() insert-after-button()
Patrick@158:            " Quiz"
Patrick@158:            " – ID = " text-field(attribute, "id", columns, 15, color, black)
Patrick@158:            " – Type = " text-field(attribute, type, columns, 10, color, black);
patrick@87: }
patrick@87: 
patrick@87: quiz {
patrick@87:   display: block;
patrick@87:   border: 1px solid #aeaea0;
patrick@87:   margin-bottom: .5em;
patrick@87:   padding: 5px;
patrick@87:   collapsible: yes;
patrick@87: }
patrick@87: quiz:last-child {
patrick@87:   margin-bottom: 0;
patrick@87: }
patrick@87: 
patrick@87: quiz > head {
patrick@87:   background-color: #ffffee;
patrick@87:   padding: .3em .5em .3em .5em;
patrick@87:   border-radius: 0.5em;
patrick@87: }
patrick@87: 
patrick@87: 
patrick@87: /* Top level =============================================================== */
patrick@87: 
patrick@87: publiquiz > *:before {
patrick@87:   display: block;
patrick@87:   color: #bbbbbb;
patrick@87:   background: #993333 url('top.png') repeat-x top left;
patrick@87:   font-weight: bold;
patrick@87:   padding: 1.2em 5px 1em 5px;
patrick@87: }
patrick@87: publiquiz > document:before {
patrick@87:   content: add-attribute-button() " Document"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white);
patrick@87: }
patrick@117: publiquiz > document[id][xml|lang]:before {
patrick@87:   content: "Document"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white)
patrick@87:            " – Langue principale  = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@125:              values, "en\A fr\A es", color, white);
patrick@87: }
patrick@117: publiquiz > quiz[id]:before {
patrick@87:   content: add-attribute-button() " Quiz"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white);
patrick@87: }
Patrick@158: publiquiz > quiz[id][type]:before {
Patrick@158:   content: add-attribute-button() " Quiz"
Patrick@158:            " – ID = " text-field(attribute, "id", columns, 15, color, white)
Patrick@158:            " – Type = " text-field(attribute, type, columns, 10, color, white);
Patrick@158: }
patrick@117: publiquiz > quiz[id][xml|lang]:before {
Patrick@158:   content: add-attribute-button() " Quiz"
Patrick@158:            " – ID = " text-field(attribute, "id", columns, 15, color, white)
Patrick@158:            " – Langue principale = " combo-box(attribute, "xml:lang", font-size, 75%,
Patrick@158:              values, "en\A fr\A es", color, white);
Patrick@158: }
Patrick@158: publiquiz > quiz[id][type][xml|lang]:before {
patrick@87:   content: "Quiz"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white)
Patrick@158:            " – Type = " text-field(attribute, type, columns, 10, color, white)
Patrick@158:            " – Langue principale = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@125:              values, "en\A fr\A es", color, white);
patrick@87: }
patrick@87: 
patrick@87: publiquiz > * {
patrick@87:   display: block;
patrick@87:   margin: 5px;
patrick@87:   padding: 0;
patrick@87:   border: 0;
patrick@87: }
patrick@87: 
patrick@87: publiquiz > * > head {
patrick@87:   background-color: #ffffee;
patrick@87:   padding: .3em .5em .3em .5em;
patrick@87:   border-radius: 0.5em;
patrick@87: }
patrick@87: 
patrick@87: publiquiz > * > head > title {
patrick@87:   font-size: 140%;
patrick@87: }
patrick@87: 
patrick@87: 
patrick@87: /* Section level =========================================================== */
patrick@87: 
patrick@87: quiz > *:before, quiz > composite > *:before {
patrick@87:   display: block;
patrick@87:   color: #7f7f7f;
patrick@87:   text-align: left;
patrick@87:   font-style: normal;
patrick@87:   font-size: 75%;
patrick@87:   padding-bottom: 3px;
patrick@87: }
patrick@87: 
patrick@87: quiz > *, quiz > composite > * {
patrick@87:   display: block;
patrick@87: }
patrick@87: 
patrick@87: quiz > *:after, quiz > composite > *:after {
patrick@87:   color: #7f7f7f;
patrick@87:   content: insert-after-button();
patrick@87: }
patrick@87: 
patrick@87: quiz > head:after {
patrick@87:   display: none;
patrick@87: }
patrick@87: 
patrick@87: /* instructions ~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: instructions:before {
patrick@87:   background-color: #e8f0f7;
patrick@87:   content: insert-before-button() " Consigne";
patrick@87: }
patrick@87: 
patrick@87: instructions {
patrick@87:   display: block;
patrick@87:   background-color: #e8f0f7;
patrick@87: }
patrick@87: 
patrick@87: instructions section:before, instructions section, instructions section:after {
patrick@87:   margin-left: 1em;
patrick@87: }
patrick@87: 
patrick@87: /* choices ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: choices-radio:before {
patrick@128:   color: #7f7f7f;
patrick@87:   content: insert-before-button()
patrick@87:            command-button(command, "putAttribute", parameter, "shuffle true", icon, icon(plus-box))
patrick@87:            " QCM – radio";
patrick@87: }
patrick@87: choices-radio[shuffle]:before {
patrick@87:   content: insert-before-button()
patrick@87:            " QCM – radio"
patrick@87:            " – shuffle = " label(attribute, shuffle, color, black)
patrick@87:            set-attribute-button(attribute, shuffle, unset-attribute, yes);
patrick@87: }
patrick@87: 
patrick@87: choices-check:before {
patrick@128:   color: #7f7f7f;
patrick@87:   content: insert-before-button()
patrick@87:            command-button(command, "putAttribute", parameter, "shuffle true", icon, icon(plus-box))
patrick@87:            " QCM – check";
patrick@87: }
patrick@87: choices-check[shuffle]:before {
patrick@87:   content: insert-before-button()
patrick@87:            " QCM – check"
patrick@87:            " – shuffle = " label(attribute, shuffle, color, black)
patrick@87:            set-attribute-button(attribute, shuffle, unset-attribute, yes);
patrick@87: }
patrick@87: 
patrick@87: /* blanks ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: blanks-fill:before {
patrick@87:   content: insert-before-button()
patrick@87:            command-button(command, "putAttribute", parameter, "strict true", icon, icon(plus-box))
patrick@87:            " Exercice à trous – saisie libre";
patrick@87: }
patrick@87: blanks-fill[strict]:before {
patrick@87:   content: insert-before-button()
patrick@87:            " Exercice à trous – saisie libre"
patrick@87:            " – strict = " label(attribute, strict, color, black)
patrick@87:            set-attribute-button(attribute, strict, unset-attribute, yes);
patrick@87: }
patrick@87: 
patrick@87: blanks-select:before {
patrick@87:   content: insert-before-button()
patrick@87:            command-button(command, "putAttribute", parameter, "multiple true", icon, icon(plus-box))
patrick@87:            " Exercice à trous – liste fermée";
patrick@87: }
patrick@87: blanks-select[multiple]:before {
patrick@87:   content: insert-before-button()
patrick@87:            " Exercice à trous – liste fermée"
patrick@87:            " – multiple = " label(attribute, multiple, color, black)
patrick@87:            set-attribute-button(attribute, multiple, unset-attribute, yes);
patrick@87: }
patrick@87: 
patrick@87: /* point ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: point:before {
patrick@87:   content: insert-before-button() " "
patrick@87:            command-button(command, "putAttribute", parameter, "type radio", icon, icon(plus-box))
patrick@87:            " Pointage";
patrick@87: }
patrick@87: point[type]:before {
patrick@87:   content: insert-before-button()
patrick@87:            " Pointage – type = " label(attribute, type, color, black)
patrick@87:            set-attribute-button(attribute, type, unset-attribute, yes);
patrick@87: }
patrick@87: 
patrick@87: /* matching ~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: matching:before {
patrick@87:   content: insert-before-button() " Appariement";
patrick@87: }
patrick@87: 
patrick@87: /* sort ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: sort:before {
patrick@87:   content: insert-before-button() 
patrick@87:            command-button(command, "putAttribute", parameter, "shuffle true", icon, icon(plus-box))
patrick@87:            " Tri";
patrick@87: }
patrick@87: sort[shuffle]:before {
patrick@87:   content: insert-before-button()
patrick@87:            " Tri – shuffle = " label(attribute, shuffle, color, black)
patrick@87:            set-attribute-button(attribute, shuffle, unset-attribute, yes);
patrick@87: }
patrick@87: 
patrick@125: /* categories ~~~~~~~~~~~~~~~~~~~~~~ */
patrick@125: 
patrick@125: categories:before {
patrick@125:   content: insert-before-button() " Catégories";
patrick@125: }
patrick@125: 
patrick@87: /* production ~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: production:before {
patrick@87:   content: insert-before-button() " Production";
patrick@87: }
patrick@87: 
patrick@87: /* composite ~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: composite:before {
Patrick@161:   content: insert-before-button()
Patrick@161:            command-button(command, "putAttribute", parameter, "multipage true", icon, icon(plus-box))
Patrick@161:            " Composite";
Patrick@161: }
Patrick@161: composite[multipage]:before {
Patrick@161:   content: insert-before-button()
Patrick@161:            " Composite – multipage = " label(attribute, multipage, color, black)
Patrick@161:            set-attribute-button(attribute, multipage, unset-attribute, yes)
patrick@87: }
patrick@87: 
patrick@87: subquiz {
patrick@87:   display: block;
patrick@87:   border-style: none;
patrick@87:   margin: 0 0 .6em 1em;
patrick@87:   padding: 0;
patrick@87: }
patrick@87: 
patrick@87: subquiz > *, subquiz > *:before  {
patrick@87:   display: block;
patrick@87: }
patrick@87: 
patrick@87: subquiz > head {
patrick@87:   background-color: #ffffee;
patrick@87:   padding: .3em .5em .3em .5em;
patrick@87:   border-radius: 0.5em;
patrick@87: }
patrick@87: 
patrick@87: subquiz > instructions:before {
patrick@87:   content: "Consigne";
patrick@87: }
patrick@87: 
patrick@87: /* help ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: help:before {
patrick@87:   margin-top: .5em;
patrick@87:   background-color: #ffffdd;
patrick@125:   content: insert-before-button() insert-button() " Aide ";
patrick@87: }
patrick@87: 
patrick@87: help, help > *:before, help > * {
patrick@87:   background-color: #ffffdd;
patrick@87: }
patrick@87: 
patrick@87: /* answer ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: answer:before {
patrick@87:   margin-top: .5em;
patrick@87:   background-color: #eaffe9;
patrick@87:   content: insert-before-button() insert-button() " Réponse";
patrick@87: }
patrick@87: 
patrick@87: answer, answer > *:before, answer > * {
patrick@87:   background-color: #eaffe9;
patrick@87: }
patrick@87: 
patrick@87: answer:after {
patrick@87:   display: none;   
patrick@87: }
patrick@87: 
patrick@87: 
patrick@87: /* Block level ============================================================= */
patrick@87: 
Patrick@161: /* image ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
Patrick@161: 
Patrick@161: right image, wrong image, item image {
Patrick@161:   content: concatenate("image('Images/", attr(id), ".png', -128, -96, smooth)");
Patrick@161:   vertical-align: middle;
Patrick@161: }
Patrick@161: 
patrick@87: /* choices.right, choices.wrong ~~~~ */
patrick@87: 
patrick@87: choices-radio right:before, choices-radio wrong:before,
patrick@87: choices-check right:before, choices-check wrong:before {
patrick@87:   display: marker;
patrick@87:   content: insert-before-button(color, #7f7f7f, icon, icon(left-half-disc))
patrick@87:            insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@87: }
patrick@87: 
patrick@87: choices-radio right, choices-radio wrong,
patrick@87: choices-check right, choices-check wrong {
patrick@87:   display: block;
patrick@87:   margin-left: 24px;
patrick@87:   font-size: 115%;
patrick@87:   font-family: serif;
patrick@87: }
patrick@87: 
patrick@87: choices-radio > right:before {
patrick@87:   color: #7f7f7f;
patrick@87:   content: insert-before-button(icon, icon(left-half-disc))
patrick@87:            insert-after-button(icon, icon(right-half-disc))
patrick@87:            "  " icon(radio-on) " ";
patrick@87:     
patrick@87: }
patrick@87: choices-radio > wrong:before {
patrick@87:   color: #7f7f7f;
patrick@87:   content: insert-before-button( icon, icon(left-half-disc))
patrick@87:            insert-after-button(icon, icon(right-half-disc))
patrick@87:            "  " icon(radio-off) " ";
patrick@87:     
patrick@87: }
patrick@87: choices-check > right:before {
patrick@87:   color: #7f7f7f;
patrick@87:   content: insert-before-button(icon, icon(left-half-disc))
patrick@87:            insert-after-button(icon, icon(right-half-disc))
patrick@87:            command-button(command, "convert", parameter, "wrong", icon, icon(convert))
patrick@87:            "  " icon(check-on) " ";
patrick@87: }
patrick@87: choices-check > wrong:before {
patrick@87:   color: #7f7f7f;
patrick@87:   content: insert-before-button(icon, icon(left-half-disc))
patrick@87:            insert-after-button(icon, icon(right-half-disc))
patrick@87:            command-button(command, "convert", parameter, "right", icon, icon(convert))
patrick@87:            "  " icon(check-off) " ";
patrick@87: }
patrick@87: 
patrick@87: choices-radio > right, choices-radio > wrong {
patrick@87:   margin-left: 52px;
patrick@87: }
patrick@87: choices-check > right, choices-check > wrong {
patrick@108:   margin-left: 60px;
patrick@87: }
patrick@87: 
patrick@87: /* blanks.wrongs ~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: blanks-select > wrongs:before {
patrick@87:   color: #7f7f7f;
patrick@87:   content: "Intrus : ";
patrick@87: }
patrick@87: 
patrick@87: blanks-select > wrongs {
patrick@87:   display: block;
patrick@87:   margin: .5em 0 .5em 0;
patrick@87: }
patrick@87: 
patrick@87: wrongs > wrong {
patrick@87:   display: inline;
patrick@87:   background-color: #c7e0f8;
patrick@87: }
patrick@87: 
patrick@87: wrongs > wrong:after {
patrick@87:   color: #7f7f7f;
patrick@87:   content: "  –  ";
patrick@87:   background-color: transparent;
patrick@87: }
patrick@87: wrongs > wrong:after:last-child {
patrick@87:   content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@87: }
patrick@87: 
patrick@87: /* match ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: match:before {
patrick@87:   display: marker;
patrick@87:   color: #7f7f7f;
patrick@87:   content: insert-same-before-button(icon, icon(left-half-disc))
patrick@87:            insert-same-after-button(icon, icon(right-half-disc));
patrick@87: }
patrick@87: 
patrick@87: match {
patrick@87:   display: block;
patrick@87:   margin-left: 24px;
Patrick@161:   margin-bottom: .8em;
patrick@87: }
patrick@87: 
Patrick@161: match > item:before {
patrick@87:   display: none;
patrick@87: }
patrick@87: 
Patrick@161: match item {
patrick@87:   display: inline;
patrick@87: }
patrick@87: 
Patrick@161: match > item:first-child:after {
patrick@87:   color: #7f7f7f;
patrick@87:   content: " —>  ";
patrick@87: }
Patrick@161: match > item:last-child:after {
patrick@87:   display: none;
patrick@87: }
patrick@87: 
patrick@87: /* sort > comparison ~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: comparison:before {
patrick@87:   color: #7f7f7f;
patrick@87:   content: "Logique de comparaison : "
patrick@87: }
patrick@87: 
patrick@87: comparison {
patrick@87:   display: block;
patrick@87:   margin: .2em 0 .5em 0;
patrick@87: }
patrick@87: 
patrick@87: /* sort > item ~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: sort > item:before {
patrick@87:   color: #7f7f7f;
patrick@87:   content: insert-before-button(icon, icon(left-half-disc))
patrick@87:            text-field(attribute, "shuffle", columns, 1, font-size, 75%, color, black)
patrick@87:            " ";
patrick@87: }
patrick@87: 
patrick@87: sort > item {
patrick@87:   display: inline;
patrick@87: }
patrick@87: 
patrick@87: sort > item:after {
patrick@87:   color: #7f7f7f;
patrick@87:   content: insert-same-after-button(icon, icon(right-half-disc))
patrick@87:            " " xpath("../comparison") " ";
patrick@87: }
patrick@87: sort > item:last-child:after {
patrick@87:   content: insert-same-after-button(icon, icon(right-half-disc)) "\A";
patrick@87: }
patrick@87: 
patrick@125: /* category ~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@125: 
patrick@125: category {
patrick@125:   display: block;
patrick@125:   margin-bottom: .3em;
patrick@125: }
patrick@125: 
patrick@125: category > head {
patrick@125:   display: block;
patrick@125: }
patrick@125: 
patrick@125: category > item {
patrick@125:   margin-left: 1em;
Patrick@161:   margin-bottom: 0.8em;
patrick@125: }
patrick@125: 
patrick@125: category:after {
patrick@125:   color: #7f7f7f;
patrick@125:   content: "  " insert-same-after-button();
patrick@125: }
patrick@125: 
patrick@87: 
patrick@87: /* Inline level ============================================================ */
patrick@87: 
patrick@87: /* blank ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87: 
patrick@87: blank {
patrick@87:   background-color: #c0ffc0;
patrick@87: }
patrick@87: 
patrick@87: s:after {
patrick@87:   color:  #7f7f7f;
patrick@87:   background-color: transparent;
patrick@87:   content: insert-same-after-button(icon, icon(right-half-disc));
patrick@87: }
patrick@87: 
patrick@87: /* point.right & point.wrong ~~~~~~~ */
patrick@87: 
patrick@87: point right:before, point wrong:before {
patrick@87:   background: transparent;
patrick@87:   color: #7f7f7f;
patrick@87: }
patrick@87: point right:before {
patrick@87:   content: command-button(command, "convert", parameter, "wrong", icon, icon(convert));
patrick@87: }
patrick@87: point wrong:before {
patrick@87:   content: command-button(command, "convert", parameter, "right", icon, icon(convert));
patrick@87: }
patrick@87: 
patrick@87: point right {
patrick@87:   background-color: #c0ffc0;
patrick@87: }
patrick@87: 
patrick@87: point wrong {
patrick@87:   background-color: #c7e0f8;
patrick@87: }