MDL-46092 quiz nav: fix buttons in requiresgrading state
[moodle.git] / theme / bootstrapbase / less / moodle / modules.less
CommitLineData
8903b17b
BB
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
de2fec2e 12// Forum module
8bf57320 13
bfaee803
SH
14.path-mod-forum .forumsearch {
15 input,
16 .helptooltip {
17 margin: 0 3px;
18 }
19}
20
8903b17b
BB
21.path-mod-forum .forumheaderlist,
22.path-mod-forum .forumheaderlist td {
23 border: none;
24}
25
ebfb73db
AN
26.path-mod-forum {
27 .forumheaderlist {
28 thead .header,
29 tbody .discussion td {
8bf57320 30 white-space: normal;
ebfb73db
AN
31 vertical-align: top;
32 padding-left: 0.5em;
33 padding-right: 0.5em;
8bf57320 34 }
ebfb73db
AN
35
36 thead .header {
37 white-space: normal;
38 vertical-align: top;
39 }
40
41 thead .header.replies {
8bf57320
DM
42 text-align: center;
43 }
ebfb73db
AN
44 thead .header.lastpost {
45 text-align: right;
46 }
47 thead .header th,
48 tbody .discussion td{
49 &.discussionsubscription {
50 width: 16px;
51 padding-left: 0.5em;
52 padding-right: 0.5em;
53 }
54 }
55 .discussion {
56 .author, .replies, .lastpost {
57 white-space: normal;
58 }
59 .discussionsubscription,
60 .replies {
61 text-align: center;
62 }
63 .topic,
64 .discussionsubscription,
65 .topic.starter,
66 .picture,
67 .author,
68 .replies,
69 .lastpost {
70 vertical-align: top;
71 }
8bf57320
DM
72 }
73 }
74}
75
4c7a19ec 76.path-mod-feedback .feedback_bar_image {
2a8ab91c
AB
77 height: 5px; // we should remove the bar height specification in core
78}
79
8903b17b
BB
80.forumpost {
81 .well;
82 padding: 6px;
73c4e333
AB
83 .header {
84 margin-bottom: 3px;
85 }
cee8be63
JC
86 .picture img {
87 margin: 3px;
88 &.userpicture {
89 margin-left: 3px;
90 margin-right: 10px;
91 }
92 }
93 .content {
94 .posting.fullpost {
95 margin-top: 8px;
96 }
97 }
98 .row {
99 .topic,
100 .content-mask,
101 .options {
102 margin-left: 48px;
103 }
104 &.side {
105 clear: both;
106 }
107 }
108}
109
110.dir-rtl .forumpost {
111 .picture img {
112 &.userpicture {
113 margin-left: 10px;
114 margin-right: 3px;
115 }
116 }
117 .row {
118 .topic,
119 .content-mask,
120 .options {
121 margin-left: 0;
122 margin-right: 48px;
73c4e333
AB
123 }
124 }
8903b17b
BB
125}
126
127.forumpost .row .left {
cee8be63 128 width: 48px;
8903b17b
BB
129}
130
131.forumpost .options .commands {
132 margin-left: 0;
133}
134
135.forumpost .subject {
136 font-weight: bold;
137}
138
139// Override hardcoded forum modules styling
140.forumsearch input[type=text] {
141 margin-bottom: 0 !important;
142}
143
35620f63
SH
144#page-mod-forum-discuss .discussioncontrols {
145 width: auto;
146 margin: 0;
8903b17b
BB
147}
148
149#page-footer {
150 margin-top: 1em;
151 padding: 1em 0;
e514c722 152 border-top: 2px solid @tableBorder;
8903b17b
BB
153}
154
155.maincalendar .calendarmonth td,.maincalendar .calendarmonth th {
e514c722 156 border: 1px dotted @tableBorder;
8903b17b
BB
157}
158
159.path-grade-report-grader h1 {
160 text-align: inherit;
161}
162
163#page-mod-chat-gui_basic input#message {
164 max-width: 100%;
165}
166
167#page-mod-data-view #singleimage {
168 width: auto;
169}
170
171.path-mod-data form {
172 margin-top: 10px;
173}
174
175.template_heading {
176 margin-top: 10px;
177}
178
179.breadcrumb-button {
180 float: right;
3355b72e 181 margin-top: 4px;
8903b17b 182}
eef85081 183
41dcfbf1
MA
184.breadcrumb-button .singlebutton {
185 float: left;
186 margin-left: 4px;
187}
188
eef85081
NK
189.dir-rtl {
190 .nav-tabs > li,
191 .nav-pills > li {
192 float: right;
193 }
194}
8903b17b 195.dir-rtl .navbar .brand {
2af06c4c 196 padding: 10px 0 10px 20px;
8903b17b
BB
197 float: right;
198}
af9c2dcf 199
af9c2dcf
GB
200.navbar-inverse .logininfo a {
201 color: @navbarInverseLinkColor;
202}
203.navbar-inverse .logininfo a:hover {
204 background-color: @navbarInverseLinkBackgroundHover; // "transparent" is default to differentiate :hover/:focus from .active
205 color: @navbarInverseLinkColorHover;
8903b17b
BB
206}
207
208.navbar-fixed-top,
209.navbar-fixed-bottom {
58183f9b 210 z-index: 4030;
8903b17b
BB
211}
212
213.dir-rtl .breadcrumb-button,
214.dir-rtl .navbar .btn-navbar {
215 float: left;
216}
217
41dcfbf1
MA
218.dir-rtl .breadcrumb-button .singlebutton {
219 float: right;
220 margin-right: 4px;
b395f7b5 221 margin-left: 0;
222}
223.dir-rtl .breadcrumb-button .singlebutton div,
224.dir-rtl .breadcrumb-button .singlebutton div input[type="submit"] {
225 margin-right: 5px;
226 margin-left: 0;
41dcfbf1
MA
227}
228
8903b17b 229.ie .row-fluid .desktop-first-column {
58183f9b 230 margin-left: 0;
8903b17b
BB
231}
232.langmenu form {
233 margin: 0;
234}
235.container-fluid {
236 max-width: 1680px;
237 margin: 0 auto;
238}
239// contributed by Paul Hibbitts, see http://msdn.microsoft.com/en-us/library/ie/jj583807(v=vs.85).aspx
240canvas {
241 -ms-touch-action: auto;
242}
243
244div#dock {
245 display: none;
246}
247
de2fec2e
TH
248// Choice module
249
9184a2f7
AB
250.path-mod-choice {
251 .horizontal .choices {
252 margin: 0;
253 .option {
254 display: inline-block;
255 padding: 10px;
256 }
257 }
258 .results .data {
259 white-space: normal;
8903b17b
BB
260 }
261}
262
de2fec2e
TH
263// Lesson module
264
8903b17b
BB
265.path-mod-lesson .firstpageoptions {
266 margin: auto;
267 min-width: 280px;
268 width: 60%;
269}
01a96461
RW
270
271.path-mod-lesson .centerpadded {
272 padding: 5px;
273 text-align: center;
274}
876c0ac3 275
14cdc257
RW
276.path-mod-wiki .wiki_headingtitle,
277.path-mod-wiki .midpad,
278.path-mod-wiki .wiki_headingtime {
279 text-align: inherit;
876c0ac3 280}
14cdc257
RW
281
282.path-mod-wiki .wiki_contentbox {
283 width: 100%;
eef85081 284}
1765866f 285
a36f97f7
JC
286// Dropdown styling.
287.dropdown-menu {
288 > li > a {
289 padding: 3px 20px 3px 8px;
290 }
291}
292.dir-rtl .dropdown-menu {
293 > li > a {
294 padding: 3px 8px 3px 20px;
295 }
296}
297.dir-rtl .dropdown-submenu > .dropdown-menu {
298 .border-radius(6px 0px 6px 6px);
299}
300
301
1765866f
DM
302// Survey module
303
304.path-mod-survey {
305 .surveytable {
e514c722
FM
306 > tbody > tr:nth-of-type(odd) {background-color: @tableBackground;}
307 > tbody > tr:nth-of-type(even) {background-color: @tableBackgroundAccent;}
1765866f
DM
308 .rblock label {text-align: center;}
309 }
310 .resultgraph, .reportsummary, .studentreport, .reportbuttons, .centerpara {
311 text-align:center;
312 }
313}
b549e66e
AB
314// rtl overrides
315.dir-rtl {
8bb2d476 316 &.path-mod-forum .forumheaderlist {
b549e66e
AB
317 thead .header.lastpost {
318 text-align: left;
319 }
8bb2d476
JC
320 .discussion {
321 .lastpost {
322 text-align: left;
323 }
324 }
b549e66e 325 }
a36f97f7
JC
326}
327
328.nav .caret {
329 margin-left: 4px;
330}
331.dir-rtl .nav .caret {
332 margin-right: 4px;
ebfb73db 333}
d9640a99 334
328ef3df
JC
335// Dividers
336.nav {
337 .divider {
338 overflow: hidden;
339 width: 0;
d8d65e76
ME
340 height: @navbarHeight;
341 border-left: 1px solid @navbarBackground;
342 border-right: 1px solid @navbarBackgroundHighlight;
343 }
344}
345.navbar-inverse {
346 .nav {
347 .divider {
348 border-left-color: @navbarInverseBackground;
349 border-right-color: lighten(@navbarInverseBackground, 25%);
350 }
328ef3df
JC
351 }
352}
328ef3df
JC
353.dropdown-menu {
354 .divider {
355 width: auto;
356 height: 1px;
d8d65e76
ME
357 border-left: 0 none;
358 border-right: 0 none;
328ef3df 359 }
d9640a99 360}
6da0e4cf
JC
361
362// Usermenu
363.usermenu {
854a647e
JC
364 .login {
365 color: @navbarText;
366 line-height: 40px;
367 a {
f89a85f8
JC
368 color: @linkColor;
369 &:hover,
370 &:focus {
371 color: @linkColorHover;
372 text-decoration: underline;
373 }
854a647e
JC
374 }
375 }
f89a85f8
JC
376 .moodle-actionmenu {
377
378 .toggle-display {
6da0e4cf 379 display: block;
f89a85f8
JC
380 opacity: 1;
381 color: @navbarLinkColor;
382 line-height: 40px;
383 height: 40px;
384 &:hover {
385 color: @navbarLinkColorHover;
386 }
387
388 .userbutton {
389 height: 40px;
6da0e4cf 390 line-height: 40px;
f89a85f8
JC
391 .avatars{
392 display: inline-block;
393 height: 36px;
394 width: 36px;
395 vertical-align: middle;
396 margin-right: 6px;
397 margin-left: 6px;
398
399 .avatar,
400 img {
401 display: block;
402 }
403 }
404 .usertext {
405 display: inline-block;
406 vertical-align: middle;
407 line-height: 1em;
408 color: inherit;
409 .meta,
410 .role {
411 display: block;
412 font-size: 12px;
413 .value {
414 font-weight: bold;
415 }
416 }
417 .role {
418 font-weight: bold;
419 }
420 }
6da0e4cf 421 }
6da0e4cf 422
f89a85f8
JC
423 // Hide caret when JS is disabled.
424 .caret {
425 display: none;
6da0e4cf
JC
426 }
427 }
f89a85f8
JC
428
429
430 // A little bit of visual feedback for the action menu when Javascript is disabled.
431 .menu {
432 .menu-action.icon {
433 img {
434 border-radius: 0;
435 background: transparent;
436 box-shadow: none;
437 }
438 &:hover img {
439 background: #fff;
440 border-radius: 4px;
441 box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.125);
6da0e4cf
JC
442 }
443 }
6da0e4cf 444 }
f89a85f8
JC
445 &[data-enhanced] .menu {
446 .menu-action.icon,
447 .menu-action.icon:hover {
448 img {
449 border-radius: 0;
450 background: transparent;
451 box-shadow: none;
452 }
453 }
6da0e4cf 454 }
f89a85f8 455
6da0e4cf
JC
456 }
457}
f89a85f8 458.navbar-inverse {
854a647e
JC
459 .usermenu {
460 .login {
461 color: @navbarInverseText;
462 a {
463 color: @navbarInverseLinkColor;
464 &:hover {
465 color: @navbarInverseLinkColorHover;
466 }
467 }
468 }
f89a85f8
JC
469 .moodle-actionmenu {
470 .toggle-display {
471 color: @navbarInverseLinkColor;
472 }
473 .userbutton {
474 .usertext {
854a647e 475 color: @navbarInverseLinkColor;
f89a85f8
JC
476 .meta {
477 color: @navbarInverseText;
478 .value {
479 color: @navbarInverseLinkColor;
480 }
481 }
6da0e4cf
JC
482 }
483 }
f89a85f8
JC
484 &:hover {
485 .usertext {
486 color: @navbarInverseLinkColorHover;
487 .meta {
488 color: @navbarInverseText;
489 .value {
490 color: @navbarInverseLinkColorHover;
491 }
854a647e
JC
492 }
493 }
494 }
f89a85f8 495 &[data-enhanced] .toggle-display.textmenu {
854a647e
JC
496 .caret {
497 border-top-color: @navbarInverseLinkColorHover;
498 }
6da0e4cf 499 }
f89a85f8
JC
500
501 // A little bit of visual feedback for the action menu when Javascript is disabled.
502 .menu {
503 .menu-action.icon {
504 img {
505 border-radius: 0;
506 background: transparent;
507 box-shadow: none;
508 }
509 &:hover img {
510 background: #333;
511 border-radius: 4px;
512 box-shadow: 0px 0px 16px rgba(255, 255, 255, 1);
513 }
514 }
515 }
516 &[data-enhanced] .menu {
517 .menu-action.icon,
518 .menu-action.icon:hover {
519 img {
520 border-radius: 0;
521 background: transparent;
522 box-shadow: none;
523 }
524 }
525 }
6da0e4cf
JC
526 }
527 }
528}
f89a85f8
JC
529
530.jsenabled {
6da0e4cf 531 .usermenu {
f89a85f8
JC
532 .moodle-actionmenu {
533 .toggle-display {
534 display: block;
535
536 &.textmenu {
537 padding-left: 8px;
538 padding-right: 8px;
539 }
540
541 // Show caret when JS is enabled.
542 .caret {
543 display: inline-block;
544 position: relative;
545 top: 9px;
546 }
547 }
548
549 > .menubar {
550 display: block;
551 margin: 0px 0px 2px 0px;
552 }
553 > .menu {
554 min-width: 160px;
555 .filler {
556 display: block;
557 .nav-divider();
558 }
559 }
560
561 &.show {
562 background-color: @navbarLinkBackgroundActive;
563 .menu {
564 padding: 5px 0;
565 margin: 2px 0 0;
566 background-clip: padding-box;
567 &:before {
568 content: '';
569 display: inline-block;
570 border-left: 7px solid transparent;
571 border-right: 7px solid transparent;
572 border-bottom: 7px solid #ccc;
573 border-bottom-color: @dropdownBorder;
574 position: absolute;
575 top: -7px;
576 }
577 &:after {
578 content: '';
579 display: inline-block;
580 border-left: 6px solid transparent;
581 border-right: 6px solid transparent;
582 border-bottom: 6px solid @dropdownBackground;
583 position: absolute;
584 top: -6px;
585 }
586
587 a {
f89a85f8
JC
588 border-radius: 0;
589
8ef43cfd
JC
590 &:focus {
591 text-decoration: none;
592 }
f89a85f8 593 &:hover {
8ef43cfd 594 text-decoration: none;
f89a85f8
JC
595 #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
596 }
597 }
598 &.align-tr-br {
599 margin-top: 2px;
600 }
601 .box-shadow (0 5px 10px rgba(0, 0, 0, 0.2));
602 }
603 &:hover .toggle-display {}
604 }
6da0e4cf 605 }
f89a85f8
JC
606 }
607 .navbar-inverse {
608 .usermenu {
609 .moodle-actionmenu {
610
611 &.show {
612 background-color: @navbarInverseLinkBackgroundActive;
613 }
6da0e4cf
JC
614 }
615 }
f89a85f8
JC
616 }
617}
618
619.dir-ltr {
620 .usermenu {
621 float: right;
622 > .moodle-actionmenu {
623 > .menu {
624 &:before {
625 right: 9px;
626 }
627 &:after {
628 right: 10px;
629 }
630 }
631 > .menubar li a {
632 text-align: right;
633 }
6da0e4cf
JC
634 }
635 }
636 &.userloggedinas .usermenu .userbutton .avatars {
637 .avatar {
638 &.current {
f89a85f8 639 left: 16px;
6da0e4cf
JC
640 }
641 }
642 }
643}
644
645.dir-rtl {
646 .usermenu {
854a647e 647 float: left;
f89a85f8
JC
648 > .moodle-actionmenu {
649 > .menu {
650 margin-right: 0px;
651 &:before {
652 left: 9px;
653 }
654 &:after {
655 left: 10px;
656 }
657 }
658 > .menubar li a {
659 text-align: left;
6da0e4cf 660 }
6da0e4cf
JC
661 }
662 }
663 &.userloggedinas .usermenu .userbutton .avatars {
664 .avatar {
665 &.current {
f89a85f8 666 left: -14px;
6da0e4cf
JC
667 }
668 }
669 }
670}
f89a85f8
JC
671
672
673.userloggedinas .usermenu .userbutton .avatars {
674 .avatar {
675 &.current {
676 position: relative;
677 top: 4px;
678 left: 4px;
679 width: 20px;
680 height: 20px;
681 margin-top: 11px;
682 margin-bottom: -34px;
683 border: 1px solid #fff;
684 border-radius: 50%;
685 box-shadow: -2px -2px 16px rgba(0,0,0,0.25);
686 }
687 img {
688 width: inherit;
689 height: inherit;
690 }
691 overflow: hidden;
692 }
693}
de2fec2e
TH
694
695// Quiz module
696
697// Question navigation block.
698.path-mod-quiz #mod_quiz_navblock {
699 .qnbutton {
700 text-decoration: none;
701 font-size: 14px;
702 line-height: 20px;
703 font-weight: normal;
704 background-color: @white;
705 background-image: none;
706 height: 40px;
707 width: 30px;
708 border-radius: 3px;
709 border: 0;
710 overflow: visible;
711 margin: 0 6px 6px 0;
712 }
713 span.qnbutton {
714 cursor: default;
715 background-color: @inputDisabledBackground;
716 color: @gray;
717 }
718 a.qnbutton:hover,
719 a.qnbutton:active,
720 a.qnbutton:focus {
721 text-decoration: underline;
722 }
723
724 .qnbutton .thispageholder {
725 border: 1px solid;
726 border-radius: 3px;
727 z-index: 1;
728 }
729 .qnbutton.thispage .thispageholder {
730 border-width: 3px;
731 }
732 .allquestionsononepage .qnbutton.thispage .thispageholder {
733 border-width: 1px;
734 }
735
736 .qnbutton.flagged .thispageholder {
737 background: transparent url([[pix:theme|mod/quiz/flag-on]]) 15px 0px no-repeat;
738 }
739
740 .qnbutton .trafficlight {
741 border: 0;
742 background: @white none center/10px no-repeat scroll;
743 height: 20px;
744 margin-top: 20px;
745 border-radius: 0 0 3px 3px;
746 }
747
748 .qnbutton.notyetanswered .trafficlight,
749 .qnbutton.invalidanswer .trafficlight {
750 background-color: @white;
751 }
752 .qnbutton.invalidanswer .trafficlight {
753 background-image: url([[pix:theme|mod/quiz/warningtriangle]]);
754 }
755 .qnbutton.correct .trafficlight {
756 background-image: url([[pix:theme|mod/quiz/checkmark]]);
757 background-color: @successText;
758 }
759 .qnbutton.blocked .trafficlight {
760 background-image: url([[pix:core|t/locked]]);
761 background-color: @inputDisabledBackground;
762 }
763 .qnbutton.notanswered .trafficlight,
764 .qnbutton.incorrect .trafficlight {
765 background-color: @errorText;
766 }
767 .qnbutton.partiallycorrect .trafficlight {
768 background-image: url([[pix:theme|mod/quiz/whitecircle]]);
769 background-color: @orange;
770 }
771 .qnbutton.complete .trafficlight,
772 .qnbutton.answersaved .trafficlight,
05690639 773 .qnbutton.requiresgrading .trafficlight {
de2fec2e
TH
774 background-color: @grayLight;
775 }
776}