MDL-55584 theme_noname: Patching for better feel in grades
[moodle.git] / theme / noname / scss / moodle / grade.scss
1 // The class gradetreebox matches the pages displaying the gradebook
2 // "Gradebook setup" > "Simple view" and "Full view".
3 .gradetreebox {
4     h4 {
5         // Force back the base font-size to minimise width.
6         font-size: $font-size-base;
7     }
8     th.cell,
9     input[type=text] {
10         // Fallback on the minimum width.
11         width: auto;
12     }
13     input[type=text],
14     select {
15         // Remove the bottom margin to gain height.
16         margin-bottom: 0;
17     }
18 }
20 // Grade upgrade notice.
21 .core_grades_notices {
22     .singlebutton {
23         display: inline-block;
24     }
25 }
27 // Rubrics
28 #page-grade-grading-manage {
29     #activemethodselector {
30         label {
31             display: inline-block;
32         }
33         .helptooltip {
34             margin-right: 0.5em;
35         }
36     }
37     .actions {
38         display: block;
39         text-align: center;
40         margin-bottom: 1em;
41         .action {
42             @extend .btn;
43             @extend .btn-lg;
44             display: inline-block;
45             position: relative;
46             vertical-align: top;
47             width: 150px;
48             text-align: center;
49             overflow: hidden;
50             margin: 0.5em;
51             padding: 1em;
52             border: 1px solid #aaa;
53             .action-icon {
54                 display: inline-block;
55                 position: relative;
56                 height: 64px;
57                 width: 64px;
58             }
59             .action-text {
60                 position: relative;
61                 top: 0.4em;
62                 font-size: 14px;
63             }
64         }
65     }
66 }
68 #page-grade-grading-form-rubric-edit {
69     .gradingform_rubric_editform .status {
70         font-size: 70%;
71     }
72 }
74 .gradingform_rubric.editor {
75     .addlevel, .addcriterion {
76         input {
77             // Fallback for IE8: we use Bootstrap 2's button styles normally, but
78             // IE8 ignores background-image: linear-gradient rules.
79             background: #fff none no-repeat top left;
80         }
81     }
82 }
84 #rubric-rubric {
85     &.gradingform_rubric {
86         #rubric-criteria {
87             margin-bottom: 1em;
88             $rubricPadding: 6px;
89             .criterion {
90                 .description {
91                     vertical-align: top;
92                     padding: $rubricPadding;
93                     textarea {
94                         margin-bottom: 0px;
95                         height: 115px;
96                     }
97                 }
98                 .definition {
99                     textarea {
100                         width: 80%;
101                         margin-bottom: 0px;
102                     }
103                 }
104                 .score {
105                     position: relative;
106                     float: left;
107                     margin-right: 28px;
108                     input {
109                         margin-bottom: 0px;
110                     }
111                 }
112                 .level {
113                     vertical-align: top;
114                     padding: $rubricPadding;
115                     .delete {
116                         position: relative;
117                         width: 32px;
118                         height: 32px;
119                         margin-top: -32px;
120                         clear: both;
121                         float: right;
122                         input {
123                             display: block;
124                             position: absolute;
125                             right: 0;
126                             bottom: 0;
127                             height: 24px;
128                             width: 24px;
129                             margin: 0px;
130                             &:hover {
131                                 background-color: #ddd;
132                             }
133                         }
134                     }
135                 }
136                 .scorevalue {
137                     input {
138                         // Should handle at least three chars with room to spare.
139                         float: none;
140                         width: 2em;
141                         &.hiddenelement,&.pseudotablink {
142                             // Zero out the width if it's still in the block flow for some reason
143                             // when hidden
144                             width: 0;
145                         }
146                     }
147                 }
148                 .addlevel {
149                     vertical-align: middle;
150                     input {
151                         @extend .btn;
152                         background-position: 0px 0px;
153                         height: 30px;
154                         margin-right: 5px;
155                     }
156                 }
157             }
158         }
159         .addcriterion {
160             margin-left: 5px;
161             @extend .btn;
162             padding: 0;
163             input {
164                 margin: 0;
165                 color: inherit;
166                 text-shadow: inherit;
167                 border: 0px none;
168                 line-height: inherit;
169                 background: transparent url([[pix:t/add]]) no-repeat 7px 8px;
170                 padding-left: 26px;
171             }
172             margin-bottom:1em;
173         }
174         .options {
175             clear: both;
176             .option {
177                 label {
178                     margin: 0;
179                     padding: 0;
180                     font-size: inherit;
181                     font-weight: normal;
182                     line-height: 2em;
183                     color: inherit;
184                     text-shadow: none;
185                     background-color: transparent;
186                 }
187                 input {
188                     margin-left: 5px;
189                     margin-right: 12px;
190                 }
191             }
192         }
193     }
196 // Set up grades layout.
197 .path-grade-edit-tree .setup-grades {
198     h4 {
199         margin: 0;
200     }
201     .column-rowspan {
202         padding: 0;
203         width: 24px;
204         min-width: 24px;
205         max-width: 24px;
206     }
207     .category td.column-name {
208         padding-left: 0;
209     }
210     td.column-name {
211         padding-left: 24px;
212     }
213     .column-name h4 img.icon {
214         padding-left: 0;
215     }
216     .category input[type="text"],
217     .category .column-range,
218     .categoryitem,
219     .courseitem {
220         font-weight: bold;
221     }
222     .emptyrow {
223         display: none;
224     }
225     .gradeitemdescription {
226         font-weight: normal;
227         padding-left: 24px;
228     }
229     .column-weight {
230         white-space: nowrap;
231         &.level3 {
232             padding-left: 37px;
233         }
234         &.level4 {
235             padding-left: 66px;
236         }
237         &.level5 {
238             padding-left: 95px;
239         }
240         &.level6 {
241             padding-left: 124px;
242         }
243         &.level7 {
244             padding-left: 153px;
245         }
246         &.level8 {
247             padding-left: 182px;
248         }
249         &.level9 {
250             padding-left: 211px;
251         }
252         &.level10 {
253             padding-left: 240px;
254         }
255     }
256     .column-range {
257         &.level2 {
258             padding-left: 37px;
259         }
260         &.level3 {
261             padding-left: 66px;
262         }
263         &.level4 {
264             padding-left: 95px;
265         }
266         &.level5 {
267             padding-left: 124px;
268         }
269         &.level6 {
270             padding-left: 153px;
271         }
272         &.level7 {
273             padding-left: 182px;
274         }
275         &.level8 {
276             padding-left: 211px;
277         }
278         &.level9 {
279             padding-left: 240px;
280         }
281         &.level10 {
282             padding-left: 269px;
283         }
284     }
285     &.generaltable {
286         .levelodd {
287             background-color: $table-bg-accent;
288         }
289         .leveleven {
290             background-color: $table-bg;
291         }
292     }
295 /**
296  * Grader report.
297  */
298 .path-grade-report {
299     .gradeparent {
300         table {
301             @include border-radius($border-radius);
302         }
303         tr .cell {
304             background-color: $pagination-bg;
305         }
306         table,
307         .cell {
308             border-color: $table-border-color;
309         }
310         tr:nth-of-type(even) .cell,
311         .floater .cell,
312         .avg {
313             background-color: $gray-lightest;
314         }
315         table .clickable {
316             cursor: pointer;
317         }
318     }
319  }
321 /**
322  * User report.
323  */
324 .path-grade-report-user .user-grade {
325     border: none;
326     &.generaltable {
327         .levelodd {
328             background-color: $table-bg-accent;
329         }
330         .leveleven {
331             background-color: $table-bg;
332         }
333     }
336 /**
337  * Single view.
338  */
339 .path-grade-report-singleview input[name^="finalgrade"] {
340     width: 80px;