Proyectos de Subversion Moodle

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 efrain 1
// The class gradetreebox matches the pages displaying the gradebook
2
// "Gradebook setup" > "Simple view" and "Full view".
3
.gradetreebox {
4
 
5
    h4 {
6
        // Force back the base font-size to minimise width.
7
        font-size: $font-size-base;
8
 
9
        .icon {
10
            .theme-dark & {
11
                filter: invert(1);
12
            }
13
        }
14
    }
15
 
16
    input[type=text] {
17
        // Fallback on the minimum width.
18
        min-width: 120px;
19
    }
20
 
21
    input[type=text],
22
    select {
23
        // Remove the bottom margin to gain height.
24
        margin-bottom: 0;
25
    }
26
}
27
 
28
// Grade upgrade notice.
29
.core_grades_notices {
30
    .singlebutton {
31
        display: inline-block;
32
    }
33
}
34
 
35
.path-grade-report #maincontent+.urlselect {
36
    position: absolute;
37
    left: 40vw;
38
}
39
 
40
.path-grade-report-grader {
41
 
42
    #region-main {
43
        overflow-x: visible;
44
        min-width: 100%;
45
        width: auto;
46
        display: inline-flex;
47
        flex-direction: column;
48
 
49
        &>.card {
50
            width: auto;
51
            overflow-x: initial;
52
        }
53
 
54
        div[role="main"] {
55
            flex: 1 1 auto;
56
        }
57
    }
58
 
59
    [data-region="blocks-column"] {
60
        width: 100%;
61
        clear: both;
62
    }
63
 
64
    .gradeparent .user.cell {
65
        .username {
66
            display: inline-flex;
67
            align-items: center;
68
 
69
            .userinitials {
70
                margin-right: .5rem;
71
            }
72
        }
73
 
74
        .userpicture {
75
            display: flex;
76
        }
77
    }
78
}
79
 
80
.path-grade-report-grader .header, .path-grade-report-grader td.userfield div {
81
    padding: 2px 0;
82
}
83
 
84
.path-grade-report-grader,
85
.path-grade-report-user {
86
    .gradepass {
87
        color: $success;
88
    }
89
 
90
    .gradefail {
91
        color: $danger;
92
    }
93
}
94
 
95
// Rubrics
96
#page-grade-grading-manage {
97
    #activemethodselector {
98
        label {
99
            display: inline-block;
100
        }
101
 
102
        .helptooltip {
103
            margin-right: 0.5em;
104
        }
105
    }
106
 
107
    .actions {
108
        display: flex;
109
        gap: 10px;
110
 
111
        border: 1px solid $border-color;
112
        border-radius: $btn-border-radius;
113
        padding: 20px;
114
 
115
        margin: 1rem 0 $page-padding-global;
116
 
117
        .action {
118
            padding: .6rem 1rem;
119
            font-size: .75rem;
120
 
121
            .action-text {
122
                position: relative;
123
                font-size: $font-size-sm;
124
                white-space: normal;
125
            }
126
 
127
            .icon {
128
                display: none;
129
            }
130
        }
131
    }
132
}
133
 
134
#page-grade-grading-form-rubric-edit {
135
    .gradingform_rubric_editform .status {
136
        font-size: 70%;
137
    }
138
}
139
 
140
.gradingform_rubric {
141
    margin-bottom: 1em;
142
    $rubricPadding: 6px;
143
 
144
    // When doing evaluation on the rubrics table.
145
    &.evaluate .criterion .levels .level {
146
 
147
        &:hover,
148
        &.checked {
149
            background: $primary-color-300;
150
        }
151
 
152
        &.checked {
153
            border: none;
154
            border-left: 1px solid $border-color;
155
        }
156
    }
157
 
158
    .criterion {
159
        .description {
160
            vertical-align: top;
161
            padding: $rubricPadding;
162
 
163
            textarea {
164
                margin-bottom: 0;
165
                height: 115px;
166
            }
167
        }
168
 
169
        .definition {
170
            padding: 2px;
171
            font-size: $font-size-sm;
172
 
173
            textarea {
174
                width: 80%;
175
                margin-bottom: 0;
176
            }
177
        }
178
 
179
        .score {
180
            position: relative;
181
            margin: 10px 0;
182
            text-align: center;
183
            color: $success;
184
 
185
            input {
186
                margin-bottom: 0;
187
            }
188
        }
189
 
190
        .level {
191
            vertical-align: top;
192
            padding: $rubricPadding;
193
 
194
            &.currentchecked {
195
                background: $primary-color-100;
196
            }
197
 
198
            &.checked {
199
                background: $primary-color-300;
200
                border: 1px solid $border-color;
201
            }
202
 
203
            .delete {
204
                position: relative;
205
                width: 100%;
206
                height: 40px;
207
                margin-top: 5px;
208
 
209
                input {
210
                    display: block;
211
                    position: absolute;
212
                    right: 0;
213
                    bottom: 0;
214
                    height: 40px;
215
                    width: 100%;
216
                    border-radius: $btn-border-radius;
217
                    margin: 0;
218
 
219
                    &:hover {
220
                        background-color: $red-200;
221
                    }
222
                }
223
            }
224
        }
225
 
226
        .scorevalue {
227
            input {
228
                // Should handle at least three chars with room to spare.
229
                float: none;
230
                width: 2em;
231
 
232
                &.hiddenelement,
233
                &.pseudotablink {
234
                    // Zero out the width if it's still in the block flow for some reason
235
                    // when hidden
236
                    width: 0;
237
                }
238
            }
239
        }
240
 
241
        .addlevel {
242
            vertical-align: top;
243
            padding-top: 6px;
244
 
245
            input {
246
                height: 30px;
247
                line-height: 1rem;
248
            }
249
        }
250
    }
251
 
252
 
253
    .addcriterion {
254
        margin-left: 5px;
255
        padding: 0;
256
 
257
        input {
258
            margin: 0;
259
            color: inherit;
260
            text-shadow: inherit;
261
            border: 0 none;
262
            line-height: inherit;
263
            background: transparent url([[pix:t/add]]) no-repeat 7px 8px;
264
            padding-left: 26px;
265
        }
266
 
267
        margin-bottom: 1em;
268
    }
269
 
270
    .options {
271
        clear: both;
272
 
273
        .option {
274
            label {
275
                margin: 0;
276
                padding: 0;
277
                font-size: inherit;
278
                font-weight: normal;
279
                line-height: 2em;
280
                color: inherit;
281
                text-shadow: none;
282
                background-color: transparent;
283
            }
284
 
285
            input {
286
                margin-left: 5px;
287
                margin-right: 12px;
288
            }
289
        }
290
    }
291
}
292
 
293
.grade-display {
294
    .description {
295
        font-size: 1rem;
296
    }
297
}
298
 
299
.criterion {
300
    .description {
301
        font-size: 1rem;
302
    }
303
 
304
    .criterion-toggle {
305
        .expanded-icon {
306
            display: block;
307
        }
308
 
309
        .collapsed-icon {
310
            display: none;
311
        }
312
 
313
        &.collapsed {
314
            .expanded-icon {
315
                display: none;
316
            }
317
 
318
            .collapsed-icon {
319
                display: block;
320
            }
321
        }
322
    }
323
}
324
 
325
// Set up grades layout.
326
//.path-grade-edit-tree
327
    .gradetree-wrapper {
328
        padding: 10px 10px;
329
        background-color: $gray-100;
330
 
331
        .theme-dark & {
332
            background-color: $dm-gray-100;
333
        }
334
 
335
        .grade_icons {
336
            .icon {
337
                display: inline-flex;
338
                align-items: center;
339
                justify-content: center;
340
                width: 20px;
341
                height: 20px;
342
                padding: 3px;
343
                border-radius: $btn-border-radius-lg;
344
                background-color: $gray-100;
345
 
346
                .theme-dark & {
347
                    filter: invert(1);
348
                }
349
            }
350
 
351
        }
352
 
353
        .setup-grades {
354
            h4 {
355
                margin: 0;
356
 
357
                .icon {
358
                    padding: 4px;
359
                    background-color: $gray-100;
360
                    border-radius: $btn-border-radius;
361
                }
362
            }
363
 
364
            .column-rowspan {
365
                padding: 0;
366
                width: 24px;
367
                min-width: 24px;
368
                max-width: 24px;
369
            }
370
 
371
            .emptyrow {
372
                display: none;
373
            }
374
 
375
            .gradeitemdescription {
376
                font-weight: normal;
377
                padding-left: 24px;
378
            }
379
 
380
            &.generaltable {
381
 
382
                tr {
383
                    &.spacer {
384
                        height: 0.5rem;
385
                    }
386
 
387
                    &[data-hidden="true"] {
388
                        display: none;
389
                    }
390
 
391
                    th {
392
                        vertical-align: bottom;
393
                        border: none;
394
                        text-align: left;
395
                        background-color: $gray-100;
396
 
397
                        .theme-dark & {
398
                            background-color: $dm-gray-100;
399
                        }
400
 
401
                        &.rowspan {
402
                            padding: 0;
403
                            width: 24px;
404
                            min-width: 24px;
405
                        }
406
                    }
407
 
408
                    td {
409
                        min-width: 4.5em;
410
                        background-color: $gray-100;
411
                        border: none;
412
                        vertical-align: middle;
413
 
414
                        .theme-dark & {
415
                            background-color: $dm-gray-100;
416
                        }
417
 
418
                        &.column-name {
419
                            padding-left: 38px;
420
 
421
                            .small {
422
                                font-size: 70%;
423
                            }
424
 
425
                            .itemicon {
426
                                font-size: 18px;
427
                                width: 30px;
428
                                height: 30px;
429
                                margin-right: .35rem;
430
                                margin-left: .5rem;
431
                                padding: 3px;
432
                                border-radius: 30px;
433
                            }
434
                        }
435
 
436
                        &.column-weight {
437
                            .weightoverride {
438
                                margin-right: 5px;
439
                            }
440
                            min-width: 15em;
441
                        }
442
 
443
                        &.column-actions {
444
                            .dropdown-toggle::after {
445
                                display: none;
446
                            }
447
                        }
448
 
449
                        &.movehere {
450
                            padding: 0;
451
 
452
                            a.movehere {
453
                                display: block;
454
                                width: 100%;
455
                                height: 50px;
456
                                margin: 5px 0 5px 0;
457
                                padding: 0;
458
 
459
                                &:before {
460
                                    display: none;
461
                                }
462
 
463
                                hr {
464
                                    border: none;
465
                                }
466
 
467
                            }
468
                        }
469
                    }
470
 
471
                    &.category {
472
                        td {
473
                            background-color: white;
474
                            border-top: 1px solid $table-border-color;
475
                            border-bottom: 1px solid $table-border-color;
476
 
477
                            .theme-dark & {
478
                                background-color: $dm-gray-100!important;
479
                                border-color: $dm-table-border-color!important;
480
                            }
481
 
482
                            &:first-child {
483
                                border-left: 1px solid $table-border-color;
484
 
485
                                .theme-dark & {
486
                                    border-color: $dm-table-border-color;
487
                                }
488
                            }
489
 
490
                            &:last-child {
491
                                border-right: 1px solid $table-border-color;
492
 
493
                                .theme-dark & {
494
                                    border-color: $dm-table-border-color;
495
                                }
496
                            }
497
 
498
                            &.column-name {
499
                                padding-left: 10px;
500
                                font-weight: $font-weight-bold;
501
 
502
                                div {
503
                                    display: flex;
504
                                    min-height: 30px;
505
                                    align-items: center;
506
 
507
                                    a {
508
                                        &.toggle-category {
509
                                            height: 40px!important;
510
                                            width: 40px!important;
511
                                            font-size: 12px;
512
                                            line-height: 24px;
513
                                            margin-right: 10px!important;
514
 
515
                                            &[aria-expanded="true"] .expanded,
516
                                            &[aria-expanded="false"] .collapsed {
517
                                                display: none;
518
                                            }
519
 
520
                                            background-color: $gray-100;
521
                                            color: $body-color;
522
 
523
                                            .theme-dark & {
524
                                            background-color: $dm-gray-100;
525
                                            color: $dm-body-color;
526
                                            }
527
 
528
                                            i {
529
                                                font-size: 12px;
530
                                                width: 12px;
531
                                                height: 12px;
532
                                                color: $body-color;
533
                                                margin: 0;
534
 
535
                                                .theme-dark & {
536
                                                    color: $dm-body-color!important;
537
                                                }
538
                                            }
539
                                        }
540
                                    }
541
                                }
542
                            }
543
                        }
544
                    }
545
 
546
                    &.item {
547
                        td {
548
                            background-color: white;
549
                            border-top: 3px solid $gray-100;
550
 
551
                            .theme-dark & {
552
                                background-color: $dm-gray-100!important;
553
                                border-color: $dm-table-border-color!important;
554
                            }
555
                        }
556
 
557
                        &.categoryitem,
558
                        &.courseitem {
559
                            td {
560
                                min-width: 4.5em;
561
                                background-color: $gray-100;
562
                                border: none;
563
                                vertical-align: middle;
564
 
565
                                &.column-name {
566
                                    padding-left: 0;
567
                                }
568
 
569
                                &:not(.column-actions) {
570
                                    font-weight: $font-weight-bold;
571
                                }
572
                            }
573
                        }
574
                    }
575
                }
576
            }
577
        }
578
 
579
        .badge-light {
580
            margin-right: 0.5em;
581
            margin-bottom: 0.5em;
582
        }
583
 
584
    }
585
 
586
    td.movehere a.movehere {
587
        display: block;
588
        width: 100%;
589
        height: 2rem;
590
        border: 2px dashed $primary-color-600;
591
        background-color: $primary-color-100;
592
        border-radius: $btn-border-radius;
593
 
594
        &:hover {
595
            background-color: $primary-color-200;
596
 
597
            .theme-dark & {
598
                background-color: $dm-gray-100;
599
            }
600
        }
601
 
602
        .theme-dark & {
603
            border: 2px dashed $dm-gray-700;
604
            background-color: $dm-gray-300;
605
        }
606
    }
607
 
608
/**
609
 * Grader report.
610
 */
611
.column-name .gradeitemheader,
612
.column-itemname .gradeitemheader {
613
    display: flex;
614
    align-items: center;
615
 
616
    .icon.itemicon {
617
        margin-right: .5rem;
618
        width: 30px;
619
        height: 30px;
620
    }
621
}
622
 
623
// ---- URL: /grade/edit/tree/index.php?id=4
624
.path-grade-report-grader .heading .gradeitemheader {
625
    line-height: 1.3;
626
}
627
 
628
.gradeparent {
629
    // width: calc(100vw - 178px);
630
    // max-width: calc(100vw - 178px);
631
    // overflow-x: auto;
632
 
633
    .drawer-courseindex--open &,
634
    .drawer-open-index--open &,
635
    .drawer-open-left & {
636
        width: calc(100vw - 460px);
637
        max-width: calc(100vw - 460px);
638
    }
639
}
640
 
641
.search-input-group .search-input-icon,
642
.path-grade-report-grader .usersearchwidget button,
643
.path-grade-report-grader .usersearchwidget a {
644
    z-index: 3;
645
}
646
 
647
/**
648
 * Grader report.
649
 */
650
 
651
 .path-grade-report-grader {
652
    .gradeparent {
653
        tr .cell,
654
        .floater .cell {
655
            background-color: $pagination-bg;
656
 
657
            &.gradecell {
658
                .dropdown-menu {
659
                    &.show {
660
                        z-index: 1;
661
                    }
662
                }
663
            }
664
        }
665
 
666
        table,
667
        .cell {
668
            border-color: $table-border-color;
669
 
670
            div {
671
                align-items: center;
672
            }
673
        }
674
 
675
        .heading .cell,
676
        .cell.category,
677
        .avg .cell {
678
            background-color: $gray-100;
679
        }
680
 
681
        table .clickable {
682
            cursor: pointer;
683
        }
684
 
685
        tr.heading {
686
            position: sticky;
687
            top: 0;
688
            z-index: 4;
689
        }
690
 
691
        tr.userrow {
692
            th {
693
                z-index: 2;
694
 
695
                &.actions-menu-active {
696
                    z-index: 3;
697
                }
698
            }
699
        }
700
 
701
        tr.lastrow {
702
            position: sticky;
703
            // Hack used by the observer to help detecting when the sticky 'Overall average' row is pinned. */
704
            bottom: -1px;
705
 
706
            &.pinned {
707
                z-index: 4;
708
            }
709
 
710
            td,
711
            th {
712
                border-top: 1px solid $table-border-color;
713
            }
714
        }
715
 
716
        th.header {
717
            left: 0;
718
            position: sticky;
719
 
720
            &#studentheader {
721
                z-index: 1;
722
            }
723
        }
724
 
725
        td.noborder {
726
            border-right: transparent;
727
        }
728
    }
729
}
730
 
731
.theme-dark.path-grade-report-grader {
732
    .gradeparent {
733
        tr .cell,
734
        .floater .cell {
735
            background-color: $dm-pagination-bg;
736
        }
737
 
738
        table,
739
        .cell {
740
            border-color: $dm-table-border-color;
741
        }
742
 
743
        .heading .cell,
744
        .cell.category,
745
        .avg .cell {
746
            background-color: $dm-gray-100;
747
        }
748
    }
749
 
750
    tr.lastrow {
751
        td,
752
        th {
753
            border-top: 1px solid $dm-table-border-color;
754
        }
755
    }
756
}
757
 
758
/**
759
 * User report.
760
 */
761
.path-grade-report-user .user-grade {
762
    border: none;
763
 
764
    &.generaltable {
765
        .levelodd {
766
            background-color: $table-accent-bg;
767
        }
768
 
769
        .leveleven {
770
            background-color: $table-bg;
771
        }
772
    }
773
 
774
    .column-contributiontocoursetotal,
775
    .column-range,
776
    .column-percentage,
777
    .column-weight {
778
        /*rtl:ignore*/
779
        direction: ltr;
780
    }
781
}
782
 
783
/**
784
 * Single view.
785
 */
786
.path-grade-report-singleview input[name^="finalgrade"] {
787
    width: 80px;
788
}
789
 
790
 
791
 
792
/* Table */
793
.scale_options {
794
    font-size: $font-size-xs;
795
    color: $body-color-light;
796
 
797
    .theme-dark & {
798
        color: $dm-body-color-light;
799
    }
800
}
801
 
802
/* Modal */
803
.usp-results-count {
804
    padding: 0.5rem 0;
805
    font-size: $font-size-sm;
806
    font-weight: $font-weight-bold;
807
    text-align: left;
808
}
809
 
810
.gradereport_history_usp {
811
 
812
    .usp-finish {
813
        padding: 7px 0 0;
814
 
815
        input {
816
            width: 100%;
817
        }
818
    }
819
 
820
    .usp-search-field {
821
        text-align: left;
822
    }
823
 
824
    .usp-search {
825
        text-align: left;
826
 
827
        input {
828
            width: auto;
829
            display: inline-flex;
830
        }
831
 
832
        input[type="submit"] {
833
            margin-left: 0.35rem;
834
        }
835
    }
836
 
837
    .usp-user .details {
838
        font-size: $font-size-sm;
839
 
840
        .userpicture {
841
            border-radius: $btn-border-radius;
842
        }
843
 
844
        .fullname label {
845
            font-weight: $font-weight-bold;
846
        }
847
    }
848
 
849
}
850
 
851
.path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .remark textarea {
852
    min-width: 200px;
853
    min-height: 70px;
854
}
855
 
856
// ---- URL: /grade/grading/pick.php?targetid=X
857
#page-grade-grading-pick {
858
    .templatesearchform {
859
        margin-bottom: 2rem;
860
    }
861
 
862
    h2+.singlebutton {
863
        margin-top: 1rem;
864
    }
865
}
866
 
867
 
868
// Form Grading
869
#page-grade-grading-form-rubric-edit .options,
870
.gradingform_guide .options {
871
    margin-top: 2rem;
872
}
873
 
874
.gradingform_guide .options .optionsheading {
875
    padding-bottom: 1rem;
876
    font-size: $font-size-sm;
877
}
878
 
879
.gradingform_guide .options .option label {
880
    margin-bottom: 0;
881
}
882
 
883
.gradingform_guide .commentheader {
884
    margin-top: 2rem;
885
}
886
 
887
.gradingform_guide .criterion label {
888
    font-size: $font-size-sm;
889
    margin: 1rem 0 .5rem 0;
890
}
891
 
892
.gradingform_rubric {
893
    width: 100%;
894
 
895
    .criteria {
896
        overflow: auto;
897
    }
898
}
899
 
900
 
901
#rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input,
902
.gradingform_guide .criterion .description .criterionmaxscore input {
903
    width: 100% !important;
904
}
905
 
906
.gradingform_rubric .criterion .levels .level .score {
907
    font-size: $font-size-base;
908
    font-style: normal;
909
    font-weight: $font-weight-medium;
910
    white-space: normal;
911
    color: $green-800;
912
    background-color: $green-200;
913
 
914
    display: block !important;
915
    padding: 2px 5px;
916
    border-radius: 3px;
917
}
918
 
919
.gradingform_rubric .criterion .level {
920
    width: 150px !important;
921
    font-size: $font-size-sm;
922
}
923
 
924
.gradingform_rubric.editor .criterion .controls,
925
.gradingform_rubric .criterion .description,
926
.gradingform_rubric.editor .criterion .addlevel,
927
.gradingform_rubric .criterion .remark,
928
.gradingform_rubric .criterion .levels .level {
929
    padding: 10px;
930
}
931
 
932
.gradingform_rubric .criterion .levels .level {
933
    min-width: 120px;
934
}
935
 
936
.gradingform_rubric .criterion,
937
.gradingform_rubric .criterion .levels .level {
938
    border-color: $border-color;
939
 
940
    .theme-dark & {
941
        border-color: $dm-border-color;
942
    }
943
}
944
 
945
.gradingform_guide.editor .criterion .controls .delete input,
946
.gradingform_guide.editor .moveup input,
947
.gradingform_guide.editor .movedown input,
948
.gradingform_rubric.editor .criterion .controls .delete input,
949
.gradingform_rubric.editor .criterion .controls .duplicate input,
950
.gradingform_rubric.editor .movedown input,
951
.gradingform_rubric.editor .moveup input {
952
    background-color: $gray-100;
953
    border-radius: $btn-border-radius;
954
    margin: .25rem;
955
}
956
 
957
.gradingform_rubric.editor .levels .level .delete input,
958
.gradingform_rubric.editor .criterion .controls .delete input,
959
.gradingform_guide.editor .criterion .controls .delete input {
960
    width: 100%;
961
    height: 40px;
962
    background: $red-100 url([[pix:theme|mod/workshop/userplan/task-fail]]) no-repeat center center;
963
 
964
    &:hover {
965
        background: $red-200 url([[pix:theme|mod/workshop/userplan/task-fail]]) no-repeat center center;
966
    }
967
}
968
 
969
.controls {
970
    .delete input {
971
        max-width: 40px;
972
    }
973
}
974
 
975
.gradingform_rubric.editor .moveup input,
976
.gradingform_guide.editor .moveup input {
977
    width: 40px;
978
    height: 40px;
979
    background: $gray-100 url([[pix:theme|monocolor/icon-arrow-up]]) no-repeat center center;
980
}
981
 
982
.gradingform_rubric.editor .movedown input,
983
.gradingform_guide.editor .movedown input {
984
    width: 40px;
985
    height: 40px;
986
    background: $gray-100 url([[pix:theme|monocolor/icon-arrow-down]]) no-repeat center center;
987
}
988
 
989
.gradingform_rubric.editor .criterion .controls .duplicate input {
990
    width: 40px;
991
    height: 40px;
992
    background: $gray-100 url([[pix:theme|monocolor/icon-copy]]) no-repeat center center;
993
}
994
 
995
.gradingform_rubric .criteria {
996
    overflow: auto;
997
    margin-bottom: $page-padding-global;
998
 
999
    .col-md-9 & {
1000
        margin-bottom: 0;
1001
    }
1002
}
1003
 
1004
#rubric-rubric.gradingform_rubric #rubric-criteria .criterion .addlevel input,
1005
#rubric-rubric.gradingform_rubric .addcriterion,
1006
#rubric-rubric.gradingform_rubric .addcriterion input,
1007
.gradingform_rubric.editor .addlevel input,
1008
.gradingform_guide.editor .addcriterion input,
1009
.gradingform_guide.editor .addcomment input {
1010
    background-image: none;
1011
    background-color: $primary-color-600;
1012
    color: $primary-color-100;
1013
    font-weight: $font-weight-medium;
1014
    font-size: $font-size-sm;
1015
 
1016
    margin: .5rem 0;
1017
    height: auto;
1018
    line-height: inherit;
1019
}
1020
 
1021
.addlevel .btn {
1022
    width: max-content;
1023
}
1024
 
1025
#rubric-rubric.gradingform_rubric .addcriterion input {
1026
    padding-left: 15px;
1027
    padding-right: 15px;
1028
}
1029
 
1030
.gradingform_rubric .plainvalue.empty,
1031
.gradingform_guide .plainvalue.editname,
1032
.gradingform_guide .plainvalue.empty {
1033
    background: $yellow-100 url([[pix:theme|monocolor/icon-edit]]) no-repeat 20px;
1034
    background-size: 14px;
1035
 
1036
    padding: 10px 10px 10px 50px;
1037
    font-size: $font-size-sm;
1038
    font-style: normal;
1039
    color: $body-color-secondary;
1040
}
1041
 
1042
.gradingform_guide .plainvalue.editname {
1043
    font-size: $font-size-base;
1044
}
1045
 
1046
#rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input.hiddenelement,
1047
#rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input.pseudotablink,
1048
.gradingform_guide.editor .pseudotablink {
1049
    height: 0;
1050
}
1051
 
1052
.gradingform_rubric .criterion.even,
1053
.gradingform_guide .criterion.even {
1054
    background: transparent;
1055
}
1056
 
1057
.gradingform_rubric .criterion {
1058
    border-width: 0 0 2px 0;
1059
    border-color: $border-color;
1060
    border-style: solid;
1061
}
1062
 
1063
.gradingform_guide.editor .criterion .description {
1064
    padding: 1rem;
1065
}
1066
 
1067
.gradingform_guide.editor .criterion .controls {
1068
    padding: 0;
1069
}
1070
 
1071
#guide-comments,
1072
#guide-criteria {
1073
    textarea {
1074
        min-height: 100px;
1075
    }
1076
}
1077
 
1078
// Table - Form
1079
.path-mod-assign {
1080
    .quickgrade {
1081
        display: inline-flex;
1082
        width: auto;
1083
    }
1084
 
1085
    tr.unselectedrow td {
1086
        &.c7 {
1087
            font-size: $font-size-xs;
1088
        }
1089
 
1090
        &.c8 {
1091
            max-width: 320px;
1092
            font-size: $font-size-xs;
1093
        }
1094
    }
1095
}
1096
 
1097
.grade-navigation {
1098
    margin-top: $page-padding-global;
1099
    margin-bottom: $page-padding-global;
1100
}
1101
 
1102
.rui-grader-toolbar {
1103
    .active {
1104
        background-color: $primary-color-100;
1105
 
1106
        .theme-dark & {
1107
            background-color: $primary-color-800;
1108
        }
1109
    }
1110
}
1111
 
1112
#guide-criteria {
1113
    label {
1114
        padding-top: 1rem;
1115
        display: block;
1116
        border-top: 1px solid $border-color;
1117
        color: $body-color-secondary;
1118
    }
1119
 
1120
    .criteriondescriptionmarkers {
1121
        width: auto;
1122
    }
1123
}
1124
 
1125
.gradingform_rubric_editform .status,
1126
.gradingform_guide_editform .status {
1127
    display: inline-flex;
1128
    align-items: center;
1129
 
1130
    padding: $badge-padding-y $badge-padding-x;
1131
    @include font-size($badge-font-size);
1132
    font-weight: $badge-font-weight;
1133
    @include border-radius($badge-border-radius);
1134
    text-transform: none;
1135
    border: none;
1136
}
1137
 
1138
// ---- URL:  /course/user.php?mode=grade&id=4&user=2
1139
#page-grade-edit-letter-index .mdl-align {
1140
    text-align: left;
1141
}
1142
 
1143
.gradereport-grader-table .user.cell {
1144
    position: sticky;
1145
    left: -80px;
1146
    z-index: 3;
1147
}
1148
 
1149
.path-grade-report-grader .gradeparent table {
1150
    border: 0;
1151
}
1152
 
1153
#page-grade-report-overview-index .main-content {
1154
    .generaltable {
1155
        margin-bottom: 0;
1156
 
1157
        td,
1158
        th {
1159
            padding: .75rem 0;
1160
        }
1161
 
1162
        tr {
1163
            &:hover {
1164
                background-color: transparent;
1165
                border-color: $primary-color-200;
1166
            }
1167
        }
1168
    }
1169
 
1170
}
1171
 
1172
// TODO: checkl if there is better solution https://demo.rosea.io/monocolor/1/grade/report/overview/index.php?id=4&userid=3
1173
#page-grade-report-overview-index {
1174
    .main-content {
1175
 
1176
        .rui-page-title--page,
1177
        .rui-page-title--avatar {
1178
            display: none;
1179
        }
1180
    }
1181
}
1182
 
1183
.path-grade-report-singleview div.reporttable {
1184
    margin-bottom: 0;
1185
    text-align: left;
1186
    border-radius: $border-radius;
1187
}
1188
 
1189
.theme-dark.path-grade-report-singleview div.reporttable {
1190
    background-color: $dm-gray-100;
1191
    color: $dm-body-color;
1192
    border-radius: $border-radius;
1193
}
1194
 
1195
.theme-dark.path-grade-report-singleview .reporttable tbody tr,
1196
.theme-dark.path-grade-report-singleview .reporttable tbody tr:nth-of-type(odd),
1197
.theme-dark.path-grade-report-singleview .reporttable tbody tr:hover {
1198
    background-color: $dm-gray-200;
1199
    color: $dm-body-color;
1200
    border-color: $dm-border-color;
1201
}
1202
 
1203
.path-grade-report-singleview .overrideexcludecheck {
1204
    width: 16px!important;
1205
    height: 16px!important;
1206
    padding: 5px;
1207
    border-radius: 20px;
1208
    background-color: $green-200;
1209
}
1210
 
1211
.path-grade-report-singleview .reporttable tbody th {
1212
    .itemicon {
1213
        margin-right: .35rem;
1214
        width: 30px;
1215
        height: 30px;
1216
    }
1217
}
1218
 
1219
.path-grade-report-singleview .reporttable {
1220
    .category {
1221
        font-size: $font-size-xs;
1222
        color: $body-color-light;
1223
    }
1224
}
1225
 
1226
.theme-dark.path-grade-report-singleview .reporttable {
1227
    .category {
1228
        color: $dm-body-color-light;
1229
    }
1230
}
1231
 
1232
// TODO: check this http://localhost:8888/moodle311/grade/report/singleview/index.php?id=6&item=grade&itemid=31
1233
.pagelayout-redirect {
1234
    #page {
1235
        max-width: 400px;
1236
        margin: $page-padding-global auto;
1237
        padding: 20px;
1238
    }
1239
}
1240
 
1241
 
1242
// Grading page
1243
.path-mod-assign [data-region="review-panel"].collapsed+[data-region="grade-panel"] [data-region="grade"],
1244
.path-mod-assign [data-region="grade-panel"].fullwidth [data-region="grade"] {
1245
    max-width: calc(100% - 40px);
1246
    /* increasing the width of the screen*/
1247
    margin-left: auto;
1248
    margin-right: auto;
1249
}
1250
 
1251
.path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .description {
1252
    width: 20%;
1253
    /* reduces the size of the criterion description from 50% to 20%*/
1254
}
1255
 
1256
.path-mod-assign [data-region="grade-panel"] .gradingform_rubric {
1257
    margin-top: 20px;
1258
}
1259
 
1260
.path-mod-assign [data-region="grade-panel"].fullwidth {
1261
    left: 0;
1262
    width: calc(100% - 40px);
1263
    overflow: auto;
1264
}
1265
 
1266
.gradingform_rubric .criterion .description {
1267
    max-width: 300px;
1268
}
1269
 
1270
#graded_users_selector {
1271
    margin-top: $page-padding-global;
1272
}
1273
 
1274
// Single Report Index
1275
.path-grade-report {
1276
    .main-content {
1277
        .itemnav {
1278
            max-width: 260px;
1279
        }
1280
 
1281
        .previtem {
1282
            text-align: left;
1283
        }
1284
 
1285
        .nextitem {
1286
            text-align: right;
1287
        }
1288
    }
1289
}
1290
 
1291
.theme-dark.path-mod-assign td.submissionnotgraded,
1292
.theme-dark.path-mod-assign div.submissionnotgraded {
1293
    color: $dm-body-color;
1294
}
1295
 
1296
// Hack for hiding current stamp alt text on img tag without the image source.
1297
.currentstampbutton {
1298
    img {
1299
        text-indent: -9999px;
1300
    }
1301
}
1302
 
1303
// Moodle 4.1
1304
.search-widget {
1305
    .btn {
1306
        padding: 2px !important;
1307
    }
1308
 
1309
    .userinitials:empty {
1310
        display: block;
1311
    }
1312
 
1313
    .user-info {
1314
        padding: 10px 16px;
1315
    }
1316
 
1317
    .dropdown-menu {
1318
        min-height: 50px;
1319
    }
1320
}
1321
 
1322
// Moodle 4.2.
1323
@include media-breakpoint-up(md) {
1324
    .path-grade-report-grader .initialsdropdown {
1325
        min-width: 460px;
1326
    }
1327
}
1328
 
1329
.path-grade-report-grader .grade_type_value .grade_icons .icon {
1330
    background-color: $yellow-100;
1331
 
1332
    display: flex;
1333
    align-items: center;
1334
    justify-content: center;
1335
 
1336
    padding: 5px;
1337
    width: 16px;
1338
    height: 16px;
1339
    border-radius: $btn-border-radius-lg;
1340
}
1341
 
1342
.theme-dark.path-grade-report-grader .grade_type_value .grade_icons .icon {
1343
    background-color: $gray-200;
1344
    filter: invert(1);
1345
}
1346
 
1347
.path-grade-report-user .user-report-container,
1348
.grade-report-user .user-report-container,
1349
.gradereport_history_usp .usp-user,
1350
.gradereport_history_usp .usp-ajax-content {
1351
    border-color: $border-color;
1352
}
1353
 
1354
.theme-dark.path-grade-report-user .user-report-container,
1355
.theme-dark .grade-report-user .user-report-container,
1356
.theme-dark .gradereport_history_usp .usp-user,
1357
.theme-dark .gradereport_history_usp .usp-ajax-content {
1358
    border-color: $dm-border-color;
1359
}
1360
 
1361
// Reset default styles
1362
.path-grade-report-user .user-grade thead th,
1363
.grade-report-user .user-grade thead th,
1364
.path-grade-report-user .user-grade td,
1365
.grade-report-user .user-grade td,
1366
.path-grade-report-user .user-grade .baggt,
1367
.path-grade-report-user .user-grade .baggb,
1368
.grade-report-user .user-grade .baggt,
1369
.grade-report-user .user-grade .baggb,
1370
.path-grade-report-user .user-report-container,
1371
.grade-report-user .user-report-container,
1372
.path-grade-report-user .user-grade tbody tr,
1373
.grade-report-user .user-grade tbody tr,
1374
.path-grade-report-user .user-grade tbody tr:hover,
1375
.grade-report-user .user-grade tbody tr:hover {
1376
    background-color: $gray-100;
1377
}
1378
 
1379
.path-grade-report-user .user-grade td.item,
1380
.grade-report-user .user-grade td.item,
1381
.path-grade-report-user .user-grade th.column-itemname:not(.header,.category,.baggt,.baggb),
1382
.grade-report-user .user-grade th.column-itemname:not(.header,.category,.baggt,.baggb),
1383
.path-grade-report-user .user-grade th.category,
1384
.grade-report-user .user-grade th.category {
1385
    background-color: $container-bg;
1386
    border-color: $border-color;
1387
}
1388
 
1389
.theme-dark.path-grade-report-user .user-grade thead th,
1390
.theme-dark .grade-report-user .user-grade thead th,
1391
.theme-dark.path-grade-report-user .user-grade td,
1392
.theme-dark .grade-report-user .user-grade td,
1393
.theme-dark.path-grade-report-user .user-grade .baggt,
1394
.theme-dark.path-grade-report-user .user-grade .baggb,
1395
.theme-dark .grade-report-user .user-grade .baggt,
1396
.theme-dark .grade-report-user .user-grade .baggb,
1397
.theme-dark.path-grade-report-user .user-report-container,
1398
.theme-dark .grade-report-user .user-report-container,
1399
.theme-dark.path-grade-report-user .user-grade tbody tr,
1400
.theme-dark .grade-report-user .user-grade tbody tr,
1401
.theme-dark.path-grade-report-user .user-grade tbody tr:hover,
1402
.theme-dark .grade-report-user .user-grade tbody tr:hover {
1403
    background-color: $dm-gray-100;
1404
 
1405
    .rui-icon {
1406
        filter: invert(1);
1407
    }
1408
}
1409
 
1410
.theme-dark.path-grade-report-user .user-grade td.item,
1411
.theme-dark .grade-report-user .user-grade td.item,
1412
.theme-dark.path-grade-report-user .user-grade th.column-itemname:not(.header,.category,.baggt,.baggb),
1413
.theme-dark .grade-report-user .user-grade th.column-itemname:not(.header,.category,.baggt,.baggb),
1414
.theme-dark.path-grade-report-user .user-grade th.category,
1415
.theme-dark .grade-report-user .user-grade th.category {
1416
    background-color: $dm-container-bg;
1417
    border-color: $dm-border-color;
1418
 
1419
    .rui-icon {
1420
        filter: invert(1);
1421
    }
1422
}
1423
 
1424
.column-name .gradeitemheader, .column-itemname .gradeitemheader {
1425
    font-size: $font-size-md;
1426
}
1427
// End.
1428
 
1429
.gradereport_history_usp .usp-user .details {
1430
    padding: 6px 10px;
1431
}
1432
 
1433
.extrafields {
1434
    font-size: $font-size-xs;
1435
}
1436
 
1437
.searchresultitemscontainer {
1438
    margin: 10px 0 0;
1439
}
1440
 
1441
.path-grade-report-singleview .overrideexcludecheck {
1442
    width: 24px;
1443
    height: 24px;
1444
}
1445
 
1446
.path-grade-report-singleview .report-navigation .container,
1447
.path-grade-report-user .user-navigation .container {
1448
    max-width: 100%;
1449
    width: 100%;
1450
}
1451
 
1452
.searchresultitemscontainer {
1453
    .userpicture {
1454
        width: 40px!important;
1455
        height: 40px!important;
1456
    }
1457
}
1458
 
1459
.initialsdropdown .initialbarlabel {
1460
    color: $dropdown-color;
1461
}
1462
 
1463
#page-grade-edit-tree-index .tertiary-navigation .action-menu .dropdown-toggle {
1464
    padding: 7px 14px;
1465
    font-weight: $font-weight-medium!important;
1466
}