Proyectos de Subversion Moodle

Rev

Rev 1 | | Comparar con el anterior | 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
    margin: 20px 0 30px 0;
5
 
6
    h4 {
7
        // Force back the base font-size to minimise width.
8
        font-size: $font-size-base;
9
    }
10
 
11
    th.cell,
12
    input[type=text] {
13
        // Fallback on the minimum width.
14
        width: auto;
15
    }
16
 
17
    input[type=text],
18
    select {
19
        // Remove the bottom margin to gain height.
20
        margin-bottom: 0;
21
    }
22
}
23
 
24
// Grade upgrade notice.
25
.core_grades_notices {
26
    .singlebutton {
27
        display: inline-block;
28
    }
29
}
30
 
31
.path-grade-report #maincontent + .urlselect {
32
    position: absolute;
33
    left: 40vw;
34
}
35
 
36
.path-grade-report-grader {
37
    #region-main {
38
        min-width: 100%;
39
        width: auto;
40
        display: flex;
41
        flex-direction: column;
42
        & > .card {
43
            width: auto;
44
            overflow-x: initial;
45
        }
46
        div[role="main"] {
47
            flex: 1 1 auto;
48
        }
49
    }
50
    [data-region="blocks-column"] {
51
        width: 100%;
52
        clear: both;
53
    }
54
}
55
 
56
.path-grade-report-grader,
57
.path-grade-report-user {
58
    .gradepass {
59
        color: $success;
60
    }
61
    .gradefail {
62
        color: $danger;
63
    }
64
}
65
 
66
.path-grade {
67
    #region-main {
68
        overflow-x: visible;
69
    }
70
 
71
    .user-heading .userinitials {
72
        width: 50px;
73
        height: 50px;
74
    }
75
}
76
 
77
// Rubrics
78
#page-grade-grading-manage {
79
    #activemethodselector {
80
        label {
81
            display: inline-block;
82
        }
83
 
84
        .helptooltip {
85
            margin-right: 0.5em;
86
        }
87
    }
88
 
89
    .actions {
90
        display: block;
91
        text-align: center;
92
        margin-bottom: 1em;
93
 
94
        .action {
95
            display: inline-block;
96
            position: relative;
97
            vertical-align: top;
98
            width: 150px;
99
            text-align: center;
100
            overflow: hidden;
101
            margin: 0.5em;
102
            padding: 1em;
103
            border: 1px solid $grade-manage-action-border-color;
104
 
105
            .action-text {
106
                position: relative;
107
                top: 0.4em;
108
                font-size: 14px;
109
                white-space: normal;
110
            }
111
        }
112
    }
113
}
114
 
115
#page-grade-grading-form-rubric-edit {
116
    .gradingform_rubric_editform .status {
117
        font-size: 70%;
118
    }
119
}
120
 
121
.gradingform_rubric {
122
    margin-bottom: 1em;
123
    $rubricPadding: 6px;
124
 
125
    // When doing evaluation on the rubrics table.
126
    &.evaluate .criterion .levels .level {
127
        &:hover,
128
        &.checked {
129
            background: $grade-criterion-level-hover-bg;
130
        }
131
        &.checked {
132
            border: none;
133
            border-left: 1px solid $border-color;
134
        }
135
    }
136
 
137
    .criterion {
138
        .description {
139
            vertical-align: top;
140
            padding: $rubricPadding;
141
 
142
            textarea {
143
                margin-bottom: 0;
144
                height: 115px;
145
            }
146
        }
147
 
148
        .definition {
149
            textarea {
150
                width: 80%;
151
                margin-bottom: 0;
152
            }
153
        }
154
 
155
        .score {
156
            margin-top: 5px;
157
            margin-right: 28px;
158
            font-style: italic;
159
            font-weight: bold;
1441 ariadna 160
            color: #{shift-color($success, 20%)};
1 efrain 161
 
162
            input {
163
                margin-bottom: 0;
164
            }
165
        }
166
 
167
        .level {
168
            vertical-align: top;
169
            padding: $rubricPadding;
170
 
171
            &.currentchecked {
172
                background: $grade-criterion-level-currentchecked-bg;
173
            }
174
 
175
            &.checked {
176
                background: $grade-criterion-level-checked-bg;
177
                border: 1px solid $grade-criterion-level-checked-border-color;
178
            }
179
 
180
            .delete {
181
                position: relative;
182
                width: 32px;
183
                height: 32px;
184
                margin-top: -32px;
185
                clear: both;
186
                float: right;
187
 
188
                input {
189
                    display: block;
190
                    position: absolute;
191
                    right: 0;
192
                    bottom: 0;
193
                    height: 24px;
194
                    width: 24px;
195
                    margin: 0;
196
 
197
                    &:hover {
198
                        background-color: $grade-criterion-level-delete-bg;
199
                    }
200
                }
201
            }
202
        }
203
 
204
        .scorevalue {
205
            input {
206
                // Should handle at least three chars with room to spare.
207
                float: none;
208
                width: 2em;
209
 
210
                &.hiddenelement,
211
                &.pseudotablink {
212
                    // Zero out the width if it's still in the block flow for some reason
213
                    // when hidden
214
                    width: 0;
215
                }
216
            }
217
        }
218
 
219
        .addlevel {
220
            vertical-align: top;
221
            padding-top: 6px;
222
 
223
            input {
224
                height: 30px;
225
                line-height: 1rem;
226
            }
227
        }
228
    }
229
 
230
    .addcriterion {
231
        margin-left: 5px;
232
        padding: 0;
233
 
234
        input {
235
            margin: 0;
236
            color: inherit;
237
            text-shadow: inherit;
238
            border: 0 none;
239
            line-height: inherit;
240
            background: transparent url([[pix:t/add]]) no-repeat 7px 8px;
241
            padding-left: 26px;
242
        }
243
        margin-bottom: 1em;
244
    }
245
 
246
    .options {
247
        clear: both;
248
 
249
        .option {
250
            label {
251
                margin: 0;
252
                padding: 0;
253
                font-size: inherit;
254
                font-weight: normal;
255
                line-height: 2em;
256
                color: inherit;
257
                text-shadow: none;
258
                background-color: transparent;
259
            }
260
 
261
            input {
262
                margin-left: 5px;
263
                margin-right: 12px;
264
            }
265
        }
266
    }
267
}
268
 
269
.grade-display {
270
    .description {
271
        font-size: 1rem;
272
    }
273
}
274
.criterion {
275
    .description {
276
        font-size: 1rem;
277
    }
278
 
279
    .criterion-toggle {
280
        .expanded-icon {
281
            display: block;
282
        }
283
 
284
        .collapsed-icon {
285
            display: none;
286
        }
287
 
288
        &.collapsed {
289
            .expanded-icon {
290
                display: none;
291
            }
292
 
293
            .collapsed-icon {
294
                display: block;
295
            }
296
        }
297
    }
298
}
299
 
300
// Set up grades layout.
301
.path-grade-edit-tree {
302
    .collapse-list {
303
 
304
        .unlist {
305
            padding-left: 2rem;
306
 
307
            [data-for="sectionnode"] {
308
                &:focus {
309
                    > .collapse-list-item:first-child {
310
                        background-color: $collapse-list-item-hover-bg;
311
                        border-color: $collapse-list-item-hover-border;
312
                    }
313
                }
314
 
315
                &[data-selected="true"] {
316
                    > .collapse-list-item:first-child {
317
                        background-color: $collapse-list-item-hover-bg;
318
                        border-color: $collapse-list-item-hover-border;
319
                        color: $blue;
320
                    }
321
                }
322
 
323
                .collapse-list-item-content {
324
                    &[aria-hidden="true"] {
325
                        display: none;
326
                    }
327
                }
328
 
329
                &[aria-expanded="true"] {
330
                    > .collapse-list-item {
331
                        .collapsed-icon {
332
                            display: none;
333
                        }
334
                    }
335
                }
336
 
337
                &[aria-expanded="false"] {
338
                    > .collapse-list-item {
339
                        .expanded-icon {
340
                            display: none;
341
                        }
342
                    }
343
                }
344
            }
345
 
346
            .collapse-list-item {
347
                padding: 0.5rem 1rem;
348
                cursor: pointer;
349
 
350
                .collapse-list-item-name {
351
                    font-weight: bold;
352
                }
353
 
354
                .collapse-list-link {
355
                    color: $gray-900;
356
                    padding: 0 0.2rem;
357
                    margin-right: 0.3rem;
358
 
359
                    i {
360
                        font-size: 12px;
361
                        width: 12px;
362
                        height: 12px;
363
                        margin: 0;
364
                    }
365
                }
366
            }
367
        }
368
    }
369
 
370
    .gradetree-wrapper {
371
        padding: 10px 10px;
372
        background-color: $gray-100;
373
 
374
        .setup-grades {
375
            h4 {
376
                margin: 0;
377
            }
378
 
379
            .column-rowspan {
380
                padding: 0;
381
                width: 24px;
382
                min-width: 24px;
383
                max-width: 24px;
384
            }
385
 
386
            .emptyrow {
387
                display: none;
388
            }
389
 
390
            .gradeitemdescription {
391
                font-weight: normal;
392
                padding-left: 24px;
393
            }
394
 
395
            &.generaltable {
396
 
397
                tr {
398
                    &.spacer {
399
                        height: 0.5rem;
400
                    }
401
 
402
                    &[data-hidden="true"] {
403
                        display: none;
404
                    }
405
 
406
                    th {
407
                        vertical-align: bottom;
408
                        border: none;
409
                        text-align: left;
410
                        background-color: $gray-100;
411
 
412
                        &.rowspan {
413
                            padding: 0;
414
                            width: 24px;
415
                            min-width: 24px;
416
                        }
417
                    }
418
 
419
                    td {
420
                        min-width: 4.5em;
421
                        background-color: $gray-100;
422
                        border: none;
423
                        vertical-align: middle;
424
 
425
                        &.column-name {
426
                            .small {
427
                                font-size: 70%;
428
                            }
429
 
430
                            .itemselect {
431
                                margin-right: 15px;
432
                            }
433
                        }
434
 
435
                        &.column-weight {
436
                            .weightoverride {
437
                                margin-right: 5px;
438
                            }
439
                            min-width: 15em;
440
                        }
441
 
442
                        &.column-actions {
443
                            .dropdown-toggle::after {
444
                                display: none;
445
                            }
446
                        }
447
 
448
                        &.movehere {
449
                            padding: 0;
450
 
451
                            a.movehere {
452
                                display: block;
453
                                width: 100%;
454
                                margin: 5px 0 5px 0;
455
                                padding: 3px 0 3px 0;
456
 
457
                                hr {
458
                                    border-top: 2px dashed $gray-500;
459
                                    margin: 0;
460
                                }
461
 
462
                                &:hover {
463
                                    hr {
464
                                        border-top: 2px dashed $blue;
465
                                    }
466
 
467
                                }
468
                            }
469
                        }
470
                    }
471
 
472
                    &.category {
473
                        td {
474
                            background-color: $grade-table-td-bg;
475
                            border-top: 1px solid $gray-300;
476
                            border-bottom: 1px solid $gray-300;
477
 
478
                            &:first-child {
479
                                border-left: 1px solid $gray-300;
480
                            }
481
 
482
                            &:last-child {
483
                                border-right: 1px solid $gray-300;
484
                            }
485
 
486
                            &.column-name {
487
                                font-weight: bold;
488
 
489
                                div {
490
                                    display: flex;
491
                                    min-height: 30px;
492
                                    align-items: center;
493
 
494
                                    a {
495
                                        &.toggle-category {
496
                                            height: 24px;
497
                                            width: 24px;
498
                                            font-size: 12px;
499
                                            line-height: 24px;
500
                                            margin-right: 3px;
501
 
502
                                            &[aria-expanded="true"] .expanded,
503
                                            &[aria-expanded="false"] .collapsed {
504
                                                display: none;
505
                                            }
506
 
507
                                            i {
508
                                                font-size: 12px;
509
                                                width: 12px;
510
                                                height: 12px;
511
                                                color: $grade-table-toggle-icon-color;
512
                                                margin: 0;
513
                                            }
514
                                        }
515
                                    }
516
                                }
517
                            }
518
                        }
519
                    }
520
 
521
                    &.item {
522
                        td {
523
                            background-color: $grade-table-td-bg;
524
                            border-top: 3px solid $gray-100;
525
                        }
526
 
527
                        &.categoryitem,
528
                        &.courseitem {
529
                            td {
530
                                min-width: 4.5em;
531
                                background-color: $gray-100;
532
                                border: none;
533
                                vertical-align: middle;
534
 
535
                                &.column-name {
536
                                    padding-left: 0;
537
                                }
538
 
539
                                &:not(.column-actions) {
540
                                    font-weight: bold;
541
                                }
542
                            }
543
                        }
544
                    }
545
                }
546
            }
547
        }
548
 
549
        .badge-light {
550
            color: $grade-badge-color;
551
            background-color: $grade-badge-bg;
552
            margin-right: 0.5em;
553
            margin-bottom: 0.5em;
554
        }
555
 
556
    }
557
}
558
 
559
/**
560
 * Grader report.
561
 */
562
.path-grade-report-grader {
563
    .gradeparent {
564
        tr .cell,
565
        .floater .cell {
566
            background-color: $pagination-bg;
567
 
568
            &.gradecell {
569
                .dropdown-menu {
570
                    &.show {
571
                        z-index: 1;
572
                    }
573
                }
574
            }
575
        }
576
 
577
        table,
578
        .cell {
579
            border-color: $table-border-color;
580
        }
581
 
582
        .heading .cell,
583
        .cell.category,
584
        .avg .cell {
585
            background-color: $gray-100;
586
        }
587
 
588
        table .clickable {
589
            cursor: pointer;
590
        }
591
 
592
        tr.heading {
593
            position: sticky;
594
            top: $navbar-height;
595
            z-index: 4;
596
        }
597
 
598
        tr.userrow {
599
            th {
600
                z-index: 2;
601
 
602
                &.actions-menu-active {
603
                    z-index: 3;
604
                }
605
            }
606
        }
607
 
608
        tr.lastrow {
609
 
610
            &:not(.userrow) {
611
                position: sticky;
612
                // Hack used by the observer to help detecting when the sticky last row is pinned. */
613
                bottom: -1px;
614
 
615
                &.pinned {
616
                    z-index: 4;
617
                }
618
            }
619
 
620
            td,
621
            th {
622
                border-top: 1px solid $table-border-color;
623
            }
624
        }
625
 
626
        th.header {
627
            left: 0;
628
            position: sticky;
629
 
630
            &#studentheader {
631
                z-index: 1;
632
            }
633
        }
634
 
635
        td.noborder {
636
            border-right: transparent;
637
        }
638
    }
639
 
640
    &.hasstickyfooter {
641
        .gradeparent {
642
            tr.lastrow {
643
                // Hack used by the observer to help detecting when the sticky 'Overall average' row is pinned when
644
                // sticky footer is present.
645
                bottom: calc(#{$stickyfooter-height} - 1px);
646
            }
647
        }
648
    }
649
}
650
 
651
/**
652
 * User report.
653
 */
654
.path-grade-report-user .user-grade {
655
    border: none;
656
 
657
    &.generaltable {
658
        .levelodd {
659
            background-color: $table-accent-bg;
660
        }
661
 
662
        .leveleven {
663
            background-color: $table-bg;
664
        }
665
    }
666
 
667
    .column-contributiontocoursetotal,
668
    .column-range,
669
    .column-percentage,
670
    .column-weight {
671
        /*rtl:ignore*/
672
        direction: ltr;
673
    }
674
}
675
 
676
/**
677
 * Single view.
678
 */
679
.path-grade-report-singleview .reporttable {
680
    input[name^="finalgrade"] {
681
        width: 80px;
682
        display: inline-block;
683
    }
684
    .action-menu {
685
        display: inline-block;
686
        margin-left: 0.5rem;
687
        float: right;
688
    }
689
    .dropdown-toggle::after {
690
        display: none;
691
    }
692
}
693
 
694
.gradereport-grader-table {
695
    input[name^="grade"] {
696
        width: 80px;
697
        display: inline-block;
698
    }
699
    .dropdown-toggle::after {
700
        display: none;
701
    }
702
}
703
 
704
.search-widget {
705
    .dropdown-menu {
706
        padding: 0.8rem 1.2rem;
707
 
708
        &.wide {
709
            width: 350px;
710
        }
711
 
712
        &.narrow {
713
            width: 250px;
714
        }
715
 
716
        .dropdown-item {
717
            span {
718
                &.email {
719
                    color: $text-muted;
720
                }
721
            }
722
        }
723
 
724
        .dropdown-item:hover,
725
        .dropdown-item:active {
726
            span {
727
                color: $grade-search-hover-color;
728
            }
729
        }
730
 
731
        .searchresultscontainer {
732
            height: 178px;
733
            font-size: 90%;
734
 
735
            .searchresultitemscontainer {
736
                height: 178px;
737
                max-height: 178px;
738
                overflow: auto;
739
            }
740
        }
741
 
742
        .unsearchablecontentcontainer {
743
            border-top: 1px solid $grade-search-container-border-color;
744
            padding-top: 10px;
745
            font-size: 90%;
746
        }
747
    }
748
}
749
 
750
#fitem_id_submitbutton {
751
    padding-right: 2em;
752
}
753
 
754
.gradestatus {
755
    padding-top: 10px;
756
}
757
 
758
.gradestatus .icon {
759
    margin-right: 1rem;
760
}