MDL-56462 boost: Fix assign grading options form
[moodle.git] / mod / assign / styles.css
1 /* stylelint-disable max-line-length */
2 /* FIXME: MDL-55370: remove this stylelint disable */
3 .path-mod-assign div.gradingnavigation div {
4     float: left;
5     margin-left: 2em;
6 }
8 .path-mod-assign div.submissionstatustable,
9 .path-mod-assign div.submissionfull,
10 .path-mod-assign div.submissionlinks,
11 .path-mod-assign div.usersummary,
12 .path-mod-assign div.feedback,
13 .path-mod-assign div.gradingsummary {
14     margin-bottom: 5em;
15 }
17 .path-mod-assign div.submissionstatus .generaltable,
18 .path-mod-assign div.submissionlinks .generaltable,
19 .path-mod-assign div.feedback .generaltable,
20 .path-mod-assign div.submissionsummarytable .generaltable,
21 .path-mod-assign div.attempthistory table,
22 .path-mod-assign div.gradingsummary .generaltable {
23     width: 100%;
24 }
26 .path-mod-assign table.generaltable table td {
27     border: 0 none;
28 }
30 .path-mod-assign .gradingsummarytable,
31 .path-mod-assign .feedbacktable,
32 .path-mod-assign .lockedsubmission,
33 .path-mod-assign .submissionsummarytable {
34     margin-top: 1em;
35 }
37 .path-mod-assign div.submissionsummarytable table tbody tr td.c0 {
38     width: 30%;
39 }
41 .path-mod-assign .submittedlate {
42     color: red;
43     font-weight: 900;
44 }
46 .path-mod-assign.jsenabled .gradingoptionsform [type=submit] {
47     display: none;
48 }
50 .path-mod-assign.jsenabled .gradingtable .c1 select {
51     display: none;
52 }
54 .path-mod-assign .quickgradingform .mform fieldset {
55     margin: 0;
56     padding: 0;
57 }
59 .path-mod-assign .gradingbatchoperationsform .mform fieldset {
60     margin: 0;
61     padding: 0;
62 }
64 .path-mod-assign td.submissionstatus,
65 .path-mod-assign div.submissionstatus,
66 .path-mod-assign a:link.submissionstatus {
67     color: black;
68     background-color: #efefef;
69 }
71 .path-mod-assign td.submissionstatusdraft,
72 .path-mod-assign div.submissionstatusdraft,
73 .path-mod-assign a:link.submissionstatusdraft {
74     color: black;
75     background-color: #efefcf;
76 }
78 .path-mod-assign td.submissionstatussubmitted,
79 .path-mod-assign div.submissionstatussubmitted,
80 .path-mod-assign a:link.submissionstatussubmitted {
81     color: black;
82     background-color: #cfefcf;
83 }
85 .path-mod-assign td.submissionlocked,
86 .path-mod-assign div.submissionlocked {
87     color: black;
88     background-color: #efefcf;
89 }
91 .path-mod-assign td.submissionreopened,
92 .path-mod-assign div.submissionreopened {
93     color: black;
94     background-color: #efefef;
95 }
97 .path-mod-assign td.submissiongraded,
98 .path-mod-assign div.submissiongraded {
99     color: black;
100     background-color: #cfefcf;
103 .path-mod-assign td.submissionnotgraded,
104 .path-mod-assign div.submissionnotgraded {
105     color: black;
106     background-color: #efefef;
109 .path-mod-assign td.latesubmission,
110 .path-mod-assign a:link.latesubmission,
111 .path-mod-assign div.latesubmission {
112     color: black;
113     background-color: #efcfcf;
116 .path-mod-assign td.earlysubmission,
117 .path-mod-assign div.earlysubmission {
118     color: black;
119     background-color: #cfefcf;
122 .path-mod-assign .gradingtable .c0 {
123     display: none;
126 .path-mod-assign.jsenabled .gradingtable .c0 {
127     display: table-cell;
130 .path-mod-assign .gradingbatchoperationsform {
131     display: none;
134 .path-mod-assign.jsenabled .gradingbatchoperationsform {
135     display: block;
138 .path-mod-assign .gradingtable tr.selectedrow td {
139     background-color: #fec;
142 .path-mod-assign .gradingtable tr.unselectedrow td {
143     background-color: white;
146 .path-mod-assign .gradingtable .c0 div.selectall {
147     margin-left: 7px;
150 .path-mod-assign .gradingtable .yui3-menu ul {
151     margin: 0;
154 .path-mod-assign .gradingtable .yui3-menu-label {
155     padding-left: 0;
156     line-height: 12px;
159 .path-mod-assign .gradingtable .yui3-menu-label img {
160     padding: 0 3px;
163 .path-mod-assign .gradingtable .yui3-menu li {
164     list-style-type: none;
167 .path-mod-assign.jsenabled .gradingtable .yui3-loading {
168     display: none;
171 .path-mod-assign .gradingtable .yui3-menu .yui3-menu-content {
172     border: 0;
173     padding-top: 0;
176 .path-mod-assign div.gradingtable tr .quickgrademodified {
177     background-color: #fc9;
180 .path-mod-assign td.submissioneditable {
181     color: red;
184 .path-mod-assign .expandsummaryicon {
185     cursor: pointer;
186     display: none;
189 .path-mod-assign.jsenabled .expandsummaryicon {
190     display: inline;
193 .path-mod-assign .hidefull {
194     display: none;
197 .path-mod-assign .quickgradingform form .commentscontainer input,
198 .path-mod-assign .quickgradingform form .commentscontainer textarea {
199     display: none;
202 .path-mod-assign.jsenabled .quickgradingform form .commentscontainer input,
203 .path-mod-assign.jsenabled .quickgradingform form .commentscontainer textarea {
204     display: inline;
207 .path-mod-assign .previousfeedbackwarning {
208     font-size: 140%;
209     font-weight: bold;
210     text-align: center;
211     color: #500;
214 .path-mod-assign .submissionhistory {
215     background-color: #b0b0b0;
218 .path-mod-assign .submissionhistory .cell.historytitle {
219     background-color: #808080;
222 .path-mod-assign .submissionhistory .cell {
223     background-color: #d0d0d0;
226 .path-mod-assign.jsenabled .mod-assign-history-link {
227     display: block;
228     cursor: pointer;
229     margin-bottom: 7px;
232 .path-mod-assign.jsenabled .mod-assign-history-link h4 {
233     display: inline;
236 .path-mod-assign.jsenabled .attempthistory h4 {
237     margin-bottom: 7px;
238     text-align: left;
241 .path-mod-assign.jsenabled.dir_rtl .attempthistory h4 {
242     text-align: right;
245 .path-mod-assign.jsenabled .mod-assign-history-link-open {
246     padding: 0 5px 0 20px;
247     background: url([[pix:t/expanded]]) 2px center no-repeat;
250 .path-mod-assign.jsenabled .mod-assign-history-link-closed {
251     padding: 0 5px 0 20px;
252     background: url([[pix:t/collapsed]]) 2px center no-repeat;
255 /*rtl:raw:
256 .path-mod-assign.jsenabled .mod-assign-history-link-closed {
257     background-image: url([[pix:t/collapsed_rtl]]);
259 */
261 .path-mod-assign .submithelp {
262     padding: 1em;
265 .path-mod-assign .feedbacktitle {
266     font-weight: bold;
269 .path-mod-assign .submitconfirm,
270 .path-mod-assign .submissionlinks,
271 .path-mod-assign .submissionaction {
272     text-align: center;
275 .path-mod-assign .submissionsummarytable .c0,
276 .path-mod-assign .mod-assign-history-panel .c0 {
277     width: 150px;
280 .path-mod-assign .gradingtable .moodle-actionmenu {
281     white-space: nowrap;
284 .path-mod-assign .gradingtable .moodle-actionmenu[data-enhanced].show .menu a {
285     padding-left: 12px;
286     padding-right: 12px;
289 .path-mod-assign .gradingtable .menu-action img {
290     display: none;
293 .path-mod-assign .editsubmissionform input[name="submissionstatement"] {
294     vertical-align: top;
297 .path-mod-assign .editsubmissionform label[for="id_submissionstatement"] {
298     display: inline-block;
301 .path-mod-assign.layout-option-nonavbar {
302     padding-top: 0;
305 .path-mod-assign [data-region="user-selector"] select {
306     margin-bottom: 0;
309 .path-mod-assign [data-region="user-selector"] .alignment {
310     float: right;
311     width: 320px;
312     text-align: center;
313     margin-top: 7px;
316 .path-mod-assign [data-region="user-selector"] [data-action="previous-user"],
317 .path-mod-assign [data-region="user-selector"] [data-action="next-user"] {
318     font-size: 26px;
321 .path-mod-assign [data-region="user-selector"] [data-action="next-user"] {
322     margin-left: -10px;
325 .path-mod-assign [data-region="user-selector"] .alignment input {
326     margin-bottom: 5px;
329 .path-mod-assign [data-region="user-selector"] .alignment .form-autocomplete-downarrow {
330     top: 0;
333 .path-mod-assign [data-region="user-selector"] .form-autocomplete-selection {
334     display: none;
337 .path-mod-assign [data-region="user-selector"] .form-autocomplete-suggestions {
338     text-align: left;
341 .path-mod-assign [data-region="user-selector"] .form-autocomplete-suggestions {
342     margin-left: 48px;
345 .path-mod-assign [data-region="user-filters"] {
346     font-size: small;
349 .path-mod-assign [data-region="configure-filters"] {
350     display: none;
351     text-align: left;
352     width: auto;
353     background-color: #fff;
354     background-clip: padding-box;
355     box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
356     border-radius: 6px;
357     position: absolute;
358     margin-top: 28px;
359     margin-left: -140px;
360     padding: 10px 0;
361     z-index: 1;
364 .path-mod-assign [data-region="configure-filters"]::before,
365 .path-mod-assign [data-region="configure-filters"]::after {
366     position: absolute;
367     left: auto;
368     display: inline-block;
369     content: '';
370     border-style: solid;
371     border-color: transparent;
372     border-top: none;
375 .path-mod-assign [data-region="configure-filters"]::before {
376     top: -7px;
377     right: 12px;
378     border-width: 7px;
379     border-bottom-color: rgba(0, 0, 0, 0.2);
382 .path-mod-assign [data-region="configure-filters"]::after {
383     top: -6px;
384     right: 13px;
385     border-width: 6px;
386     border-bottom-color: #fff;
389 .path-mod-assign [data-region="configure-filters"] label {
390     padding: 3px 20px;
393 .path-mod-assign .alignment [data-region="configure-filters"] input {
394     margin-bottom: 0;
397 .path-mod-assign [data-region="grading-navigation-panel"] {
398     position: absolute;
399     top: 0;
400     left: 0;
401     width: 100%;
402     height: 6em;
403     margin: 0;
404     border-bottom: 1px solid #ddd;
407 .path-mod-assign [data-region="grading-navigation"] {
408     padding: 1em;
410 .path-mod-assign [data-region="assignment-info"] {
411     white-space: nowrap;
412     overflow-x: hidden;
413     text-overflow: ellipsis;
415 .path-mod-assign [data-region="assignment-info"] small[data-region="assignment-tooltip"] {
416     margin-left: 0.5em;
419 .path-mod-assign [data-region="user-info"] {
420     height: 60px;
423 .path-mod-assign [data-region="user-info"] a {
424     text-decoration: none;
427 .path-mod-assign [data-region="user-info"] .img-rounded {
428     display: block;
429     float: left;
430     margin-top: -3px;
431     margin-right: 10px;
434 .path-mod-assign [data-region="user-info"] em {
435     display: block;
436     font-style: normal;
439 .path-mod-assign [data-region="grading-actions-form"] label {
440     display: inline-block;
443 .path-mod-assign.pagelayout-embedded {
444     overflow: hidden;
447 .path-mod-assign [data-region="review-panel"] {
448     position: absolute;
449     top: 85px;
450     bottom: 60px;
451     left: 0;
452     right: 30%;
453     width: auto;
454     box-sizing: border-box;
455     -webkit-transition: right 0.5s, left 0.5s;
456     -moz-transition: right 0.5s, left 0.5s;
457     transition: right 0.5s, left 0.5s;
460 .path-mod-assign [data-region="review-panel"].grade-panel-collapsed {
461     right: 30px;
464 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] {
465     display: none;
466     height: 30px;
467     width: 30px;
468     position: absolute;
469     top: 0;
470     right: 0;
471     left: auto;
472     box-sizing: border-box;
473     border-radius: 0 0 0 4px;
474     border: 1px solid #ccc;
475     border-top: none;
476     background-color: #fff;
477     z-index: 99999;
480 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon,
481 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon {
482     width: 100%;
483     height: 100%;
484     text-align: center;
485     line-height: 30px;
488 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon .toggle-text,
489 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon .toggle-text {
490     visibility: hidden;
491     opacity: 0;
492     height: 0;
493     overflow: hidden;
496 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] img {
497     height: 100%;
498     float: right;
501 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon {
502     display: none;
505 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon {
506     display: block;
509 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon.full-width {
510     display: none;
513 .path-mod-assign [data-region="review-panel"] .pageheader {
514     border-right: 1px solid #ddd;
517 .path-mod-assign [data-region="review-panel"] + [data-region="grade-panel"] [data-region="grade"] {
518     margin-left: auto;
519     margin-right: auto;
520     max-width: 100%;
521     -webkit-transition: max-width 0.5s;
522     -moz-transition: max-width 0.5s;
523     transition: max-width 0.5s;
526 .path-mod-assign [data-region="review-panel"] .drawingregion {
527     left: 0;
528     right: 0;
529     border-color: #ddd;
532 .path-mod-assign [data-region="review-panel"].collapsed {
533     left: calc(30px - 70%);
534     right: calc(100% - 30px);
535     -webkit-transition: right 0.5s, left 0.5s;
536     -moz-transition: right 0.5s, left 0.5s;
537     transition: right 0.5s, left 0.5s;
540 .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-content"] {
541     visibility: hidden;
542     -webkit-transition: visibility 0 0.5s;
543     -moz-transition: visibility 0 0.5s;
544     transition: visibility 0 0.5s;
547 .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] .expand-icon {
548     display: block;
551 .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] .collapse-icon {
552     display: none;
555 .path-mod-assign [data-region="review-panel"].collapsed + [data-region="grade-panel"] {
556     position: absolute;
557     left: 30px;
558     right: 0;
559     width: calc(100% - 30px);
560     overflow: auto;
561     -webkit-transition: width 0.5s, right 0.5s, left 0.5s;
562     -moz-transition: width 0.5s, right 0.5s, left 0.5s;
563     transition: width 0.5s, right 0.5s, left 0.5s;
566 .path-mod-assign [data-region="review-panel"].collapsed + [data-region="grade-panel"] [data-region="grade"],
567 .path-mod-assign [data-region="grade-panel"].fullwidth [data-region="grade"] {
568     max-width: 800px;
569     margin-left: auto;
570     margin-right: auto;
573 .path-mod-assign [data-region="grade-panel"] {
574     position: absolute;
575     top: 85px;
576     bottom: 60px;
577     right: 0;
578     left: 70%;
579     width: 30%;
580     overflow: auto;
581     box-sizing: border-box;
582     background-color: #f5f5f5;
583     padding: 15px;
584     padding-top: 0;
585     -webkit-transition: width 0.5s, right 0.5s, left 0.5s;
586     -moz-transition: width 0.5s, right 0.5s, left 0.5s;
587     transition: width 0.5s, right 0.5s, left 0.5s;
590 .path-mod-assign [data-region="grade-panel"].collapsed {
591     left: calc(100% - 30px);
592     right: calc(30px - 100%);
593     visibility: hidden;
594     -webkit-transition: right 0.5s, left 0.5s, visibility 0 0.5s;
595     -moz-transition: right 0.5s, left 0.5s, visibility 0 0.5s;
596     transition: right 0.5s, left 0.5s, visibility 0 0.5s;
599 .path-mod-assign [data-region="grade-panel"].fullwidth {
600     left: 0;
601     width: 100%;
602     overflow: auto;
605 .path-mod-assign [data-region="grade-panel"] h3 {
606     font-size: 18px;
607     font-weight: 500;
610 /***** Start submission status *****/
612 .path-mod-assign [data-region="grade-panel"] div.submissionstatustable {
613     margin-bottom: 2em;
616 .path-mod-assign [data-region="grade-panel"] .submissionsummarytable {
617     margin-left: 5px;
618     margin-right: 5px;
621 .path-mod-assign [data-region="grade-panel"] .submissionsummarytable table.generaltable td {
622     padding: 8px 0;
623     background-color: transparent;
626 .path-mod-assign [data-region="grade-panel"] .submissionsummarytable .generaltable tbody > tr:nth-child(2n+1) > td,
627 .path-mod-assign [data-region="grade-panel"] .submissionsummarytable .generaltable tbody tr:hover > td {
628     background-color: transparent;
631 .path-mod-assign [data-region="grade-panel"] div.submissionsummarytable table tbody tr td.c0 {
632     width: auto;
635 .path-mod-assign [data-region="grade-panel"] div.submissionsummarytable table tbody tr.lastrow td.c0,
636 .path-mod-assign [data-region="grade-panel"] div.submissionsummarytable table tbody tr.lastrow td.c1 {
637     border-bottom: 1px solid #ddd;
640 .path-mod-assign [data-region="grade-panel"] td.submissionnotgraded,
641 .path-mod-assign [data-region="grade-panel"] div.submissionnotgraded {
642     color: red;
643     background-color: transparent;
646 /***** End submission status *****/
648 .path-mod-assign [data-region="grade-panel"] #id_gradeheader {
649     display: table-cell;
650     min-width: 0;
653 .path-mod-assign [data-region="grade-panel"] #id_gradeheader > legend {
654     visibility: hidden;
655     height: 0;
656     margin-bottom: 0;
659 .path-mod-assign [data-region="grade-panel"] .comment-area textarea[cols] {
660     width: 100%;
661     box-sizing: border-box;
664 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_ftext,
665 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_f,
666 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_feditor,
667 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_fgrading,
668 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_ffilemanager {
669     background-color: #fff;
670     border: 1px solid #ddd;
671     margin-bottom: 20px;
674 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_ftext .fitemtitle,
675 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_f .fitemtitle,
676 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_feditor .fitemtitle,
677 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_fgrading .fitemtitle,
678 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_ffilemanager .fitemtitle {
679     padding-left: 5px;
680     padding-right: 5px;
683 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_ftext .felement,
684 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_f .felement,
685 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_feditor .felement,
686 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_fgrading .felement,
687 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_ffilemanager .felement {
688     padding: 6px 10px 10px;
689     box-sizing: border-box;
692 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_ftext .fitemtitle,
693 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_f .fitemtitle,
694 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_feditor .fitemtitle,
695 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_fgrading .fitemtitle,
696 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_ffilemanager .fitemtitle {
697     border-bottom: 1px solid #ddd;
698     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
699     padding: 6px 10px 3px;
700     box-sizing: border-box;
703 .path-mod-assign #page-content [data-region="grade-panel"] [data-region="popout-button"] img {
704     margin-left: 2px;
705     margin-right: 2px;
706     margin-top: -2px;
709 .path-mod-assign #page-content [data-region="grade-panel"] .popout [data-region="popout-button"] img {
710     margin-left: -6px;
711     margin-right: -6px;
712     margin-top: 4px;
715 .path-mod-assign [data-region="grade-panel"] .fitem .fstaticlabel,
716 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem .fitemtitle label {
717     font-weight: 500;
720 /***** Start grade *****/
722 .path-mod-assign [data-region="grade-panel"] .mform #fitem_id_grade.fitem {
723     padding-top: 5px;
726 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #fitem_id_grade.fitem .fitemtitle {
727     display: inline-block;
728     width: auto;
729     border-bottom: none;
730     box-shadow: none;
733 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #fitem_id_grade.fitem .felement {
734     width: auto;
735     float: right;
738 .path-mod-assign #page-content .mform:not(.unresponsive) #fitem_id_grade.fitem .felement input {
739     width: 80px;
740     margin-bottom: 0;
743 /***** End grade *****/
745 /***** Start rubric *****/
747 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric {
748     padding-bottom: 0;
749     max-width: none;
752 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .description {
753     font-weight: 500;
754     min-width: 150px;
757 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .levels {
758     background-color: #fff;
761 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion,
762 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion.even {
763     background-color: transparent;
766 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric.evaluate .criterion .levels .level:hover {
767     background-color: #dff0d8;
770 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .levels .level.checked {
771     background-color: #dff0d8;
772     border: none;
773     border-left: 1px solid #ddd;
776 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .levels .level .score {
777     color: #468847;
778     font-weight: 500;
779     font-style: normal;
780     margin-top: 20px;
783 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .remark textarea {
784     margin-bottom: 0;
787 /***** End rubric *****/
789 /***** Start marking guide *****/
791 .path-mod-assign [data-region="grade-panel"] .gradingform_guide {
792     margin-bottom: 10px;
795 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .descriptionreadonly,
796 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .remark,
797 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .score {
798     display: block;
801 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .descriptionreadonly {
802     padding-top: 10px;
805 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .criteriondescription {
806     margin-top: 5px;
809 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .criteriondescriptionmarkers {
810     width: auto;
811     margin-top: 5px;
814 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .markingguideremark {
815     margin-bottom: 10px;
818 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .remark .commentchooser {
819     float: right;
820     margin-top: 2px;
821     margin-left: 0;
824 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .score {
825     float: left;
826     padding-bottom: 8px;
829 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .score input,
830 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .score div {
831     display: inline-block;
834 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .criterion,
835 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .criterion.even {
836     background-color: transparent;
837     border-width: 0 0 1px 0;
838     padding: 8px 0;
841 .path-mod-assign [data-region="grade-panel"] .showmarkerdesc,
842 .path-mod-assign [data-region="grade-panel"] .showstudentdesc {
843     background-color: #f5f5f5;
844     padding: 10px;
847 /***** End marking guide *****/
849 .path-mod-assign [data-region="grade-panel"] .fitem.fitem_ffilemanager {
850     margin-bottom: 0;
853 /***** Start popout dialogue *****/
855 .path-mod-assign [data-region="grade-panel"] .fitem.popout {
856     position: fixed;
857     left: 20%;
858     right: 20%;
859     top: 20%;
860     bottom: 20%;
861     z-index: 1000;
862     border: 1px solid rgba(0, 0, 0, 0.3);
863     border-radius: 6px;
864     box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
867 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.popout .fitemtitle {
868     text-align: center;
869     padding-left: 15px;
870     padding-right: 15px;
871     height: 45px;
874 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.popout .fitemtitle label {
875     font-size: 16px;
876     line-height: 30px;
879 .path-mod-assign #page-content [data-region="grade-panel"] [data-region="popout-button"] {
880     float: right;
883 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.popout .fitemtitle [data-region="popout-button"] img {
884     margin-top: -10px;
885     margin-right: -7px;
888 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.popout .felement {
889     padding: 10px 15px 15px;
890     height: calc(100% - 54px);
891     overflow: auto;
894 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.popout .felement .gradingform_rubric {
895     overflow: visible;
898 /***** End popout dialogue *****/
900 /***** Start attempt settings *****/
902 .path-mod-assign [data-region="grade-panel"] #id_attemptsettings > legend {
903     font-size: 18px;
904     font-weight: 500;
905     line-height: 40px;
906     border-bottom: 0;
907     margin-bottom: 10px;
910 .path-mod-assign [data-region="grade-panel"] #id_attemptsettings .fcontainer {
911     display: table;
912     width: 100%;
913     padding-left: 5px;
914     padding-right: 5px;
915     margin-bottom: 10px;
916     box-sizing: border-box;
919 .path-mod-assign [data-region="grade-panel"] .mform #id_attemptsettings .fitem {
920     display: table-row;
923 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem .fitemtitle,
924 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem .felement {
925     display: table-cell;
926     float: none;
927     border-top: 1px solid #ddd;
928     padding: 8px 0;
931 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem:last-of-type .fitemtitle,
932 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem:last-of-type .felement {
933     border-bottom: 1px solid #ddd;
936 .path-mod-assign [data-region="grade-panel"] #id_attemptsettings .fitem .fstaticlabel,
937 .path-mod-assign [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem .fitemtitle label {
938     font-weight: 400;
941 .path-mod-assign [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem .felement select {
942     margin-bottom: 0;
945 .path-mod-assign [data-region="grade-panel"] [data-region="attempt-chooser"] {
946     margin-bottom: 10px;
947     vertical-align: text-bottom;
950 /***** End attempt settings *****/
952 .path-mod-assign [data-region="grade-actions-panel"] {
953     border-top: 1px solid #ddd;
954     position: absolute;
955     bottom: 0;
956     left: 0;
957     width: 100%;
958     height: 60px;
961 /*rtl:ignore*/
962 .path-mod-assign [data-region="grade-actions-panel"] [data-region="grade-actions"] .collapse-buttons {
963     position: absolute;
964     top: 0;
965     left: auto;
966     right: 15px;
967     margin: 0;
968     height: 100%;
969     line-height: 60px;
972 .path-mod-assign [data-region="grade-actions"] {
973     padding: 1em;
974     text-align: center;
977 .path-mod-assign [data-region="submissions-list"] {
978     text-align: inherit;
981 .path-mod-assign [data-region="submissions-list"] label.radio input {
982     margin-top: 4px;
983     min-width: inherit;
986 .path-mod-assign [data-region="overlay"] {
987     display: none;
988     z-index: 100;
989     position: absolute;
990     top: 0;
991     left: 0;
992     width: 100%;
993     overflow: auto;
994     bottom: 0;
995     background-color: #ddd;
996     opacity: 0.4;
997     padding-top: 4em;
998     text-align: center;
1001 @media (max-width: 767px) {
1002     .path-mod-assign.pagelayout-embedded {
1003         overflow: auto;
1004     }
1006     .path-mod-assign [data-region="assignment-info"] {
1007         border-bottom: 1px solid #ddd;
1008         padding-bottom: 5px;
1009     }
1011     .path-mod-assign .page-context-header .page-header-headings {
1012         margin-top: 13px;
1013     }
1015     .path-mod-assign [data-region="grade-actions-panel"] [data-region="grade-actions"] .collapse-buttons {
1016         display: none;
1017     }
1019     .path-mod-assign [data-region="grading-navigation-panel"],
1020     .path-mod-assign [data-region="review-panel"],
1021     .path-mod-assign [data-region="grade-panel"],
1022     .path-mod-assign [data-region="review-panel"].collapsed + [data-region="grade-panel"],
1023     .path-mod-assign [data-region="grade-actions-panel"] {
1024         position: inherit;
1025         width: 100%;
1026         top: 0;
1027         left: 0;
1028         right: auto;
1029         overflow: auto;
1030         height: auto;
1031         margin-bottom: 1em;
1032     }
1034     .path-mod-assign [data-region="grade-panel"].collapsed {
1035         visibility: visible;
1036     }
1038     .path-mod-assign [data-region="grading-navigation"] {
1039         padding: 0;
1040         text-align: center;
1041     }
1043     .path-mod-assign [data-region="grade-panel"] {
1044         margin-bottom: 2em;
1045     }
1047     .path-mod-assign [data-region="grade-panel"] [data-region="popout-button"] {
1048         display: none;
1049     }
1051     .path-mod-assign [data-region="review-panel"] {
1052         position: relative;
1053         max-height: 2000px;
1054         -webkit-transition: max-height 0.25s linear;
1055         -moz-transition: max-height 0.25s linear;
1056         transition: max-height 0.25s linear;
1057     }
1059     .path-mod-assign [data-region="review-panel"] .pageheader {
1060         border-right: none;
1061         padding-right: 20px;
1062         padding-left: 40px;
1063     }
1065     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] {
1066         display: block;
1067         height: 20px;
1068         width: 20px;
1069         position: absolute;
1070         top: 0;
1071         left: 0;
1072         right: auto;
1073         box-sizing: border-box;
1074         border: 1px solid #ccc;
1075         border-radius: 0 0 4px 0;
1076         background-color: #fff;
1077         z-index: 99999;
1078     }
1080     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon,
1081     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon {
1082         width: 100%;
1083         height: 100%;
1084         text-align: center;
1085         line-height: 30px;
1086     }
1088     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .ltr-icon,
1089     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .rtl-icon {
1090         height: 100%;
1091     }
1093     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .ltr-icon {
1094         float: left;
1095     }
1097     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .rtl-icon {
1098         float: right;
1099     }
1101     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon .toggle-text,
1102     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon .toggle-text {
1103         line-height: 20px;
1104         visibility: visible;
1105         opacity: 1;
1106         height: auto;
1107         -webkit-transition: visibility 0 0.25s, opacity 0 0.25s;
1108         -moz-transition: visibility 0 0.25s, opacity 0 0.25s;
1109         transition: visibility 0 0.25s, opacity 0 0.25s;
1110     }
1112     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon .rtl-icon {
1113         display: none;
1114     }
1116     .path-mod-assign [data-region="review-panel"].collapsed {
1117         max-height: 20px;
1118         top: 0;
1119         left: 0;
1120         overflow: hidden;
1121         -webkit-transition: max-height 0.25s linear;
1122         -moz-transition: max-height 0.25s linear;
1123         transition: max-height 0.25s linear;
1124     }
1126     .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] {
1127         width: 100%;
1128         border-radius: 0 0 0 0;
1129         -webkit-transition: all 0 0.25s;
1130         -moz-transition: all 0 0.25s;
1131         transition: all 0 0.25s;
1132     }
1134     .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] img {
1135         height: 100%;
1136     }
1138     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon {
1139         display: block;
1140     }
1142     .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] .collapse-icon {
1143         display: none;
1144     }
1146     .path-mod-assign.pagelayout-popup {
1147         overflow: inherit;
1148     }
1150     .path-mod-assign [data-region="grading-navigation"] [data-region="user-info"] {
1151         text-align: left;
1152         width: auto;
1153         display: inline-block;
1154         margin: 0 auto;
1155     }
1157     .path-mod-assign [data-region="user-selector"] .alignment {
1158         float: none;
1159         margin: 0 auto 10px;
1160     }
1163 /** Start of CSS to make forms vertical in the grading panel (taken from theme/bootstrapbase/less/moodle/forms.less). */
1165 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fitemtitle {
1166     display: block;
1167     margin-top: 4px;
1168     margin-bottom: 4px;
1169     text-align: left;
1170     width: 100%;
1173 .path-mod-assign [data-region="grade-panel"] .mform .fitem .felement {
1174     margin-left: 0;
1175     width: 100%;
1176     float: left;
1177     padding-left: 0;
1178     padding-right: 0;
1181 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fstatic:empty {
1182     display: none;
1185 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fcheckbox > span,
1186 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fradio > span,
1187 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fgroup > span {
1188     margin-top: 4px;
1191 .path-mod-assign [data-region="grade-panel"] .mform .femptylabel .fitemtitle {
1192     display: inline-block;
1193     width: auto;
1194     margin-right: 8px;
1197 .path-mod-assign [data-region="grade-panel"] .mform .femptylabel .felement {
1198     display: inline-block;
1199     margin-top: 4px;
1200     padding-top: 5px;
1201     width: auto;
1204 .path-mod-assign [data-region="grade-panel"] .mform .fitem_fcheckbox .fitemtitle,
1205 .path-mod-assign [data-region="grade-panel"] .mform .fitem_fcheckbox .felement {
1206     display: inline-block;
1207     width: auto;
1210 .path-mod-assign [data-region="grade-panel"] .mform .fitem_fcheckbox .felement {
1211     padding: 6px;
1214 /** End of CSS to make forms vertical in the grading panel (taken from theme/bootstrapbase/less/moodle/forms.less). */
1216 /** Styles to fix base theme **/
1217 .path-mod-assign #page,
1218 .path-mod-assign #page-content {
1219     position: inherit;
1221 /** End of base fixes **/