MDL-56197 lesson: Multichoice answers not on same line as radio button
[moodle.git] / theme / boost / scss / moodle / modules.scss
CommitLineData
536f0460
DW
1/* modules.less */
2
3// The home for small tweaks to modules that don't require
4// changes drastic enough to pull in the full module css
5// and replace it completely
6// Plus some misc. odds and ends
7
8select {
9 width: auto;
10}
11
1d6964dc
TL
12// Choice module
13
14.path-mod-choice {
15 .horizontal .choices .option {
16 display: inline-block;
17 }
18}
19
50302c40
DW
20.path-mod-feedback .feedback_form .col-form-label {
21 display: block !important; /* stylelint-disable-line declaration-no-important */
22}
f25185d7 23
63e4df60 24// Feedback module
ba5c5083
DW
25.path-mod-feedback .itemactions {
26 float: right;
27}
a5d4b548
DW
28.path-mod-feedback .itemhandle {
29 position: absolute;
30 right: 1rem;
31}
ba5c5083 32
536f0460
DW
33// Forum module
34
35.path-mod-forum .forumsearch {
36 input,
37 .helptooltip {
38 margin: 0 3px;
39 }
40}
41
42.path-mod-forum .forumheaderlist,
43.path-mod-forum .forumheaderlist td {
44 border: none;
45}
46
47.path-mod-forum {
48 .forumheaderlist {
49 thead .header,
50 tbody .discussion td {
51 white-space: normal;
52 vertical-align: top;
53 padding-left: 0.5em;
54 padding-right: 0.5em;
55 }
56
57 thead .header {
58 white-space: normal;
59 vertical-align: top;
60 }
61
62 thead .header.replies {
63 text-align: center;
64 }
f4143537 65
536f0460
DW
66 thead .header.lastpost {
67 text-align: right;
68 }
f4143537 69
536f0460 70 thead .header th,
f4143537 71 tbody .discussion td {
536f0460
DW
72 &.discussionsubscription {
73 width: 16px;
74 padding-left: 0.5em;
75 padding-right: 0.5em;
76 }
77 }
f4143537 78
536f0460 79 .discussion {
f4143537
DP
80 .author,
81 .replies,
82 .lastpost {
536f0460
DW
83 white-space: normal;
84 }
f4143537 85
536f0460
DW
86 .discussionsubscription,
87 .replies {
88 text-align: center;
89 }
f4143537 90
536f0460
DW
91 .topic,
92 .discussionsubscription,
93 .topic.starter,
94 .picture,
95 .author,
96 .replies,
97 .lastpost {
98 vertical-align: top;
99 }
100 }
101 }
01dc1c11
JP
102
103 // Style for the forum subscription mode node.
104 .subscriptionmode {
105 color: $body-color;
106 }
107
108 // Style for the currently selected subscription mode.
109 .activesetting {
110 color: $body-color;
111 font-weight: bold;
112 }
536f0460
DW
113}
114
115.forumpost {
116 @extend .card;
117 padding: 6px;
f4143537 118
536f0460
DW
119 .header {
120 margin-bottom: 3px;
121 }
f4143537 122
536f0460
DW
123 .picture img {
124 margin: 3px;
f4143537 125
536f0460
DW
126 &.userpicture {
127 margin-left: 3px;
128 margin-right: 10px;
129 }
130 }
f4143537 131
536f0460
DW
132 .content {
133 .posting.fullpost {
134 margin-top: 8px;
135 }
136 }
f4143537 137
536f0460
DW
138 .row {
139 .topic,
140 .content-mask,
141 .options {
142 margin-left: 48px;
143 }
f4143537 144
536f0460
DW
145 &.side {
146 clear: both;
147 }
148 }
149}
150
151.forumpost .row .left {
152 width: 48px;
153}
154
155.forumpost .options .commands {
156 margin-left: 0;
157}
158
159.forumpost .subject {
160 font-weight: bold;
161}
162
163// Override hardcoded forum modules styling
164.forumsearch input[type=text] {
5142f564 165 margin-bottom: 0;
536f0460
DW
166}
167
168#page-mod-forum-discuss .discussioncontrols {
169 width: auto;
170 margin: 0;
7d41ccf0
DW
171
172 .form-inline input {
173 margin-top: -1px;
174 }
536f0460
DW
175}
176
f4143537
DP
177.maincalendar .calendarmonth td,
178.maincalendar .calendarmonth th {
536f0460
DW
179 border: 1px dotted $table-border-color;
180}
181
182.path-grade-report-grader h1 {
183 text-align: inherit;
184}
185
186#page-mod-chat-gui_basic input#message {
187 max-width: 100%;
188}
189
190#page-mod-data-view #singleimage {
191 width: auto;
192}
193
194.path-mod-data form {
195 margin-top: 10px;
196}
197
198.template_heading {
199 margin-top: 10px;
200}
201
202.breadcrumb-button {
536f0460
DW
203 margin-top: 4px;
204}
205
206.breadcrumb-button .singlebutton {
207 float: left;
208 margin-left: 4px;
209}
210
211.navbar-fixed-top,
212.navbar-fixed-bottom {
213 z-index: 4030;
214}
215
216.ie .row-fluid .desktop-first-column {
217 margin-left: 0;
218}
f4143537 219
536f0460
DW
220.langmenu form {
221 margin: 0;
222}
536f0460
DW
223// contributed by Paul Hibbitts, see http://msdn.microsoft@mixin com/en-us/library/ie/jj583807(v=vs.85).aspx
224canvas {
225 -ms-touch-action: auto;
226}
227
228div#dock {
229 display: none;
230}
231
232// Choice module
233
536f0460
DW
234// Lesson module
235
63e4df60 236/** General styles (scope: all of lesson) **/
f4143537
DP
237.path-mod-lesson .invisiblefieldset.fieldsetfix {
238 display: block;
239}
83b9a7c8
MG
240.path-mod-lesson .answeroption .checkbox label p {
241 display: inline;
242}
536f0460
DW
243
244.path-mod-wiki .wiki_headingtitle,
245.path-mod-wiki .midpad,
246.path-mod-wiki .wiki_headingtime {
247 text-align: inherit;
248}
249
250.path-mod-wiki .wiki_contentbox {
251 width: 100%;
252}
253
137c289a
FM
254// Dropdown styling.
255.dropdown-menu {
256 margin-top: 11px;
257}
258
536f0460
DW
259// Survey module
260
261.path-mod-survey {
262 .surveytable {
f4143537
DP
263 > tbody > tr:nth-of-type(odd) {
264 background-color: $table-bg;
265 }
266
267 > tbody > tr:nth-of-type(even) {
268 background-color: $table-bg-accent;
269 }
270
271 .rblock label {
272 text-align: center;
273 }
536f0460 274 }
f4143537 275
536f0460
DW
276}
277
278.nav .caret {
279 margin-left: 4px;
280}
281
282// Dividers
283.nav {
284 .divider {
285 overflow: hidden;
286 width: 0;
536f0460
DW
287 }
288}
536f0460
DW
289
290// Usermenu
291.usermenu {
7001a3b2
FM
292 float: right;
293
536f0460 294 .login {
5f18da12 295 line-height: 2.25rem;
f4143537 296
536f0460 297 a {
5f18da12 298 color: $link-color;
536f0460
DW
299 &:hover,
300 &:focus {
5f18da12 301 color: $link-hover-color;
536f0460
DW
302 text-decoration: underline;
303 }
304 }
305 }
3313fdd6 306}
f4143537 307
7001a3b2 308.userloggedinas,
45cd101f
SL
309.userswitchedrole,
310.loginfailures {
536f0460 311 .usermenu {
7001a3b2
FM
312 .usertext {
313 float: left;
314 text-align: right;
315 margin-right: $spacer / 2;
316 height: 35px;
317 .meta {
536f0460 318 display: block;
7001a3b2 319 font-size: $font-size-sm;
536f0460 320 }
7001a3b2
FM
321 }
322 .avatar {
323 img {
fde35b8f 324 margin: 0;
536f0460 325 }
536f0460
DW
326 }
327 }
328}
329
7001a3b2
FM
330.userloggedinas .usermenu {
331 .userbutton .avatars {
332 position: relative;
333 display: inline-block;
334 .avatar {
335 &.current {
336 display: inline-block;
337 position: absolute;
338 bottom: 0;
339 right: 0;
340 width: 20px;
341 height: 20px;
342 border-radius: 50%;
343 img {
344 vertical-align: baseline;
345 }
536f0460 346 }
7001a3b2
FM
347 img {
348 width: inherit;
349 height: inherit;
536f0460
DW
350 }
351 }
7001a3b2
FM
352 .realuser {
353 width: 35px;
354 height: 35px;
355 display: inline-block;
536f0460
DW
356 }
357 }
358}
359
7001a3b2
FM
360@include media-breakpoint-down(sm) {
361 .usertext {
362 display: none;
536f0460
DW
363 }
364}
365
366// Quiz module
12d6dfc1
DW
367.path-mod-quiz .mod-quiz-edit-content {
368 // Force the quiz edit page to always be large enough to prevent scrolling when accessing the menu.
369 margin-bottom: 10rem;
370}
371
372#page-mod-quiz-mod #id_reviewoptionshdr .col-md-3,
373#page-mod-quiz-mod #id_reviewoptionshdr .col-md-9 {
374 width: auto;
375}
376#page-mod-quiz-mod #id_reviewoptionshdr .form-group {
377 float: left;
378 width: 20rem;
379 display: inline-block;
e283c6ca 380 min-height: 12rem;
12d6dfc1
DW
381}
382
383#page-mod-quiz-mod #id_reviewoptionshdr .btn-link {
384 line-height: 1.5;
385 vertical-align: bottom;
386}
387#page-mod-quiz-mod #id_reviewoptionshdr .form-inline {
388 float: left;
389 clear: left;
390}
e283c6ca 391#page-mod-quiz-mod #id_reviewoptionshdr .form-check {
12d6dfc1
DW
392 width: 90%;
393 height: 22px;
394}
536f0460
DW
395
396// Question navigation block.
397.path-mod-quiz #mod_quiz_navblock {
398 .qnbutton {
399 text-decoration: none;
400 font-size: 14px;
401 line-height: 20px;
402 font-weight: normal;
12d6dfc1 403 background-color: $card-bg;
536f0460
DW
404 background-image: none;
405 height: 40px;
406 width: 30px;
407 border-radius: 3px;
408 border: 0;
409 overflow: visible;
410 margin: 0 6px 6px 0;
411 }
f4143537 412
536f0460
DW
413 span.qnbutton {
414 cursor: default;
415 background-color: $input-bg-disabled;
416 color: $gray;
417 }
f4143537 418
536f0460
DW
419 a.qnbutton:hover,
420 a.qnbutton:active,
421 a.qnbutton:focus {
422 text-decoration: underline;
423 }
424
425 .qnbutton .thispageholder {
426 border: 1px solid;
427 border-radius: 3px;
428 z-index: 1;
429 }
f4143537 430
536f0460
DW
431 .qnbutton.thispage .thispageholder {
432 border-width: 3px;
433 }
f4143537 434
536f0460
DW
435 .allquestionsononepage .qnbutton.thispage .thispageholder {
436 border-width: 1px;
437 }
438
439 .qnbutton.flagged .thispageholder {
fde35b8f 440 background: transparent url([[pix:theme|mod/quiz/flag-on]]) 15px 0 no-repeat;
536f0460
DW
441 }
442
443 .qnbutton .trafficlight {
444 border: 0;
12d6dfc1 445 background: $card-bg none center / 10px no-repeat scroll;
536f0460
DW
446 height: 20px;
447 margin-top: 20px;
448 border-radius: 0 0 3px 3px;
449 }
450
451 .qnbutton.notyetanswered .trafficlight,
452 .qnbutton.invalidanswer .trafficlight {
12d6dfc1 453 background-color: $card-bg;
536f0460 454 }
f4143537 455
536f0460
DW
456 .qnbutton.invalidanswer .trafficlight {
457 background-image: url([[pix:theme|mod/quiz/warningtriangle]]);
458 }
f4143537 459
536f0460
DW
460 .qnbutton.correct .trafficlight {
461 background-image: url([[pix:theme|mod/quiz/checkmark]]);
462 background-color: $state-success-text;
463 }
f4143537 464
536f0460
DW
465 .qnbutton.blocked .trafficlight {
466 background-image: url([[pix:core|t/locked]]);
467 background-color: $input-bg-disabled;
468 }
f4143537 469
536f0460
DW
470 .qnbutton.notanswered .trafficlight,
471 .qnbutton.incorrect .trafficlight {
472 background-color: $state-danger-text;
473 }
f4143537 474
536f0460
DW
475 .qnbutton.partiallycorrect .trafficlight {
476 background-image: url([[pix:theme|mod/quiz/whitecircle]]);
477 background-color: $state-warning-text;
478 }
f4143537 479
536f0460
DW
480 .qnbutton.complete .trafficlight,
481 .qnbutton.answersaved .trafficlight,
482 .qnbutton.requiresgrading .trafficlight {
483 background-color: $gray-light;
484 }
485}
bffc0ef1 486
21a5c3c4
DW
487
488// Assign.
bffc0ef1
FM
489.path-mod-assign [data-region="grade-actions-panel"] [data-region="grade-actions"] .collapse-buttons {
490 top: auto;
491}
ba5c5083
DW
492.path-mod-assign .no-overflow {
493 overflow: initial;
494}
f4143537 495
21a5c3c4
DW
496// This section removes the responsiveness from the form in the grading panel
497$popout-header-font-size: 1.5 * $font-size-base;
498// This can't be calculated from modal-title-padding because we are mixing px and rem units.
499$popout-header-height: 4rem;
f4143537 500
21a5c3c4
DW
501.path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.popout .felement {
502 height: calc(100% - #{$popout-header-height});
503}
504
505.path-mod-assign [data-region="grade-panel"] {
506 padding-top: $spacer;
507}
508.path-mod-assign [data-region="grade-panel"] .fitem > .col-md-3,
509.path-mod-assign [data-region="grade-panel"] .fitem > .col-md-9 {
510 width: 100%;
511 padding: 0;
512}
513.path-mod-assign [data-region="grade-panel"] fieldset,
514.path-mod-assign [data-region="grade-panel"] .fitem.row {
515 margin: 0;
516}
517
518.path-mod-assign [data-region="grade-panel"] .fitem > .col-md-3 > .pull-xs-right {
519 float: none !important; /* stylelint-disable-line declaration-no-important */
520}
521
522.path-mod-assign [data-region="grade-panel"] .mform .fitem.has-popout .felement {
523 width: 100%;
63e4df60 524}
f4143537 525
21a5c3c4
DW
526.path-mod-assign [data-region="grade-panel"] .mform .fitem .felement {
527 width: auto;
528}
529
530// Now styles for the popout sections.
531
63e4df60
DW
532.path-mod-assign [data-region="grade-panel"] .popout {
533 background-color: $modal-content-bg;
534}
f4143537 535
21a5c3c4
DW
536.path-mod-assign [data-region="grade-panel"] .fitem.has-popout {
537 background-color: $card-bg;
538 @include border-radius($card-border-radius);
539 border: $card-border-width solid $card-border-color;
540 padding: $card-spacer-x;
541 margin-bottom: $spacer;
542}
543.path-mod-assign [data-region="grade-panel"] .has-popout .col-md-3 {
544 border-bottom: $hr-border-width solid $hr-border-color;
545 margin-bottom: $spacer;
63e4df60 546}
f4143537 547
21a5c3c4 548
63e4df60
DW
549.path-mod-assign [data-region="grade-panel"] .popout > .col-md-3 {
550 @extend .modal-header;
21a5c3c4 551 font-size: $popout-header-font-size;
63e4df60 552}
f4143537 553
63e4df60
DW
554.path-mod-assign [data-region="grade-panel"] .popout [data-region="popout-button"] {
555 margin-top: 0;
556}
f4143537 557
21a5c3c4 558// Now style the fixed header elements.
f4143537 559
ba5c5083
DW
560.path-mod-assign [data-region="assignment-info"] {
561 overflow-y: hidden;
562}
563
bffc0ef1
FM
564.path-mod-assign [data-region="grading-navigation"] {
565 padding: 6px;
566}
f4143537 567
bffc0ef1
FM
568.path-mod-assign [data-region="grade-actions"] {
569 padding: 10px;
570}
f4143537 571
bffc0ef1
FM
572.path-mod-assign [data-region="user-info"] .img-rounded {
573 margin-top: 0;
574}
f4143537 575
bffc0ef1
FM
576.path-mod-assign [data-region="grading-navigation-panel"] {
577 height: 85px;
578}
f4143537 579
21a5c3c4
DW
580@media (max-width: 767px) {
581 .path-mod-assign [data-region="grading-navigation-panel"] {
582 height: auto;
583 }
584 .path-mod-assign [data-region="user-info"] {
585 margin-top: 1rem;
586 }
587}
588
bffc0ef1
FM
589.path-mod-assign [data-region="grading-navigation"] [data-region="input-field"] input {
590 width: auto;
591 display: inline-block;
592}
593
594/**
595 * Assign feedback.
596 */
597.assignfeedback_editpdf_widget * {
598 box-sizing: content-box;
599}
f4143537 600
bffc0ef1
FM
601.assignfeedback_editpdf_widget button {
602 box-sizing: border-box;
603}
f4143537 604
bffc0ef1
FM
605.assignfeedback_editpdf_widget .commentcolourbutton img {
606 border-width: 0;
607}
f4143537 608
bffc0ef1
FM
609.assignfeedback_editpdf_widget .label {
610 @extend .tag;
611 @extend .tag-info;
612}
613
614.assignfeedback_editpdf_menu {
615 padding: 0;
616}
63e4df60 617
a5112298
DW
618.path-mod-assign [data-region="grade-panel"] .gradingform_guide .remark .commentchooser {
619 float: none;
620}
621.path-mod-assign [data-region="grade-panel"] .gradingform_guide .markingguideremark {
622 width: 100%;
623}
624.path-mod-assign [data-region="grade-panel"] .mform .fitem .felement[data-fieldtype="grading"] {
625 padding-left: $spacer;
626 padding-right: $spacer;
627}
628.path-mod-assign [data-region="grade-panel"] .showmarkerdesc,
629.path-mod-assign [data-region="grade-panel"] .showstudentdesc {
630 background-color: $card-bg;
631}
3d979f96
FM
632
633/**
634 * Mod LTI.
635 */
636.path-admin-mod-lti {
637 .btn .loader img,
638 #tool-list-loader-container .loader img {
639 height: auto;
640 }
641}