MDL-55793 theme_noname: Use fixed width container
[moodle.git] / theme / noname / scss / moodle / modules.scss
CommitLineData
536f0460
DW
1/* modules.less */
2
3// The home for small tweaks to modules that don't require
4// changes drastic enough to pull in the full module css
5// and replace it completely
6// Plus some misc. odds and ends
7
8select {
9 width: auto;
10}
11
12// Forum module
13
14.path-mod-forum .forumsearch {
15 input,
16 .helptooltip {
17 margin: 0 3px;
18 }
19}
20
21.path-mod-forum .forumheaderlist,
22.path-mod-forum .forumheaderlist td {
23 border: none;
24}
25
26.path-mod-forum {
27 .forumheaderlist {
28 thead .header,
29 tbody .discussion td {
30 white-space: normal;
31 vertical-align: top;
32 padding-left: 0.5em;
33 padding-right: 0.5em;
34 }
35
36 thead .header {
37 white-space: normal;
38 vertical-align: top;
39 }
40
41 thead .header.replies {
42 text-align: center;
43 }
44 thead .header.lastpost {
45 text-align: right;
46 }
47 thead .header th,
48 tbody .discussion td{
49 &.discussionsubscription {
50 width: 16px;
51 padding-left: 0.5em;
52 padding-right: 0.5em;
53 }
54 }
55 .discussion {
56 .author, .replies, .lastpost {
57 white-space: normal;
58 }
59 .discussionsubscription,
60 .replies {
61 text-align: center;
62 }
63 .topic,
64 .discussionsubscription,
65 .topic.starter,
66 .picture,
67 .author,
68 .replies,
69 .lastpost {
70 vertical-align: top;
71 }
72 }
73 }
74}
75
76.forumpost {
77 @extend .card;
78 padding: 6px;
79 .header {
80 margin-bottom: 3px;
81 }
82 .picture img {
83 margin: 3px;
84 &.userpicture {
85 margin-left: 3px;
86 margin-right: 10px;
87 }
88 }
89 .content {
90 .posting.fullpost {
91 margin-top: 8px;
92 }
93 }
94 .row {
95 .topic,
96 .content-mask,
97 .options {
98 margin-left: 48px;
99 }
100 &.side {
101 clear: both;
102 }
103 }
104}
105
106.forumpost .row .left {
107 width: 48px;
108}
109
110.forumpost .options .commands {
111 margin-left: 0;
112}
113
114.forumpost .subject {
115 font-weight: bold;
116}
117
118// Override hardcoded forum modules styling
119.forumsearch input[type=text] {
120 margin-bottom: 0 !important;
121}
122
123#page-mod-forum-discuss .discussioncontrols {
124 width: auto;
125 margin: 0;
126}
127
128#page-footer {
536f0460
DW
129 border-top: 2px solid $table-border-color;
130}
131
132.maincalendar .calendarmonth td,.maincalendar .calendarmonth th {
133 border: 1px dotted $table-border-color;
134}
135
136.path-grade-report-grader h1 {
137 text-align: inherit;
138}
139
140#page-mod-chat-gui_basic input#message {
141 max-width: 100%;
142}
143
144#page-mod-data-view #singleimage {
145 width: auto;
146}
147
148.path-mod-data form {
149 margin-top: 10px;
150}
151
152.template_heading {
153 margin-top: 10px;
154}
155
156.breadcrumb-button {
157 float: right;
158 margin-top: 4px;
159}
160
161.breadcrumb-button .singlebutton {
162 float: left;
163 margin-left: 4px;
164}
165
166.navbar-fixed-top,
167.navbar-fixed-bottom {
168 z-index: 4030;
169}
170
171.ie .row-fluid .desktop-first-column {
172 margin-left: 0;
173}
174.langmenu form {
175 margin: 0;
176}
536f0460
DW
177// contributed by Paul Hibbitts, see http://msdn.microsoft@mixin com/en-us/library/ie/jj583807(v=vs.85).aspx
178canvas {
179 -ms-touch-action: auto;
180}
181
182div#dock {
183 display: none;
184}
185
186// Choice module
187
188.path-mod-choice {
189 .horizontal .choices {
190 margin: 0;
191 .option {
192 display: inline-block;
193 padding: 10px;
194 }
195 }
196 .results .data {
197 white-space: normal;
198 }
199}
200
201// Lesson module
202
203.path-mod-lesson .firstpageoptions {
204 margin: auto;
205 min-width: 280px;
206 width: 60%;
207}
208
209.path-mod-lesson .centerpadded {
210 padding: 5px;
211 text-align: center;
212}
213
214.path-mod-wiki .wiki_headingtitle,
215.path-mod-wiki .midpad,
216.path-mod-wiki .wiki_headingtime {
217 text-align: inherit;
218}
219
220.path-mod-wiki .wiki_contentbox {
221 width: 100%;
222}
223
536f0460
DW
224// Survey module
225
226.path-mod-survey {
227 .surveytable {
228 > tbody > tr:nth-of-type(odd) {background-color: $table-bg;}
229 > tbody > tr:nth-of-type(even) {background-color: $table-bg-accent;}
230 .rblock label {text-align: center;}
231 }
232 .resultgraph, .reportsummary, .studentreport, .reportbuttons, .centerpara {
233 text-align:center;
234 }
235}
236
237.nav .caret {
238 margin-left: 4px;
239}
240
241// Dividers
242.nav {
243 .divider {
244 overflow: hidden;
245 width: 0;
246 // height: $navbarHeight;
247 // border-left: 1px solid $navbarBackground;
248 // border-right: 1px solid $navbarBackgroundHighlight;
249 }
250}
251//.navbar-inverse {
252// .nav {
253 // .divider {
254 // border-left-color: $navbarInverseBackground;
255 // border-right-color: lighten($navbarInverseBackground, 25%);
256 // }
257 // }
258//}
536f0460
DW
259
260// Usermenu
261.usermenu {
262 .login {
5f18da12 263 line-height: 2.25rem;
536f0460 264 a {
5f18da12 265 color: $link-color;
536f0460
DW
266 &:hover,
267 &:focus {
5f18da12 268 color: $link-hover-color;
536f0460
DW
269 text-decoration: underline;
270 }
271 }
272 }
273 .moodle-actionmenu {
274
275 .toggle-display {
276 display: block;
277 opacity: 1;
278 color: $dropdown-link-color;
279 line-height: 40px;
280 height: 40px;
281 &:hover {
282 color: $dropdown-link-hover-color;
283 }
284
285 .userbutton {
286 height: 40px;
287 line-height: 40px;
288 .avatars{
289 display: inline-block;
290 height: 36px;
291 width: 36px;
292 vertical-align: middle;
293 margin-right: 6px;
294 margin-left: 6px;
295
296 .avatar,
297 img {
298 display: block;
299 }
300 }
301 .usertext {
302 display: inline-block;
303 vertical-align: middle;
304 line-height: 1em;
305 color: inherit;
306 .meta,
307 .role {
308 display: block;
309 font-size: 12px;
310 .value {
311 font-weight: bold;
312 }
313 }
314 .role {
315 font-weight: bold;
316 }
3313fdd6 317
536f0460 318 }
3313fdd6 319
536f0460
DW
320 }
321
322 // Hide caret when JS is disabled.
323 .caret {
324 display: none;
325 }
326 }
327
328
536f0460
DW
329 }
330}
3313fdd6
DW
331@include media-breakpoint-down(sm) {
332 .usertext {
333 display: none;
334 }
335}
536f0460
DW
336.jsenabled {
337 .usermenu {
338 .moodle-actionmenu {
339 .toggle-display {
340 display: block;
341
342 &.textmenu {
343 padding-left: 8px;
344 padding-right: 8px;
345 }
346
347 // Show caret when JS is enabled.
348 .caret {
349 display: inline-block;
350 position: relative;
351 top: 9px;
352 }
353 }
354
355 > .menubar {
356 display: block;
357 margin: 0px;
358 }
359 > .menu {
360 min-width: 160px;
361 .filler {
362 display: block;
363 @include nav-divider();
364 }
365 }
366
367 &.show {
368 background-color: $dropdown-link-active-bg;
369 .menu {
370 padding: 5px 0;
371 margin: 2px 0 0;
372 background-clip: padding-box;
373 &:before {
374 content: '';
375 display: inline-block;
376 border-left: 7px solid transparent;
377 border-right: 7px solid transparent;
378 border-bottom: 7px solid #ccc;
379 border-bottom-color: $dropdown-border-color;
380 position: absolute;
381 top: -7px;
382 }
383 &:after {
384 content: '';
385 display: inline-block;
386 border-left: 6px solid transparent;
387 border-right: 6px solid transparent;
388 border-bottom: 6px solid $dropdown-bg;
389 position: absolute;
390 top: -6px;
391 }
392
393 a {
394 border-radius: 0;
395
396 &:focus {
397 text-decoration: none;
398 }
399 &:hover {
400 text-decoration: none;
da92b738 401 @include gradient-y($dropdown-link-hover-bg, darken($dropdown-link-hover-bg, 5%));
536f0460
DW
402 }
403 }
404 &.align-tr-br {
405 margin-top: 2px;
406 }
407 @include box-shadow (0 5px 10px rgba(0, 0, 0, 0.2));
408 }
409 &:hover .toggle-display {}
410 }
411 }
412 }
413}
414
415.usermenu {
416 float: right;
417 > .moodle-actionmenu {
418 > .menu {
419 &:before {
420 right: 9px;
421 }
422 &:after {
423 right: 10px;
424 }
425 }
426 > .menubar li a {
427 text-align: right;
428 }
429 }
430}
431&.userloggedinas .usermenu .userbutton .avatars {
432 .avatar {
433 &.current {
434 left: 16px;
435 }
436 }
437}
438
439
440.userloggedinas .usermenu .userbutton .avatars {
441 .avatar {
442 &.current {
443 position: relative;
444 top: 4px;
445 left: 4px;
446 width: 20px;
447 height: 20px;
448 margin-top: 11px;
449 margin-bottom: -34px;
450 border: 1px solid #fff;
451 border-radius: 50%;
452 box-shadow: -2px -2px 16px rgba(0,0,0,0.25);
453 }
454 img {
455 width: inherit;
456 height: inherit;
457 }
458 overflow: hidden;
459 }
460}
461
462// Quiz module
463
464// Question navigation block.
465.path-mod-quiz #mod_quiz_navblock {
466 .qnbutton {
467 text-decoration: none;
468 font-size: 14px;
469 line-height: 20px;
470 font-weight: normal;
471 background-color: $body-color;
472 background-image: none;
473 height: 40px;
474 width: 30px;
475 border-radius: 3px;
476 border: 0;
477 overflow: visible;
478 margin: 0 6px 6px 0;
479 }
480 span.qnbutton {
481 cursor: default;
482 background-color: $input-bg-disabled;
483 color: $gray;
484 }
485 a.qnbutton:hover,
486 a.qnbutton:active,
487 a.qnbutton:focus {
488 text-decoration: underline;
489 }
490
491 .qnbutton .thispageholder {
492 border: 1px solid;
493 border-radius: 3px;
494 z-index: 1;
495 }
496 .qnbutton.thispage .thispageholder {
497 border-width: 3px;
498 }
499 .allquestionsononepage .qnbutton.thispage .thispageholder {
500 border-width: 1px;
501 }
502
503 .qnbutton.flagged .thispageholder {
504 background: transparent url([[pix:theme|mod/quiz/flag-on]]) 15px 0px no-repeat;
505 }
506
507 .qnbutton .trafficlight {
508 border: 0;
509 background: $body-color none center/10px no-repeat scroll;
510 height: 20px;
511 margin-top: 20px;
512 border-radius: 0 0 3px 3px;
513 }
514
515 .qnbutton.notyetanswered .trafficlight,
516 .qnbutton.invalidanswer .trafficlight {
517 background-color: $body-color;
518 }
519 .qnbutton.invalidanswer .trafficlight {
520 background-image: url([[pix:theme|mod/quiz/warningtriangle]]);
521 }
522 .qnbutton.correct .trafficlight {
523 background-image: url([[pix:theme|mod/quiz/checkmark]]);
524 background-color: $state-success-text;
525 }
526 .qnbutton.blocked .trafficlight {
527 background-image: url([[pix:core|t/locked]]);
528 background-color: $input-bg-disabled;
529 }
530 .qnbutton.notanswered .trafficlight,
531 .qnbutton.incorrect .trafficlight {
532 background-color: $state-danger-text;
533 }
534 .qnbutton.partiallycorrect .trafficlight {
535 background-image: url([[pix:theme|mod/quiz/whitecircle]]);
536 background-color: $state-warning-text;
537 }
538 .qnbutton.complete .trafficlight,
539 .qnbutton.answersaved .trafficlight,
540 .qnbutton.requiresgrading .trafficlight {
541 background-color: $gray-light;
542 }
543}
bffc0ef1
FM
544
545/**
546 * Assign.
547 */
548.path-mod-assign [data-region="grade-actions-panel"] [data-region="grade-actions"] .collapse-buttons {
549 top: auto;
550}
551.path-mod-assign [data-region="grade-panel"] h3 {
552 margin: 10px 0;
553 line-height: 40px;
554}
555.path-mod-assign [data-region="grading-navigation"] {
556 padding: 6px;
557}
558.path-mod-assign [data-region="grade-actions"] {
559 padding: 10px;
560}
561.path-mod-assign [data-region="user-info"] .img-rounded {
562 margin-top: 0;
563}
564.path-mod-assign [data-region="grading-navigation-panel"] {
565 height: 85px;
566}
567.path-mod-assign [data-region="grading-navigation"] [data-region="input-field"] input {
568 width: auto;
569 display: inline-block;
570}
571
572/**
573 * Assign feedback.
574 */
575.assignfeedback_editpdf_widget * {
576 box-sizing: content-box;
577}
578.assignfeedback_editpdf_widget button {
579 box-sizing: border-box;
580}
581.assignfeedback_editpdf_widget .commentcolourbutton img {
582 border-width: 0;
583}
584.assignfeedback_editpdf_widget .label {
585 @extend .tag;
586 @extend .tag-info;
587}
588
589.assignfeedback_editpdf_menu {
590 padding: 0;
591}