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