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: var(--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: var(--primary-color-100);
196
            }
197
 
198
            &.checked {
199
                background: var(--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 var(--main-theme-color);
591
        background-color: var(--primary-color-100);
592
        border-radius: $btn-border-radius;
593
 
594
        &:hover {
595
            background-color: var(--primary-color-100);
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
    .path-grade-report-user .user-grade .column-itemname .itemicon,
609
    .grade-report-user .user-grade .column-itemname .itemicon {
610
        width: 30px;
611
        height: 30px;
612
    }
613
 
614
/**
615
 * Grader report.
616
 */
617
.column-name .gradeitemheader,
618
.column-itemname .gradeitemheader {
619
    display: flex;
620
    align-items: center;
621
 
622
    .icon.itemicon {
623
        margin-right: .5rem;
624
        width: 30px;
625
        height: 30px;
626
    }
627
}
628
 
629
// ---- URL: /grade/edit/tree/index.php?id=4
630
.path-grade-report-grader .heading .gradeitemheader {
631
    line-height: 1.3;
632
}
633
 
634
.gradeparent {
635
    // width: calc(100vw - 178px);
636
    // max-width: calc(100vw - 178px);
637
    // overflow-x: auto;
638
 
639
    .drawer-courseindex--open &,
640
    .drawer-open-index--open &,
641
    .drawer-open-left & {
642
        width: calc(100vw - 460px);
643
        max-width: calc(100vw - 460px);
644
    }
645
}
646
 
647
.search-input-group .search-input-icon,
648
.path-grade-report-grader .usersearchwidget button,
649
.path-grade-report-grader .usersearchwidget a {
650
    z-index: 3;
651
}
652
 
653
/**
654
 * Grader report.
655
 */
656
 
657
 .path-grade-report-grader {
658
    .gradeparent {
659
        tr .cell,
660
        .floater .cell {
661
            background-color: $pagination-bg;
662
 
663
            &.gradecell {
664
                .dropdown-menu {
665
                    &.show {
666
                        z-index: 1;
667
                    }
668
                }
669
            }
670
        }
671
 
672
        table,
673
        .cell {
674
            border-color: $table-border-color;
675
 
676
            div {
677
                align-items: center;
678
            }
679
        }
680
 
681
        .heading .cell,
682
        .cell.category,
683
        .avg .cell {
684
            background-color: $gray-100;
685
        }
686
 
687
        table .clickable {
688
            cursor: pointer;
689
        }
690
 
691
        tr.heading {
692
            position: sticky;
693
            top: 0;
694
            z-index: 4;
695
        }
696
 
697
        tr.userrow {
698
            th {
699
                z-index: 2;
700
 
701
                &.actions-menu-active {
702
                    z-index: 3;
703
                }
704
            }
705
        }
706
 
707
        tr.lastrow {
708
            position: sticky;
709
            // Hack used by the observer to help detecting when the sticky 'Overall average' row is pinned. */
710
            bottom: -1px;
711
 
712
            &.pinned {
713
                z-index: 4;
714
            }
715
 
716
            td,
717
            th {
718
                border-top: 1px solid $table-border-color;
719
            }
720
        }
721
 
722
        th.header {
723
            left: 0;
724
            position: sticky;
725
 
726
            &#studentheader {
727
                z-index: 1;
728
            }
729
        }
730
 
731
        td.noborder {
732
            border-right: transparent;
733
        }
734
    }
735
}
736
 
737
.theme-dark.path-grade-report-grader {
738
    .gradeparent {
739
        tr .cell,
740
        .floater .cell {
741
            background-color: $dm-pagination-bg;
742
        }
743
 
744
        table,
745
        .cell {
746
            border-color: $dm-table-border-color;
747
        }
748
 
749
        .heading .cell,
750
        .cell.category,
751
        .avg .cell {
752
            background-color: $dm-gray-100;
753
        }
754
    }
755
 
756
    tr.lastrow {
757
        td,
758
        th {
759
            border-top: 1px solid $dm-table-border-color;
760
        }
761
    }
762
}
763
 
764
/**
765
 * User report.
766
 */
767
.path-grade-report-user .user-grade {
768
    border: none;
769
 
770
    &.generaltable {
771
        .levelodd {
772
            background-color: $table-accent-bg;
773
        }
774
 
775
        .leveleven {
776
            background-color: $table-bg;
777
        }
778
    }
779
 
780
    .column-contributiontocoursetotal,
781
    .column-range,
782
    .column-percentage,
783
    .column-weight {
784
        /*rtl:ignore*/
785
        direction: ltr;
786
    }
787
}
788
 
789
/**
790
 * Single view.
791
 */
792
.path-grade-report-singleview input[name^="finalgrade"] {
793
    width: 80px;
794
}
795
 
796
 
797
 
798
/* Table */
799
.scale_options {
800
    font-size: $font-size-xs;
801
    color: $body-color-light;
802
 
803
    .theme-dark & {
804
        color: $dm-body-color-light;
805
    }
806
}
807
 
808
/* Modal */
809
.usp-results-count {
810
    padding: 0.5rem 0;
811
    font-size: $font-size-sm;
812
    font-weight: $font-weight-bold;
813
    text-align: left;
814
}
815
 
816
.gradereport_history_usp {
817
 
818
    .usp-finish {
819
        padding: 7px 0 0;
820
 
821
        input {
822
            width: 100%;
823
        }
824
    }
825
 
826
    .usp-search-field {
827
        text-align: left;
828
    }
829
 
830
    .usp-search {
831
        text-align: left;
832
 
833
        input {
834
            width: auto;
835
            display: inline-flex;
836
        }
837
 
838
        input[type="submit"] {
839
            margin-left: 0.35rem;
840
        }
841
    }
842
 
843
    .usp-user .details {
844
        font-size: $font-size-sm;
845
 
846
        .userpicture {
847
            border-radius: $btn-border-radius;
848
        }
849
 
850
        .fullname label {
851
            font-weight: $font-weight-bold;
852
        }
853
    }
854
 
855
}
856
 
857
.path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .remark textarea {
858
    min-width: 200px;
859
    min-height: 70px;
860
}
861
 
862
// ---- URL: /grade/grading/pick.php?targetid=X
863
#page-grade-grading-pick {
864
    .templatesearchform {
865
        margin-bottom: 2rem;
866
    }
867
 
868
    h2+.singlebutton {
869
        margin-top: 1rem;
870
    }
871
}
872
 
873
 
874
// Form Grading
875
#page-grade-grading-form-rubric-edit .options,
876
.gradingform_guide .options {
877
    margin-top: 2rem;
878
}
879
 
880
.gradingform_guide .options .optionsheading {
881
    padding-bottom: 1rem;
882
    font-size: $font-size-sm;
883
}
884
 
885
.gradingform_guide .options .option label {
886
    margin-bottom: 0;
887
}
888
 
889
.gradingform_guide .commentheader {
890
    margin-top: 2rem;
891
}
892
 
893
.gradingform_guide .criterion label {
894
    font-size: $font-size-sm;
895
    margin: 1rem 0 .5rem 0;
896
}
897
 
898
.gradingform_rubric {
899
    width: 100%;
900
 
901
    .criteria {
902
        overflow: auto;
903
    }
904
}
905
 
906
 
907
#rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input,
908
.gradingform_guide .criterion .description .criterionmaxscore input {
909
    width: 100% !important;
910
}
911
 
912
.gradingform_rubric .criterion .levels .level .score {
913
    font-size: $font-size-base;
914
    font-style: normal;
915
    font-weight: $font-weight-medium;
916
    white-space: normal;
917
    color: $green-800;
918
    background-color: $green-200;
919
 
920
    display: block !important;
921
    padding: 2px 5px;
922
    border-radius: 3px;
923
}
924
 
925
.gradingform_rubric .criterion .level {
926
    width: 150px !important;
927
    font-size: $font-size-sm;
928
}
929
 
930
.gradingform_rubric.editor .criterion .controls,
931
.gradingform_rubric .criterion .description,
932
.gradingform_rubric.editor .criterion .addlevel,
933
.gradingform_rubric .criterion .remark,
934
.gradingform_rubric .criterion .levels .level {
935
    padding: 10px;
936
}
937
 
938
.gradingform_rubric .criterion .levels .level {
939
    min-width: 120px;
940
}
941
 
942
.gradingform_rubric .criterion,
943
.gradingform_rubric .criterion .levels .level {
944
    border-color: $border-color;
945
 
946
    .theme-dark & {
947
        border-color: $dm-border-color;
948
    }
949
}
950
 
951
.gradingform_guide.editor .criterion .controls .delete input,
952
.gradingform_guide.editor .moveup input,
953
.gradingform_guide.editor .movedown input,
954
.gradingform_rubric.editor .criterion .controls .delete input,
955
.gradingform_rubric.editor .criterion .controls .duplicate input,
956
.gradingform_rubric.editor .movedown input,
957
.gradingform_rubric.editor .moveup input {
958
    background-color: $gray-100;
959
    border-radius: $btn-border-radius;
960
    margin: .25rem;
961
}
962
 
963
.gradingform_rubric.editor .levels .level .delete input,
964
.gradingform_rubric.editor .criterion .controls .delete input,
965
.gradingform_guide.editor .criterion .controls .delete input {
966
    width: 100%;
967
    height: 40px;
968
    background: $red-100 url([[pix:theme|mod/workshop/userplan/task-fail]]) no-repeat center center;
969
 
970
    &:hover {
971
        background: $red-200 url([[pix:theme|mod/workshop/userplan/task-fail]]) no-repeat center center;
972
    }
973
}
974
 
975
.controls {
976
    .delete input {
977
        max-width: 40px;
978
    }
979
}
980
 
981
.gradingform_rubric.editor .moveup input,
982
.gradingform_guide.editor .moveup input {
983
    width: 40px;
984
    height: 40px;
985
    background: $gray-100 url([[pix:theme|universe/icon-arrow-up]]) no-repeat center center;
986
}
987
 
988
.gradingform_rubric.editor .movedown input,
989
.gradingform_guide.editor .movedown input {
990
    width: 40px;
991
    height: 40px;
992
    background: $gray-100 url([[pix:theme|universe/icon-arrow-down]]) no-repeat center center;
993
}
994
 
995
.gradingform_rubric.editor .criterion .controls .duplicate input {
996
    width: 40px;
997
    height: 40px;
998
    background: $gray-100 url([[pix:theme|universe/icon-copy]]) no-repeat center center;
999
}
1000
 
1001
.gradingform_rubric .criteria {
1002
    overflow: auto;
1003
    margin-bottom: $page-padding-global;
1004
 
1005
    .col-md-9 & {
1006
        margin-bottom: 0;
1007
    }
1008
}
1009
 
1010
#rubric-rubric.gradingform_rubric #rubric-criteria .criterion .addlevel input,
1011
#rubric-rubric.gradingform_rubric .addcriterion,
1012
#rubric-rubric.gradingform_rubric .addcriterion input,
1013
.gradingform_rubric.editor .addlevel input,
1014
.gradingform_guide.editor .addcriterion input,
1015
.gradingform_guide.editor .addcomment input {
1016
    background-image: none;
1017
    background-color: var(--main-theme-color);
1018
    color: var(--primary-color-100);
1019
    font-weight: $font-weight-medium;
1020
    font-size: $font-size-sm;
1021
 
1022
    margin: .5rem 0;
1023
    height: auto;
1024
    line-height: inherit;
1025
}
1026
 
1027
.addlevel .btn {
1028
    width: max-content;
1029
}
1030
 
1031
#rubric-rubric.gradingform_rubric .addcriterion input {
1032
    padding-left: 15px;
1033
    padding-right: 15px;
1034
}
1035
 
1036
.gradingform_rubric .plainvalue.empty,
1037
.gradingform_guide .plainvalue.editname,
1038
.gradingform_guide .plainvalue.empty {
1039
    background: $yellow-100 url([[pix:theme|universe/icon-edit]]) no-repeat 20px;
1040
    background-size: 14px;
1041
 
1042
    padding: 10px 10px 10px 50px;
1043
    font-size: $font-size-sm;
1044
    font-style: normal;
1045
    color: $body-color-secondary;
1046
}
1047
 
1048
.gradingform_guide .plainvalue.editname {
1049
    font-size: $font-size-base;
1050
}
1051
 
1052
#rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input.hiddenelement,
1053
#rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input.pseudotablink,
1054
.gradingform_guide.editor .pseudotablink {
1055
    height: 0;
1056
}
1057
 
1058
.gradingform_rubric .criterion.even,
1059
.gradingform_guide .criterion.even {
1060
    background: transparent;
1061
}
1062
 
1063
.gradingform_rubric .criterion {
1064
    border-width: 0 0 2px 0;
1065
    border-color: $border-color;
1066
    border-style: solid;
1067
}
1068
 
1069
.gradingform_guide.editor .criterion .description {
1070
    padding: 1rem;
1071
}
1072
 
1073
.gradingform_guide.editor .criterion .controls {
1074
    padding: 0;
1075
}
1076
 
1077
#guide-comments,
1078
#guide-criteria {
1079
    textarea {
1080
        min-height: 100px;
1081
    }
1082
}
1083
 
1084
// Table - Form
1085
.path-mod-assign {
1086
    .quickgrade {
1087
        display: inline-flex;
1088
        width: auto;
1089
    }
1090
 
1091
    tr.unselectedrow td {
1092
        &.c7 {
1093
            font-size: $font-size-xs;
1094
        }
1095
 
1096
        &.c8 {
1097
            max-width: 320px;
1098
            font-size: $font-size-xs;
1099
        }
1100
    }
1101
}
1102
 
1103
.grade-navigation {
1104
    margin-top: $page-padding-global;
1105
    margin-bottom: $page-padding-global;
1106
}
1107
 
1108
.rui-grader-toolbar {
1109
    .active {
1110
        background-color: var(--primary-color-100);
1111
 
1112
        .theme-dark & {
1113
            background-color: var(--primary-color-800);
1114
        }
1115
    }
1116
}
1117
 
1118
#guide-criteria {
1119
    label {
1120
        padding-top: 1rem;
1121
        display: block;
1122
        border-top: 1px solid $border-color;
1123
        color: $body-color-secondary;
1124
    }
1125
 
1126
    .criteriondescriptionmarkers {
1127
        width: auto;
1128
    }
1129
}
1130
 
1131
.gradingform_rubric_editform .status,
1132
.gradingform_guide_editform .status {
1133
    display: inline-flex;
1134
    align-items: center;
1135
 
1136
    padding: $badge-padding-y $badge-padding-x;
1137
    @include font-size($badge-font-size);
1138
    font-weight: $badge-font-weight;
1139
    @include border-radius($badge-border-radius);
1140
    text-transform: none;
1141
    border: none;
1142
}
1143
 
1144
// ---- URL:  /course/user.php?mode=grade&id=4&user=2
1145
#page-grade-edit-letter-index .mdl-align {
1146
    text-align: left;
1147
}
1148
 
1149
.gradereport-grader-table .user.cell {
1150
    position: sticky;
1151
    left: -80px;
1152
    z-index: 3;
1153
}
1154
 
1155
.path-grade-report-grader .gradeparent table {
1156
    border: 0;
1157
}
1158
 
1159
#page-grade-report-overview-index .main-content {
1160
    .generaltable {
1161
        margin-bottom: 0;
1162
 
1163
        td,
1164
        th {
1165
            padding: .75rem 0;
1166
        }
1167
 
1168
        tr {
1169
            &:hover {
1170
                background-color: transparent;
1171
                border-color: var(--primary-color-200);
1172
            }
1173
        }
1174
    }
1175
 
1176
}
1177
 
1178
// TODO: checkl if there is better solution https://demo.rosea.io/universe/1/grade/report/overview/index.php?id=4&userid=3
1179
#page-grade-report-overview-index {
1180
    .main-content {
1181
 
1182
        .rui-page-title--page,
1183
        .rui-page-title--avatar {
1184
            display: none;
1185
        }
1186
    }
1187
}
1188
 
1189
.path-grade-report-singleview div.reporttable {
1190
    margin-bottom: 0;
1191
    text-align: left;
1192
    border-radius: $border-radius;
1193
}
1194
 
1195
.theme-dark.path-grade-report-singleview div.reporttable {
1196
    background-color: $dm-gray-100;
1197
    color: $dm-body-color;
1198
    border-radius: $border-radius;
1199
}
1200
 
1201
.theme-dark.path-grade-report-singleview .reporttable tbody tr,
1202
.theme-dark.path-grade-report-singleview .reporttable tbody tr:nth-of-type(odd),
1203
.theme-dark.path-grade-report-singleview .reporttable tbody tr:hover {
1204
    background-color: $dm-gray-200;
1205
    color: $dm-body-color;
1206
    border-color: $dm-border-color;
1207
}
1208
 
1209
.path-grade-report-singleview .overrideexcludecheck {
1210
    width: 16px!important;
1211
    height: 16px!important;
1212
    padding: 5px;
1213
    border-radius: 20px;
1214
    background-color: $green-200;
1215
}
1216
 
1217
.path-grade-report-singleview .reporttable tbody th {
1218
    .itemicon {
1219
        margin-right: .35rem;
1220
        width: 30px;
1221
        height: 30px;
1222
    }
1223
}
1224
 
1225
.path-grade-report-singleview .reporttable {
1226
    .category {
1227
        font-size: $font-size-xs;
1228
        color: $body-color-light;
1229
    }
1230
}
1231
 
1232
.theme-dark.path-grade-report-singleview .reporttable {
1233
    .category {
1234
        color: $dm-body-color-light;
1235
    }
1236
}
1237
 
1238
// TODO: check this http://localhost:8888/moodle311/grade/report/singleview/index.php?id=6&item=grade&itemid=31
1239
.pagelayout-redirect {
1240
    #page {
1241
        max-width: 400px;
1242
        margin: $page-padding-global auto;
1243
        padding: 20px;
1244
    }
1245
}
1246
 
1247
 
1248
// Grading page
1249
.path-mod-assign [data-region="review-panel"].collapsed+[data-region="grade-panel"] [data-region="grade"],
1250
.path-mod-assign [data-region="grade-panel"].fullwidth [data-region="grade"] {
1251
    max-width: calc(100% - 40px);
1252
    /* increasing the width of the screen*/
1253
    margin-left: auto;
1254
    margin-right: auto;
1255
}
1256
 
1257
.path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .description {
1258
    width: 20%;
1259
    /* reduces the size of the criterion description from 50% to 20%*/
1260
}
1261
 
1262
.path-mod-assign [data-region="grade-panel"] .gradingform_rubric {
1263
    margin-top: 20px;
1264
}
1265
 
1266
.path-mod-assign [data-region="grade-panel"].fullwidth {
1267
    left: 0;
1268
    width: calc(100% - 40px);
1269
    overflow: auto;
1270
}
1271
 
1272
.gradingform_rubric .criterion .description {
1273
    max-width: 300px;
1274
}
1275
 
1276
#graded_users_selector {
1277
    margin-top: $page-padding-global;
1278
}
1279
 
1280
// Single Report Index
1281
.path-grade-report {
1282
    .main-content {
1283
        .itemnav {
1284
            max-width: 260px;
1285
        }
1286
 
1287
        .previtem {
1288
            text-align: left;
1289
        }
1290
 
1291
        .nextitem {
1292
            text-align: right;
1293
        }
1294
    }
1295
}
1296
 
1297
.theme-dark.path-mod-assign td.submissionnotgraded,
1298
.theme-dark.path-mod-assign div.submissionnotgraded {
1299
    color: $dm-body-color;
1300
}
1301
 
1302
// Hack for hiding current stamp alt text on img tag without the image source.
1303
.currentstampbutton {
1304
    img {
1305
        text-indent: -9999px;
1306
    }
1307
}
1308
 
1309
// Moodle 4.1
1310
.search-widget {
1311
    .btn {
1312
        padding: 2px !important;
1313
    }
1314
 
1315
    .userinitials:empty {
1316
        display: block;
1317
    }
1318
 
1319
    .user-info {
1320
        padding: 10px 16px;
1321
    }
1322
 
1323
    .dropdown-menu {
1324
        min-height: 50px;
1325
    }
1326
}
1327
 
1328
// Moodle 4.2.
1329
@include media-breakpoint-up(md) {
1330
    .path-grade-report-grader .initialsdropdown {
1331
        min-width: 460px;
1332
    }
1333
}
1334
 
1335
.path-grade-report-grader .grade_type_value .grade_icons .icon {
1336
    background-color: $yellow-100;
1337
 
1338
    display: flex;
1339
    align-items: center;
1340
    justify-content: center;
1341
 
1342
    padding: 5px;
1343
    width: 16px;
1344
    height: 16px;
1345
    border-radius: $btn-border-radius-lg;
1346
}
1347
 
1348
.theme-dark.path-grade-report-grader .grade_type_value .grade_icons .icon {
1349
    background-color: $gray-200;
1350
    filter: invert(1);
1351
}
1352
 
1353
.path-grade-report-user .user-report-container,
1354
.grade-report-user .user-report-container,
1355
.gradereport_history_usp .usp-user,
1356
.gradereport_history_usp .usp-ajax-content {
1357
    border-color: $border-color;
1358
}
1359
 
1360
.theme-dark.path-grade-report-user .user-report-container,
1361
.theme-dark .grade-report-user .user-report-container,
1362
.theme-dark .gradereport_history_usp .usp-user,
1363
.theme-dark .gradereport_history_usp .usp-ajax-content {
1364
    border-color: $dm-border-color;
1365
}
1366
 
1367
// Reset default styles
1368
.path-grade-report-user .user-grade thead th,
1369
.grade-report-user .user-grade thead th,
1370
.path-grade-report-user .user-grade td,
1371
.grade-report-user .user-grade td,
1372
.path-grade-report-user .user-grade .baggt,
1373
.path-grade-report-user .user-grade .baggb,
1374
.grade-report-user .user-grade .baggt,
1375
.grade-report-user .user-grade .baggb,
1376
.path-grade-report-user .user-report-container,
1377
.grade-report-user .user-report-container,
1378
.path-grade-report-user .user-grade tbody tr,
1379
.grade-report-user .user-grade tbody tr,
1380
.path-grade-report-user .user-grade tbody tr:hover,
1381
.grade-report-user .user-grade tbody tr:hover {
1382
    background-color: $gray-100;
1383
}
1384
 
1385
.path-grade-report-user .user-grade td.item,
1386
.grade-report-user .user-grade td.item,
1387
.path-grade-report-user .user-grade th.column-itemname:not(.header,.category,.baggt,.baggb),
1388
.grade-report-user .user-grade th.column-itemname:not(.header,.category,.baggt,.baggb),
1389
.path-grade-report-user .user-grade th.category,
1390
.grade-report-user .user-grade th.category {
1391
    background-color: $container-bg;
1392
    border-color: $border-color;
1393
}
1394
 
1395
.theme-dark.path-grade-report-user .user-grade thead th,
1396
.theme-dark .grade-report-user .user-grade thead th,
1397
.theme-dark.path-grade-report-user .user-grade td,
1398
.theme-dark .grade-report-user .user-grade td,
1399
.theme-dark.path-grade-report-user .user-grade .baggt,
1400
.theme-dark.path-grade-report-user .user-grade .baggb,
1401
.theme-dark .grade-report-user .user-grade .baggt,
1402
.theme-dark .grade-report-user .user-grade .baggb,
1403
.theme-dark.path-grade-report-user .user-report-container,
1404
.theme-dark .grade-report-user .user-report-container,
1405
.theme-dark.path-grade-report-user .user-grade tbody tr,
1406
.theme-dark .grade-report-user .user-grade tbody tr,
1407
.theme-dark.path-grade-report-user .user-grade tbody tr:hover,
1408
.theme-dark .grade-report-user .user-grade tbody tr:hover {
1409
    background-color: $dm-gray-100;
1410
 
1411
    .rui-icon {
1412
        filter: invert(1);
1413
    }
1414
}
1415
 
1416
.theme-dark.path-grade-report-user .user-grade td.item,
1417
.theme-dark .grade-report-user .user-grade td.item,
1418
.theme-dark.path-grade-report-user .user-grade th.column-itemname:not(.header,.category,.baggt,.baggb),
1419
.theme-dark .grade-report-user .user-grade th.column-itemname:not(.header,.category,.baggt,.baggb),
1420
.theme-dark.path-grade-report-user .user-grade th.category,
1421
.theme-dark .grade-report-user .user-grade th.category {
1422
    background-color: $dm-container-bg;
1423
    border-color: $dm-border-color;
1424
 
1425
    .rui-icon {
1426
        filter: invert(1);
1427
    }
1428
}
1429
 
1430
.column-name .gradeitemheader, .column-itemname .gradeitemheader {
1431
    font-size: $font-size-md;
1432
}
1433
// End.
1434
 
1435
.gradereport_history_usp .usp-user .details {
1436
    padding: 6px 10px;
1437
}
1438
 
1439
.extrafields {
1440
    font-size: $font-size-xs;
1441
}
1442
 
1443
.searchresultitemscontainer {
1444
    margin: 10px 0 0;
1445
}
1446
 
1447
.path-grade-report-singleview .overrideexcludecheck {
1448
    width: 24px;
1449
    height: 24px;
1450
}
1451
 
1452
.path-grade-report-singleview .report-navigation .container,
1453
.path-grade-report-user .user-navigation .container {
1454
    max-width: 100%;
1455
    width: 100%;
1456
}
1457
 
1458
.searchresultitemscontainer {
1459
    .userpicture {
1460
        width: 40px!important;
1461
        height: 40px!important;
1462
    }
1463
}
1464
 
1465
.initialsdropdown .initialbarlabel {
1466
    color: $dropdown-color;
1467
}
1468
 
1469
#page-grade-edit-tree-index .tertiary-navigation .action-menu .dropdown-toggle {
1470
    padding: 7px 14px;
1471
    font-weight: $font-weight-medium!important;
1472
}