theme_bootstrap/less/moodle/question.less

/* Question */
.questionbank h2 {
    margin-top: 0;
}
.questioncategories h3 {
    margin-top: 0;
}
#chooseqtypebox {
    margin-top: 1em;
}
#chooseqtype h3 {
    margin: 0 0 0.3em;
}
#chooseqtype .instruction {
    display: none;
}
#chooseqtype .fakeqtypes {
    border-top: 1px solid silver;
}
#chooseqtype .qtypeoption {
    margin-bottom: 0.5em;
}
#chooseqtype label {
    display: block;
}
#chooseqtype .qtypename img {
    padding: 0 0.3em;
}
#chooseqtype .qtypename {
    display: inline-table;
    width: 16em;
}
#chooseqtype .qtypesummary {
    display: block;
    margin: 0 2em;
}
#chooseqtype .submitbuttons {
    margin: 0.7em 0;
    text-align: center;
}
#qtypechoicecontainer {
    display: none;
}
#qtypechoicecontainer_c.yui-panel-container.shadow .underlay {
    background: none;
}
#qtypechoicecontainer.yui-panel .hd {
    color: #333;
    letter-spacing: 1px;
    text-shadow: 1px 1px 1px #fff;
    .border-top-radius(10px);
    border: 1px solid #ccc;
    border-bottom: 1px solid #bbb;
    #gradient > .vertical(#fff, #ccc);
}
#qtypechoicecontainer {
    font-size: 12px;
    color: #333;
    background: #f2f2f2;
    border-radius: 10px;
    border: 1px solid #ccc;
    border-top: 0 none;
    box-shadow: 5px 5px 20px 0 #666;
}
#qtypechoicecontainer #chooseqtype {
    width: 40em;
}
#chooseqtypehead h3 {
    margin: 0;
    font-weight: normal;
}
#chooseqtype .qtypes {
    position: relative;
    border-bottom: 1px solid #bbb;
    padding: 0.24em 0;
}
#chooseqtype .alloptions {
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 400px;
    max-height: calc(100vh - 15em);
 /* The next line is a workaround because recess is crap. Delete ththe following line once
  * https://github.com/twitter/recess/issues/59 / https://github.com/twitter/recess/issues/75
  * is fixed. The previous line is the right one. */
    max-height: 60vh;
    width: 60%;
}
#chooseqtype .qtypeoption {
    margin-bottom: 0;
    padding: 0.3em 0.3em 0.3em 1.6em;
}
#chooseqtype .qtypeoption img {
    vertical-align: text-bottom;
    padding-left: 1em;
    padding-right: 0.5em;
}
#chooseqtype .selected {
    background-color: #fff;
    box-shadow: 0px 0 10px 0 #ccc;
}
#chooseqtype .instruction,
#chooseqtype .qtypesummary {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 60%;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 1.5em 1.6em;
    background-color: #fff;
    overflow-y: auto;
}
#chooseqtype .instruction,
#chooseqtype .selected .qtypesummary {
    display: block;
}
#categoryquestions {
    margin: 0;
}
#categoryquestions td,
#categoryquestions th {
    padding: 0 0.2em;
}
#categoryquestions th {
    text-align: left;
    font-weight: normal;
}
#categoryquestions .checkbox {
    padding-left: 20px;
}
.questionbank .singleselect {
    margin: 0;
}
/* Question editing form */
#combinedfeedbackhdr div.fhtmleditor {
    padding: 0;
}
#combinedfeedbackhdr div.fcheckbox {
    margin-bottom: 1em;
}
#multitriesheader div.fitem_feditor {
    margin-top: 1em;
}
#multitriesheader div.fitem_fgroup {
    margin-bottom: 1em;
}
#multitriesheader div.fitem_fgroup fieldset.felement label {
    margin-left: 0.3em;
    margin-right: 0.3em;
}
body.path-question-type .fitem_fgroup .accesshide {
    font: inherit;
    left: 0;
    position: static;
    padding-right: .3em;
}
.que {
    clear: left;
    text-align: left;
    margin: 0 auto 1.8em auto;
}
.que .info {
    float: left;
    width: 7em;
    padding: 0.5em;
    margin-bottom: 1.8em;
    background-color: @gray-lighter;
    border: 1px solid darken(spin(@gray-lighter, -10), 7%);
    border-radius: 2px;
}
.que h3.no {
    margin: 0;
    font-size: 0.8em;
    line-height: 1;
}
.que span.qno {
    font-size: 1.5em;
    font-weight: bold;
}
.que .info > div {
    font-size: 0.8em;
    margin-top: 0.7em;
}
.que .info .questionflag.editable {
    cursor: pointer;
}
.que .info .editquestion img,
.que .info .questionflag img,
.que .info .questionflag input {
    vertical-align: bottom;
}
.que .content {
    margin: 0 0 0 8.5em;
}
.que .formulation,
.que .outcome,
.que .comment {
    .alert
}
.que .formulation {
    .alert-info;
    color: @text-color;
}
.formulation input[type="text"],
.formulation select {
    width: auto;
}
.path-mod-quiz input[size] {
    width: auto;
}
.que .outcome {
}
.que .comment {
    .alert-success;
}
.que .history {
    .well
}
.que .ablock {
    margin: 0.7em 0 0.3em 0;
}
.que .im-controls {
    margin-top: 0.5em;
    text-align: left;
}
.que .specificfeedback,
.que .generalfeedback,
.que .rightanswer,
.que .im-feedback,
.que .feedback,
.que p {
    margin: 0 0 0.5em;
}
.que .qtext {
    margin-bottom: 1.5em;
}
.que .correctness {
    .label;
    &.correct {
        background-color: @label-success-bg;
    }
    &.partiallycorrect {
        background-color: @label-warning-bg;
    }
    &.notanswered,
    &.incorrect {
        background-color: @label-danger-bg;
    }
}
.que .validationerror {
    color: @state-danger-text;
}
// copied from .formFieldState in mixin.less
// and made more specific
.answerState(@text-color, @backgroundColor) {
    @borderColor: @text-color;
    color: @text-color;
    background-color: @backgroundColor;
    border-color: @borderColor;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075); // Redeclare so transitions work
    &:focus {
      border-color: darken(@borderColor, 10%);
      @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%);
      box-shadow: @shadow;
    }
}

.formulation .correct {
    background-color: @state-success-bg;
}
.formulation .partiallycorrect {
    background-color: @state-warning-bg;
}
.formulation .incorrect {
    background-color: @state-danger-bg;
}
.formulation select.correct,
.formulation input.correct {
  .answerState(@state-success-text, @state-success-bg);
}
.formulation select.partiallycorrect,
.formulation input.partiallycorrect {
  .answerState(@state-warning-text, @state-warning-bg);
}
.formulation select.incorrect,
.formulation input.incorrect {
  .answerState(@state-danger-text, @state-danger-bg);
}

.que .grading,
.que .comment,
.que .commentlink,
.que .history {
    margin-top: 0.5em;
}
.que .history h3 {
    margin: 0 0 0.2em;
    font-size: 1em;
}
.que .history table {
    width: 100%;
    margin: 0;
}
.que .history .current {
    font-weight: bold;
}
.que .questioncorrectnessicon {
    vertical-align: text-bottom;
}
.que input.questionflagimage {
    padding-right: 3px;
}
.importerror {
    margin-top: 10px;
    border-bottom: 1px solid #555;
}
.mform .que.comment .fitemtitle {
    width: 20%;
}
#page-question-preview #techinfo {
    margin: 1em 0;
}

// imported from quiz.css
#page-mod-quiz-edit .questionbankwindow div.header {
    color: #444;
    text-shadow: none;
    padding: 3px;
    .border-top-radius(4px);
    margin: 0 -10px 0 -10px;
    padding: 2px 10px 2px 10px;
    background: transparent; /* Old browsers */
}

#page-mod-quiz-edit .questionbankwindow div.header a:link,
#page-mod-quiz-edit .questionbankwindow div.header a:visited {
    color: @link-color;
}

#page-mod-quiz-edit .questionbankwindow div.header a:hover {
    color: @link-hover-color;
}

#page-mod-quiz-edit .questionbankwindow div.header .title {
    color: @text-color;
}

#page-mod-quiz-edit div.container div.generalbox {
    background-color: transparent;
    padding: 1.5em;
}

#page-mod-quiz-edit .categoryinfo {
    background-color: @body-bg;
    border-bottom: none;
}

#page-mod-quiz-edit div.questionbank .categoryquestionscontainer,
#page-mod-quiz-edit div.questionbank .categorysortopotionscontainer,
#page-mod-quiz-edit div.questionbank .categorypagingbarcontainer,
#page-mod-quiz-edit div.questionbank .categoryselectallcontainer {
    padding: 0 0 1.5em 0;
}

#page-mod-quiz-edit div.questionbank .categorypagingbarcontainer {
    padding: 1em;
    background-color: transparent;
    margin: 0 -1.2em;
    border-top: none;
    border-bottom: none;
}

#page-mod-quiz-edit div.questionbank .categoryquestionscontainer {
    margin: 0 -1.2em -1em -1.2em;
}
#page-mod-quiz-edit div.question div.content div.questioncontrols {
    background-color: @body-bg;
}
#page-mod-quiz-edit div.question div.content div.points {
    margin-top: -0.5em;
    padding-bottom: 0.5em;
    border: none;
    background-color: @body-bg;
}
#page-mod-quiz-edit div.question div.content div.points label {
    display: inline-block;
}

#page-mod-quiz-edit div.quizpage .pagecontent .pagestatus {
    background-color: @body-bg;
}

#page-mod-quiz-edit .quizpagedelete,
#page-mod-quiz-edit .quizpagedelete img {
    background-color: transparent;
}

#page-mod-quiz-edit div.quizpage .pagecontent {
    border: 1px solid #ddd;
    border-radius: 2px;
    overflow: hidden;
}

#page-mod-quiz-edit .modulespecificbuttonscontainer {
    width: 220px;
}

.questionbankwindow .module {
    width: auto;
}

#page-mod-quiz-edit div.editq div.question div.content {
    background-color: @body-bg;
    border: 1px solid #ddd;
    border-radius: 2px;
    overflow: hidden;
}

.path-mod-quiz .statedetails {
    display: block;
    font-size: 0.9em;
}

a#hidebankcmd {
    color: @link-color;
}

// override question plugins

// qtype_shortanswer

.que.shortanswer .answer {
    padding: 0;
}

.que label {
    display: inline;
}

/* Add a little padding to the answer sections of edit question forms. */
.path-question-type #id_answerhdr .fitem .fitemtitle,
.path-question-type #id_answerhdr .fitem .felement {
    margin-left: 6px;
    margin-right: 6px;
}
.path-question-type #id_answerhdr .fitem_feditor .felement {
    margin-left: 0px;
    margin-right: 0px;
}