MDL-50497 theme_bootstrapbase: Divider colours look wrong when inverted
[moodle.git] / theme / bootstrapbase / less / moodle / modules.less
CommitLineData
8903b17b
BB
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
8bf57320
DM
12// Forum
13
bfaee803
SH
14.path-mod-forum .forumsearch {
15 input,
16 .helptooltip {
17 margin: 0 3px;
18 }
19}
20
8903b17b
BB
21.path-mod-forum .forumheaderlist,
22.path-mod-forum .forumheaderlist td {
23 border: none;
24}
25
ebfb73db
AN
26.path-mod-forum {
27 .forumheaderlist {
28 thead .header,
29 tbody .discussion td {
8bf57320 30 white-space: normal;
ebfb73db
AN
31 vertical-align: top;
32 padding-left: 0.5em;
33 padding-right: 0.5em;
8bf57320 34 }
ebfb73db
AN
35
36 thead .header {
37 white-space: normal;
38 vertical-align: top;
39 }
40
41 thead .header.replies {
8bf57320
DM
42 text-align: center;
43 }
ebfb73db
AN
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 }
8bf57320
DM
72 }
73 }
74}
75
4c7a19ec 76.path-mod-feedback .feedback_bar_image {
2a8ab91c
AB
77 height: 5px; // we should remove the bar height specification in core
78}
79
8903b17b
BB
80.forumpost {
81 .well;
82 padding: 6px;
73c4e333
AB
83 .header {
84 margin-bottom: 3px;
85 }
cee8be63
JC
86 .picture img {
87 margin: 3px;
88 &.userpicture {
89 margin-left: 3px;
90 margin-right: 10px;
91 }
92 }
93 .content {
94 .posting.fullpost {
95 margin-top: 8px;
96 }
97 }
98 .row {
99 .topic,
100 .content-mask,
101 .options {
102 margin-left: 48px;
103 }
104 &.side {
105 clear: both;
106 }
107 }
108}
109
110.dir-rtl .forumpost {
111 .picture img {
112 &.userpicture {
113 margin-left: 10px;
114 margin-right: 3px;
115 }
116 }
117 .row {
118 .topic,
119 .content-mask,
120 .options {
121 margin-left: 0;
122 margin-right: 48px;
73c4e333
AB
123 }
124 }
8903b17b
BB
125}
126
127.forumpost .row .left {
cee8be63 128 width: 48px;
8903b17b
BB
129}
130
131.forumpost .options .commands {
132 margin-left: 0;
133}
134
135.forumpost .subject {
136 font-weight: bold;
137}
138
139// Override hardcoded forum modules styling
140.forumsearch input[type=text] {
141 margin-bottom: 0 !important;
142}
143
35620f63
SH
144#page-mod-forum-discuss .discussioncontrols {
145 width: auto;
146 margin: 0;
8903b17b
BB
147}
148
149#page-footer {
150 margin-top: 1em;
151 padding: 1em 0;
e514c722 152 border-top: 2px solid @tableBorder;
8903b17b
BB
153}
154
155.maincalendar .calendarmonth td,.maincalendar .calendarmonth th {
e514c722 156 border: 1px dotted @tableBorder;
8903b17b
BB
157}
158
159.path-grade-report-grader h1 {
160 text-align: inherit;
161}
162
163#page-mod-chat-gui_basic input#message {
164 max-width: 100%;
165}
166
167#page-mod-data-view #singleimage {
168 width: auto;
169}
170
171.path-mod-data form {
172 margin-top: 10px;
173}
174
175.template_heading {
176 margin-top: 10px;
177}
178
179.breadcrumb-button {
180 float: right;
3355b72e 181 margin-top: 4px;
8903b17b 182}
eef85081 183
41dcfbf1
MA
184.breadcrumb-button .singlebutton {
185 float: left;
186 margin-left: 4px;
187}
188
eef85081
NK
189.dir-rtl {
190 .nav-tabs > li,
191 .nav-pills > li {
192 float: right;
193 }
194}
8903b17b
BB
195.dir-rtl .navbar .brand {
196 float: right;
197}
af9c2dcf 198
af9c2dcf
GB
199.navbar-inverse .logininfo a {
200 color: @navbarInverseLinkColor;
201}
202.navbar-inverse .logininfo a:hover {
203 background-color: @navbarInverseLinkBackgroundHover; // "transparent" is default to differentiate :hover/:focus from .active
204 color: @navbarInverseLinkColorHover;
8903b17b
BB
205}
206
207.navbar-fixed-top,
208.navbar-fixed-bottom {
58183f9b 209 z-index: 4030;
8903b17b
BB
210}
211
212.dir-rtl .breadcrumb-button,
213.dir-rtl .navbar .btn-navbar {
214 float: left;
215}
216
41dcfbf1
MA
217.dir-rtl .breadcrumb-button .singlebutton {
218 float: right;
219 margin-right: 4px;
220}
221
8903b17b 222.ie .row-fluid .desktop-first-column {
58183f9b 223 margin-left: 0;
8903b17b
BB
224}
225.langmenu form {
226 margin: 0;
227}
228.container-fluid {
229 max-width: 1680px;
230 margin: 0 auto;
231}
232// contributed by Paul Hibbitts, see http://msdn.microsoft.com/en-us/library/ie/jj583807(v=vs.85).aspx
233canvas {
234 -ms-touch-action: auto;
235}
236
237div#dock {
238 display: none;
239}
240
9184a2f7
AB
241.path-mod-choice {
242 .horizontal .choices {
243 margin: 0;
244 .option {
245 display: inline-block;
246 padding: 10px;
247 }
248 }
249 .results .data {
250 white-space: normal;
8903b17b
BB
251 }
252}
253
254.path-mod-lesson .firstpageoptions {
255 margin: auto;
256 min-width: 280px;
257 width: 60%;
258}
01a96461
RW
259
260.path-mod-lesson .centerpadded {
261 padding: 5px;
262 text-align: center;
263}
876c0ac3 264
14cdc257
RW
265.path-mod-wiki .wiki_headingtitle,
266.path-mod-wiki .midpad,
267.path-mod-wiki .wiki_headingtime {
268 text-align: inherit;
876c0ac3 269}
14cdc257
RW
270
271.path-mod-wiki .wiki_contentbox {
272 width: 100%;
eef85081 273}
1765866f 274
a36f97f7
JC
275// Dropdown styling.
276.dropdown-menu {
277 > li > a {
278 padding: 3px 20px 3px 8px;
279 }
280}
281.dir-rtl .dropdown-menu {
282 > li > a {
283 padding: 3px 8px 3px 20px;
284 }
285}
286.dir-rtl .dropdown-submenu > .dropdown-menu {
287 .border-radius(6px 0px 6px 6px);
288}
289
290
1765866f
DM
291// Survey module
292
293.path-mod-survey {
294 .surveytable {
e514c722
FM
295 > tbody > tr:nth-of-type(odd) {background-color: @tableBackground;}
296 > tbody > tr:nth-of-type(even) {background-color: @tableBackgroundAccent;}
1765866f
DM
297 .rblock label {text-align: center;}
298 }
299 .resultgraph, .reportsummary, .studentreport, .reportbuttons, .centerpara {
300 text-align:center;
301 }
302}
b549e66e
AB
303// rtl overrides
304.dir-rtl {
8bb2d476 305 &.path-mod-forum .forumheaderlist {
b549e66e
AB
306 thead .header.lastpost {
307 text-align: left;
308 }
8bb2d476
JC
309 .discussion {
310 .lastpost {
311 text-align: left;
312 }
313 }
b549e66e 314 }
a36f97f7
JC
315}
316
317.nav .caret {
318 margin-left: 4px;
319}
320.dir-rtl .nav .caret {
321 margin-right: 4px;
ebfb73db 322}
d9640a99 323
328ef3df
JC
324// Dividers
325.nav {
326 .divider {
327 overflow: hidden;
328 width: 0;
d8d65e76
ME
329 height: @navbarHeight;
330 border-left: 1px solid @navbarBackground;
331 border-right: 1px solid @navbarBackgroundHighlight;
332 }
333}
334.navbar-inverse {
335 .nav {
336 .divider {
337 border-left-color: @navbarInverseBackground;
338 border-right-color: lighten(@navbarInverseBackground, 25%);
339 }
328ef3df
JC
340 }
341}
328ef3df
JC
342.dropdown-menu {
343 .divider {
344 width: auto;
345 height: 1px;
d8d65e76
ME
346 border-left: 0 none;
347 border-right: 0 none;
328ef3df 348 }
d9640a99 349}
6da0e4cf
JC
350
351// Usermenu
352.usermenu {
854a647e
JC
353 .login {
354 color: @navbarText;
355 line-height: 40px;
356 a {
f89a85f8
JC
357 color: @linkColor;
358 &:hover,
359 &:focus {
360 color: @linkColorHover;
361 text-decoration: underline;
362 }
854a647e
JC
363 }
364 }
f89a85f8
JC
365 .moodle-actionmenu {
366
367 .toggle-display {
6da0e4cf 368 display: block;
f89a85f8
JC
369 opacity: 1;
370 color: @navbarLinkColor;
371 line-height: 40px;
372 height: 40px;
373 &:hover {
374 color: @navbarLinkColorHover;
375 }
376
377 .userbutton {
378 height: 40px;
6da0e4cf 379 line-height: 40px;
f89a85f8
JC
380 .avatars{
381 display: inline-block;
382 height: 36px;
383 width: 36px;
384 vertical-align: middle;
385 margin-right: 6px;
386 margin-left: 6px;
387
388 .avatar,
389 img {
390 display: block;
391 }
392 }
393 .usertext {
394 display: inline-block;
395 vertical-align: middle;
396 line-height: 1em;
397 color: inherit;
398 .meta,
399 .role {
400 display: block;
401 font-size: 12px;
402 .value {
403 font-weight: bold;
404 }
405 }
406 .role {
407 font-weight: bold;
408 }
409 }
6da0e4cf 410 }
6da0e4cf 411
f89a85f8
JC
412 // Hide caret when JS is disabled.
413 .caret {
414 display: none;
6da0e4cf
JC
415 }
416 }
f89a85f8
JC
417
418
419 // A little bit of visual feedback for the action menu when Javascript is disabled.
420 .menu {
421 .menu-action.icon {
422 img {
423 border-radius: 0;
424 background: transparent;
425 box-shadow: none;
426 }
427 &:hover img {
428 background: #fff;
429 border-radius: 4px;
430 box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.125);
6da0e4cf
JC
431 }
432 }
6da0e4cf 433 }
f89a85f8
JC
434 &[data-enhanced] .menu {
435 .menu-action.icon,
436 .menu-action.icon:hover {
437 img {
438 border-radius: 0;
439 background: transparent;
440 box-shadow: none;
441 }
442 }
6da0e4cf 443 }
f89a85f8 444
6da0e4cf
JC
445 }
446}
f89a85f8 447.navbar-inverse {
854a647e
JC
448 .usermenu {
449 .login {
450 color: @navbarInverseText;
451 a {
452 color: @navbarInverseLinkColor;
453 &:hover {
454 color: @navbarInverseLinkColorHover;
455 }
456 }
457 }
f89a85f8
JC
458 .moodle-actionmenu {
459 .toggle-display {
460 color: @navbarInverseLinkColor;
461 }
462 .userbutton {
463 .usertext {
854a647e 464 color: @navbarInverseLinkColor;
f89a85f8
JC
465 .meta {
466 color: @navbarInverseText;
467 .value {
468 color: @navbarInverseLinkColor;
469 }
470 }
6da0e4cf
JC
471 }
472 }
f89a85f8
JC
473 &:hover {
474 .usertext {
475 color: @navbarInverseLinkColorHover;
476 .meta {
477 color: @navbarInverseText;
478 .value {
479 color: @navbarInverseLinkColorHover;
480 }
854a647e
JC
481 }
482 }
483 }
f89a85f8 484 &[data-enhanced] .toggle-display.textmenu {
854a647e
JC
485 .caret {
486 border-top-color: @navbarInverseLinkColorHover;
487 }
6da0e4cf 488 }
f89a85f8
JC
489
490 // A little bit of visual feedback for the action menu when Javascript is disabled.
491 .menu {
492 .menu-action.icon {
493 img {
494 border-radius: 0;
495 background: transparent;
496 box-shadow: none;
497 }
498 &:hover img {
499 background: #333;
500 border-radius: 4px;
501 box-shadow: 0px 0px 16px rgba(255, 255, 255, 1);
502 }
503 }
504 }
505 &[data-enhanced] .menu {
506 .menu-action.icon,
507 .menu-action.icon:hover {
508 img {
509 border-radius: 0;
510 background: transparent;
511 box-shadow: none;
512 }
513 }
514 }
6da0e4cf
JC
515 }
516 }
517}
f89a85f8
JC
518
519.jsenabled {
6da0e4cf 520 .usermenu {
f89a85f8
JC
521 .moodle-actionmenu {
522 .toggle-display {
523 display: block;
524
525 &.textmenu {
526 padding-left: 8px;
527 padding-right: 8px;
528 }
529
530 // Show caret when JS is enabled.
531 .caret {
532 display: inline-block;
533 position: relative;
534 top: 9px;
535 }
536 }
537
538 > .menubar {
539 display: block;
540 margin: 0px 0px 2px 0px;
541 }
542 > .menu {
543 min-width: 160px;
544 .filler {
545 display: block;
546 .nav-divider();
547 }
548 }
549
550 &.show {
551 background-color: @navbarLinkBackgroundActive;
552 .menu {
553 padding: 5px 0;
554 margin: 2px 0 0;
555 background-clip: padding-box;
556 &:before {
557 content: '';
558 display: inline-block;
559 border-left: 7px solid transparent;
560 border-right: 7px solid transparent;
561 border-bottom: 7px solid #ccc;
562 border-bottom-color: @dropdownBorder;
563 position: absolute;
564 top: -7px;
565 }
566 &:after {
567 content: '';
568 display: inline-block;
569 border-left: 6px solid transparent;
570 border-right: 6px solid transparent;
571 border-bottom: 6px solid @dropdownBackground;
572 position: absolute;
573 top: -6px;
574 }
575
576 a {
f89a85f8
JC
577 border-radius: 0;
578
8ef43cfd
JC
579 &:focus {
580 text-decoration: none;
581 }
f89a85f8 582 &:hover {
8ef43cfd 583 text-decoration: none;
f89a85f8
JC
584 #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
585 }
586 }
587 &.align-tr-br {
588 margin-top: 2px;
589 }
590 .box-shadow (0 5px 10px rgba(0, 0, 0, 0.2));
591 }
592 &:hover .toggle-display {}
593 }
6da0e4cf 594 }
f89a85f8
JC
595 }
596 .navbar-inverse {
597 .usermenu {
598 .moodle-actionmenu {
599
600 &.show {
601 background-color: @navbarInverseLinkBackgroundActive;
602 }
6da0e4cf
JC
603 }
604 }
f89a85f8
JC
605 }
606}
607
608.dir-ltr {
609 .usermenu {
610 float: right;
611 > .moodle-actionmenu {
612 > .menu {
613 &:before {
614 right: 9px;
615 }
616 &:after {
617 right: 10px;
618 }
619 }
620 > .menubar li a {
621 text-align: right;
622 }
6da0e4cf
JC
623 }
624 }
625 &.userloggedinas .usermenu .userbutton .avatars {
626 .avatar {
627 &.current {
f89a85f8 628 left: 16px;
6da0e4cf
JC
629 }
630 }
631 }
632}
633
634.dir-rtl {
635 .usermenu {
854a647e 636 float: left;
f89a85f8
JC
637 > .moodle-actionmenu {
638 > .menu {
639 margin-right: 0px;
640 &:before {
641 left: 9px;
642 }
643 &:after {
644 left: 10px;
645 }
646 }
647 > .menubar li a {
648 text-align: left;
6da0e4cf 649 }
6da0e4cf
JC
650 }
651 }
652 &.userloggedinas .usermenu .userbutton .avatars {
653 .avatar {
654 &.current {
f89a85f8 655 left: -14px;
6da0e4cf
JC
656 }
657 }
658 }
659}
f89a85f8
JC
660
661
662.userloggedinas .usermenu .userbutton .avatars {
663 .avatar {
664 &.current {
665 position: relative;
666 top: 4px;
667 left: 4px;
668 width: 20px;
669 height: 20px;
670 margin-top: 11px;
671 margin-bottom: -34px;
672 border: 1px solid #fff;
673 border-radius: 50%;
674 box-shadow: -2px -2px 16px rgba(0,0,0,0.25);
675 }
676 img {
677 width: inherit;
678 height: inherit;
679 }
680 overflow: hidden;
681 }
682}