MDL-55402 theme_noname: Convert bootstrapbase to bs4
[moodle.git] / theme / noname / scss / moodle / core.scss
CommitLineData
536f0460
DW
1/* core.less */
2
3/** Page layout CSS starts **/
4.layout-option-noheader #page-header,
5.layout-option-nonavbar #page-navbar,
6.layout-option-nofooter #page-footer,
7.layout-option-nocourseheader .course-content-header,
8.layout-option-nocoursefooter .course-content-footer {
9 display:none;
10}
11
12.empty-region-side-pre #block-region-side-pre, // Pre region is empty.
13.empty-region-side-post #block-region-side-post, // Post region is empty.
14.jsenabled.docked-region-side-post #block-region-side-post, // All post blocks are docked.
15.jsenabled.docked-region-side-pre #block-region-side-pre { // All pre blocks are docked.
16 display:none;
17}
18
19/** Start Legacy styles. Deprecated since Moodle 2.9. See MDL-48160 for further information. **/
20.content-only #region-main.span9, // Two column layout with no block or all blocks docked.
21.empty-region-side-post #region-bs-main-and-pre.span9, // LTR with no post area.
22.empty-region-side-pre #region-bs-main-and-post.span9, // RTL with no pre area.
23.empty-region-side-post #region-bs-main-and-post.span9 #region-main.span8, // RTL with no post area.
24.jsenabled.docked-region-side-post #region-bs-main-and-pre.span9, // LTR with all post blocks docked.
25.jsenabled.docked-region-side-post #region-bs-main-and-post.span9 #region-main.span8,
26.jsenabled.docked-region-side-pre #region-bs-main-and-post.span9 { // RTL with all pre blocks docked.
27 width: 100%;
28}
29
30.empty-region-side-pre #region-bs-main-and-pre.span9 #region-main, // LTR with no pre area.
31.jsenabled.docked-region-side-pre #region-bs-main-and-pre.span9 #region-main { // LTR with all pre blocks docked.
32 float: none;
33 width: 100%;
34}
35
36.empty-region-side-pre #region-bs-main-and-post.span9 #region-main.span8, // RTL with no pre area.
37.jsenabled.docked-region-side-pre #region-bs-main-and-post.span9 #region-main.span8 { // RTL with all pre blocks docked.
38 float: right;
39}
40/** End Legacy styles **/
41
42
43/* Default Three Columns - All
44------------------------------*/
45
46.content-only {
47 #region-main-box,
48 #region-main {
49 width: 100%;
50 }
51}
52.empty-region-side-pre {
53 &.used-region-side-post {
54 #region-main {
55 width: 100%;
56 }
57 }
58}
59.empty-region-side-post {
60 &.used-region-side-pre {
61 #region-main-box {
62 width: 100%;
63 }
64 }
65}
66.jsenabled {
67 &.docked-region-side-pre {
68 &.empty-region-side-pre {
69 &.used-region-side-post {
70 #region-main {
71 width: 100%;
72 }
73 }
74 }
75 }
76 &.docked-region-side-post {
77 &.empty-region-side-post {
78 &.used-region-side-pre {
79 #region-main-box {
80 width: 100%;
81 }
82 }
83 }
84 }
85}
86
87/** Page layout CSS ends **/
88
89.dir-ltr,
90.mdl-left {
91 text-align: left;
92}
93.dir-rtl,
94.mdl-right {
95 text-align: right;
96}
97#add,
98#remove,
99.centerpara,
100.mdl-align {
101 text-align: center;
102}
103a.dimmed,
104a.dimmed:link,
105a.dimmed:visited,
106a.dimmed_text,
107a.dimmed_text:link,
108a.dimmed_text:visited,
109.dimmed_text,
110.dimmed_text a,
111.dimmed_text a:link,
112.dimmed_text a:visited,
113.usersuspended,
114.usersuspended a,
115.usersuspended a:link,
116.usersuspended a:visited,
117.dimmed_category,
118.dimmed_category a {
119 @extend .text-muted
120}
121.activity.label .dimmed_text {
122 opacity: 0.5;
123}
124.unlist,
125.unlist li,
126.inline-list,
127.inline-list li,
128.block .list,
129.block .list li,
130.section li.activity,
131.section li.movehere,
132.tabtree li {
133 list-style: none;
134 margin: 0;
135 padding: 0;
136}
137.inline,
138.inline-list li {
139 display: inline;
140}
141.notifytiny {
142 font-size: $font-size-xs;
143}
144.notifytiny li,
145.notifytiny td {
146 font-size: 100%;
147}
148.red,
149.notifyproblem {
150 @extend .text-warning;
151}
152.green,
153.notifysuccess {
154 @extend .text-success;
155}
156.highlight {
157 @extend .text-info;
158}
159.reportlink {
160 text-align: right;
161}
162a.autolink.glossary:hover {
163 cursor: help;
164}
165/* Block which is hidden if javascript enabled, prevents fickering visible when JS from footer used! */
166.collapsibleregioncaption {
167 white-space: nowrap;
168}
169.pagelayout-mydashboard.jsenabled .collapsibleregioncaption {
170 cursor: pointer;
171}
172.collapsibleregioncaption img {
173 vertical-align: middle;
174}
175
176.jsenabled .hiddenifjs {
177 display: none;
178}
179.visibleifjs {
180 display: none;
181}
182.jsenabled .visibleifjs {
183 display: inline;
184}
185.jsenabled .collapsibleregion {
186 overflow: hidden;
187}
188.jsenabled .collapsed .collapsibleregioninner {
189 visibility: hidden;
190}
191.collapsible-actions {
192 display: none;
193 text-align: right;
194}
195.jsenabled .collapsible-actions {
196 display: block;
197}
198.collapsible-actions .collapseexpand {
199 padding-left: 20px;
200 background: url([[pix:t/collapsed]]) 2px center no-repeat;
201}
202/* rtl:ignore */
203.dir-rtl .collapsible-actions .collapseexpand {
204 background: url([[pix:t/collapsed_rtl]]) right center no-repeat;
205}
206.collapsible-actions .collapse-all {
207 background-image: url([[pix:t/expanded]]);
208}
209.yui-overlay .yui-widget-bd {
210 background-color: #FFEE69;
211 border: 1px solid #A6982B;
212 border-top-color: #D4C237;
213 color: #000000;
214 left: 0;
215 padding: 2px 5px;
216 position: relative;
217 top: 0;
218 z-index: 1;
219}
220.clearer {
221 background: transparent;
222 border-width: 0;
223 clear: both;
224 display: block;
225 height: 1px;
226 margin: 0;
227 padding: 0;
228}
229.bold,
230.warning,
231.errorbox .title,
232.pagingbar .title,
233.pagingbar .thispage {
234 font-weight: bold;
235}
236img.resize {
237 height: 1em;
238 width: 1em;
239}
240.block img.resize,
241.breadcrumb img.resize {
242 height: 0.9em;
243 width: 0.8em;
244}
245/* Icon styles */
246img.icon {
247 height: 16px;
248 vertical-align: text-bottom;
249 width: 16px;
250 padding-right: 6px;
251}
252img.iconsmall {
253 height: 12px;
254 margin-right: 3px;
255 vertical-align: middle;
256 width: 12px;
257 box-sizing: content-box;
258}
259img.iconhelp, .helplink img {
260 height: 16px;
261 padding-left: 3px;
262 vertical-align: text-bottom;
263 width: 16px;
264}
265h1 img.iconhelp, h1 img.icon,
266h2 img.iconhelp, h2 img.icon,
267h3 img.iconhelp, h3 img.icon,
268h4 img.iconhelp, h4 img.icon,
269h5 img.iconhelp, h5 img.icon,
270h6 img.iconhelp, h6 img.icon {
271 vertical-align: middle;
272 padding: 4px;
273}
274img.iconlarge {
275 height: 24px;
276 width: 24px;
277 vertical-align: middle;
278}
279img.iconsort {
280 vertical-align: text-bottom;
281 padding-left: .3em;
282 margin-bottom: .15em;
283}
284img.icontoggle {
285 height: 17px;
286 vertical-align: middle;
287 width: 50px;
288}
289img.iconkbhelp {
290 height: 17px;
291 width: 49px;
292}
293.boxaligncenter {
294 margin-left: auto;
295 margin-right: auto;
296}
297.boxalignright {
298 margin-left: auto;
299 margin-right: 0;
300}
301.boxalignleft {
302 margin-left: 0;
303 margin-right: auto;
304}
305.boxwidthnarrow {
306 width: 30%;
307}
308.boxwidthnormal {
309 width: 50%;
310}
311.boxwidthwide {
312 width: 80%;
313}
314.headermain {
315 font-weight: bold;
316}
317#maincontent {
318 display: block;
319 height: 1px;
320 overflow: hidden;
321}
322img.uihint {
323 cursor: help;
324}
325#addmembersform table {
326 margin-left: auto;
327 margin-right: auto;
328}
329table.flexible .emptyrow {
330 display: none;
331}
332img.emoticon {
333 vertical-align: middle;
334 width: 15px;
335 height: 15px;
336}
337form.popupform,
338form.popupform div {
339 display: inline;
340}
341.arrow_button input {
342 overflow: hidden;
343}
344.action-icon img.smallicon {
345 vertical-align: text-bottom;
346 margin: 0 0.3em;
347}
348
349/** The 1-pixel padding is there to avoid phantom scroll bars on OS X (FF, Safari and Chrome)**/
350.no-overflow {
351 overflow: auto;
352 padding-bottom: 1px;
353}
354.pagelayout-report .no-overflow {
355 overflow: visible;
356}
357.no-overflow > .generaltable {
358 margin-bottom: 0;
359}
360// Accessibility features
361
362// Accessibility: text 'seen' by screen readers but not visual users.
363.accesshide {
364 position: absolute;
365 left: -10000px;
366 font-weight: normal;
367 font-size: 1em;
368}
369span.hide,
370div.hide {
371 display: none;
372}
373// Accessibility: Skip block link, for keyboard-only users.
374a.skip-block,
375a.skip {
376 position: absolute;
377 top: -1000em;
378 font-size: 0.85em;
379 text-decoration: none;
380}
381a.skip-block:focus,
382a.skip-block:active,
383a.skip:focus,
384a.skip:active {
385 position: static;
386 display: block;
387}
388.skip-block-to {
389 display: block;
390 height: 1px;
391 overflow: hidden;
392}
393// Blogs
394.addbloglink {
395 text-align: center;
396}
397.blog_entry .audience {
398 text-align: right;
399 padding-right: 4px;
400}
401.blog_entry .tags {
402 margin-top: 15px;
403}
404.blog_entry .tags .action-icon img.smallicon {
405 height: 16px;
406 width: 16px;
407}
408.blog_entry .content {
409 margin-left: 43px;
410}
411// Group
412#page-group-index #groupeditform {
413 text-align: center;
414}
415#doc-contents h1 {
416 margin: 1em 0 0 0;
417}
418#doc-contents ul {
419 margin: 0;
420 padding: 0;
421 width: 90%;
422}
423#doc-contents ul li {
424 list-style-type: none;
425}
426.groupmanagementtable td {
427 vertical-align: top;
428}
429.groupmanagementtable #existingcell,
430.groupmanagementtable #potentialcell {
431 width: 42%;
432}
433.groupmanagementtable #buttonscell {
434 width: 16%;
435}
436.groupmanagementtable #buttonscell p.arrow_button input {
437 width: auto;
438 min-width: 80%;
439 margin: 0 auto;
440}
441.groupmanagementtable #removeselect_wrapper,
442.groupmanagementtable #addselect_wrapper {
443 width: 100%;
444}
445.groupmanagementtable #removeselect_wrapper label,
446.groupmanagementtable #addselect_wrapper label {
447 font-weight: normal;
448}
449#group-usersummary {
450 width: 14em;
451}
452.groupselector {
453 margin-top: 3px;
454 margin-bottom: 3px;
455 display: inline-block;
456}
457.groupselector label {
458 display: inline-block;
459}
460// Data format selector
461.dataformatselector {
462 margin: 1em 0;
463}
464.dataformatselector label {
465 display: inline-block;
466 margin: 0 5px 10px 0;
467 line-height: 30px;
468 vertical-align: top;
469}
470
471// Login
472.loginbox {
473 margin: 15px;
474 overflow: visible;
475}
476.loginbox.twocolumns {
477 margin: 15px;
478}
479.loginbox h2,
480.loginbox .subcontent {
481 margin: 5px;
482 padding: 10px;
483 text-align: center;
484}
485.loginbox .loginpanel .desc {
486 margin: 0;
487 padding: 0;
488 margin-bottom: 5px;
489 margin-top:15px;
490}
491.loginbox .signuppanel .subcontent {
492 text-align: left;
493}
494.loginbox .loginsub {
495 margin-left: 0;
496 margin-right: 0;
497}
498.loginbox .guestsub,
499.loginbox .forgotsub,
500.loginbox .potentialidps {
501 margin: 5px 12%;
502}
503.loginbox .potentialidps .potentialidplist {
504 margin-left: 40%;
505}
506.loginbox .potentialidps .potentialidplist div {
507 text-align: left;
508}
509.loginbox .loginform {
510 margin-top: 1em;
511 text-align: left;
512}
513.loginbox .loginform .form-label {
514 float: left;
515 text-align: right;
516 width: 49%;
517 white-space: nowrap;
518}
519.loginbox .loginform .form-input {
520 float: right;
521 width: 50%;
522}
523.loginbox .loginform .form-input input {
524 width: 6em;
525}
526.loginbox .signupform {
527 margin-top: 1em;
528 text-align: center;
529}
530.loginbox.twocolumns .loginpanel,
531.loginbox.twocolumns .signuppanel {
532 width: 48%;
533 border: 0;
534 margin: 0;
535 padding: 0;
536 display: block;
537 float: left;
538 margin-left: 2.76243%;
539 min-height: 30px;
540 margin-bottom: -2000px;
541 padding-bottom: 2000px;
542// @include box-sizing(border-box);
543}
544
545.loginbox .potentialidp .smallicon {
546 vertical-align: text-bottom;
547 margin: 0 .3em;
548}
549
550// Notes
551.notepost {
552 margin-bottom: 1em;
553}
554.notepost .userpicture {
555 float: left;
556 margin-right: 5px;
557}
558.notepost .content,
559.notepost .footer {
560 clear: both;
561}
562.notesgroup {
563 margin-left: 20px;
564}
565
566// My Moodle
567.path-my .coursebox .overview {
568 margin: 15px 30px 10px 30px;
569}
570.path-my .coursebox .info {
571 float: none;
572 margin: 0;
573}
574
575// Modules
576.mod_introbox {
577 padding: 10px;
578}
579table.mod_index {
580 width: 100%;
581}
582
583// Comments
584.comment-ctrl {
585 font-size: 12px;
586 display: none;
587 margin: 0;
588 padding: 0;
589}
590.comment-ctrl h5 {
591 margin: 0;
592 padding: 5px;
593}
594.comment-area {
595 max-width: 400px;
596 padding: 5px;
597}
598.comment-area textarea {
599 width: 100%;
600 overflow: auto;
601 &.fullwidth {
602 -webkit-box-sizing: border-box;
603 -moz-box-sizing: border-box;
604 box-sizing: border-box;
605 }
606}
607.comment-area .fd {
608 text-align: right;
609}
610.comment-meta span {
611 color: gray;
612}
613.comment-link img {
614 vertical-align: text-bottom;
615}
616.comment-list {
617 font-size: 11px;
618 overflow: auto;
619 list-style: none;
620 padding: 0;
621 margin: 0;
622}
623.comment-list li {
624 margin: 2px;
625 list-style: none;
626 margin-bottom: 5px;
627 clear: both;
628 padding: .3em;
629 position: relative;
630}
631.comment-list li.first {
632 display: none
633}
634.comment-paging{
635 text-align: center;
636}
637.comment-paging .pageno{
638 padding: 2px;
639}
640.comment-paging .curpage{
641 border: 1px solid #CCC;
642}
643.comment-message .picture {
644 width: 20px;
645 float: left;
646}
647.comment-message .text {
648 margin: 0;
649 padding: 0;
650}
651.comment-message .text p {
652 padding: 0;
653 margin: 0 18px 0 0;
654}
655.comment-delete {
656 position: absolute;
657 top: 0;
658 right: 0;
659 margin: .3em;
660}
661.comment-report-selectall{
662 display: none
663}
664.comment-link {
665 display: none
666}
667.jsenabled .comment-link {
668 display: block
669}
670.jsenabled .showcommentsnonjs{
671 display: none
672}
673.jsenabled .comment-report-selectall{
674 display: inline
675}
676/**
677* Completion progress report
678*/
679.completion-expired {
680 @extend .text-warning;
681}
682.completion-expected {
683 font-size: $font-size-xs;
684}
685.completion-sortchoice,
686.completion-identifyfield {
687 font-size: $font-size-xs;
688 vertical-align: bottom;
689}
690.completion-progresscell {
691 text-align: right;
692}
693.completion-expired .completion-expected {
694 font-weight: bold;
695}
696/**
697* Tags
698*/
699img.user-image {
700 height: 100px;
701 width: 100px;
702}
703#tag-search-box {
704 text-align: center;
705 margin: 10px auto;
706}
707
708.path-tag .tag-index-items .tagarea {
709 border: 1px solid #E3E3E3;
710 border-radius: 4px;
711 padding: 10px;
712 margin-top: 10px;
713}
714
715.path-tag .tag-index-items .tagarea h3 {
716 display: block;
717 padding: 3px 0 10px 0;
718 margin: 0px;
719 font-size: 1.1em;
720 font-weight: bold;
721 line-height: 20px;
722 color: #999;
723 text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5);
724 text-transform: uppercase;
725 word-wrap: break-word;
726 border-bottom: solid 1px #E3E3E3;
727 margin-bottom: 10px;
728}
729
730.path-tag .tagarea .controls,
731.path-tag .tagarea .taggeditems {
732 @include clearfix();
733}
734.path-tag .tagarea .controls,
735.path-tag .tag-backtoallitems {
736 text-align: center;
737}
738.path-tag .tagarea .controls .gotopage.nextpage {
739 float: right;
740}
741.path-tag .tagarea .controls .gotopage.prevpage {
742 float: left;
743}
744.path-tag .tagarea .controls .exclusivemode {
745 display: inline-block;
746}
747.path-tag .tagarea .controls.controls-bottom {
748 margin-top: 5px;
749}
750.path-tag .tagarea .controls .gotopage.nextpage::after {
751 padding-right: 5px;
752 padding-left: 5px;
753 content: "»";
754}
755.path-tag .tagarea .controls .gotopage.prevpage::before {
756 padding-right: 5px;
757 padding-left: 5px;
758 content: "«";
759}
760
761span.flagged-tag,
762tr.flagged-tag,
763span.flagged-tag a,
764tr.flagged-tag a {
765 @extend .text-warning;
766}
767.tag-management-table td,
768.tag-management-table th {
769 vertical-align: middle;
770 padding: 4px;
771}
772.tag-management-table .inplaceeditable.inplaceeditingon input {
773 width: 150px;
774}
775.path-admin-tag .addstandardtags {
776 float: right;
777 img {
778 margin: 0 5px;
779 }
780}
781.path-tag .tag-relatedtags {
782 padding-top: 10px;
783}
784.path-tag .tag-management-box {
785 text-align: right;
786}
787.path-tag .tag-index-toc {
788 padding: 10px;
789 text-align: center;
790}
791.path-tag .tag-index-toc li,
792.path-tag .tag-management-box li {
793 margin-left: 5px;
794 margin-right: 5px;
795}
796.path-tag .tag-management-box li a.edittag {
797 background-image: url([[pix:moodle|i/settings]]);
798}
799.path-tag .tag-management-box li a.flagasinappropriate {
800 background-image: url([[pix:moodle|i/flagged]]);
801}
802.path-tag .tag-management-box li a.removefrommyinterests {
803 background-image: url([[pix:moodle|t/delete]]);
804}
805.path-tag .tag-management-box li a.addtomyinterests {
806 background-image: url([[pix:moodle|t/add]]);
807}
808.path-tag .tag-management-box li a {
809 background-repeat: no-repeat;
810 background-position: left;
811 padding-left: 17px;
812}
813.tag_feed.media-list .media .itemimage {
814 float: left;
815}
816.tag_feed.media-list .media .itemimage img {
817 height: 35px;
818 width: 35px;
819}
820.tag_feed.media-list .media .media-body {
821 padding-right: 10px;
822 padding-left: 10px;
823}
824.tag_feed .media .muted a {
825 @extend .text-muted;
826}
827.tag_cloud {
828 text-align: center;
829}
830.tag_cloud .inline-list li {
831 padding: 0px 0.2em;
832}
833.tag_cloud .tag_overflow {
834 margin-top: 1em;
835 font-style: italic;
836}
837.tag_cloud .s20 {
838 font-size: 2.7em;
839}
840.tag_cloud .s19 {
841 font-size: 2.6em;
842}
843.tag_cloud .s18 {
844 font-size: 2.5em;
845}
846.tag_cloud .s17 {
847 font-size: 2.4em;
848}
849.tag_cloud .s16 {
850 font-size: 2.3em;
851}
852.tag_cloud .s15 {
853 font-size: 2.2em;
854}
855.tag_cloud .s14 {
856 font-size: 2.1em;
857}
858.tag_cloud .s13 {
859 font-size: 2em;
860}
861.tag_cloud .s12 {
862 font-size: 1.9em;
863}
864.tag_cloud .s11 {
865 font-size: 1.8em;
866}
867.tag_cloud .s10 {
868 font-size: 1.7em;
869}
870.tag_cloud .s9 {
871 font-size: 1.6em;
872}
873.tag_cloud .s8 {
874 font-size: 1.5em;
875}
876.tag_cloud .s7 {
877 font-size: 1.4em;
878}
879.tag_cloud .s6 {
880 font-size: 1.3em;
881}
882.tag_cloud .s5 {
883 font-size: 1.2em;
884}
885.tag_cloud .s4 {
886 font-size: 1.1em;
887}
888.tag_cloud .s3 {
889 font-size: 1em;
890}
891.tag_cloud .s2 {
892 font-size: 0.9em;
893}
894.tag_cloud .s1 {
895 font-size: 0.8em;
896}
897.tag_cloud .s0 {
898 font-size: 0.7em;
899}
900.tag_list ul {
901 display: inline;
902}
903.tag_list.hideoverlimit .overlimit {
904 display:none;
905}
906.tag_list .tagmorelink {
907 display:none;
908}
909.tag_list.hideoverlimit .tagmorelink {
910 display:inline;
911}
912.tag_list.hideoverlimit .taglesslink {
913 display:none;
914}
915
916/**
917* Web Service
918*/
919#webservice-doc-generator td {
920 text-align: left;
921 border: 0 solid black;
922}
923/**
924* Smart Select Element
925*/
926.smartselect {
927 position: absolute;
928}
929.smartselect .smartselect_mask {
930 background-color: #fff;
931}
932.smartselect ul {
933 padding: 0;
934 margin: 0;
935}
936.smartselect ul li {
937 list-style: none;
938}
939.smartselect .smartselect_menu {
940 margin-right: 5px;
941}
942.safari .smartselect .smartselect_menu {
943 margin-left: 2px;
944}
945.smartselect .smartselect_menu,
946.smartselect .smartselect_submenu {
947 border: 1px solid #000;
948 background-color: #FFF;
949 display: none;
950}
951.smartselect .smartselect_menu.visible,
952.smartselect .smartselect_submenu.visible {
953 display: block;
954}
955.smartselect .smartselect_menu_content ul li {
956 position: relative;
957 padding: 2px 5px;
958}
959.smartselect .smartselect_menu_content ul li a {
960 color: #333;
961 text-decoration: none;
962}
963.smartselect .smartselect_menu_content ul li a.selectable {
964 color: inherit;
965}
966.smartselect .smartselect_submenuitem {
967 background-image: url([[pix:moodle|t/collapsed]]);
968 background-repeat: no-repeat;
969 background-position: 100%;
970}
971/** Spanning mode */
972.smartselect.spanningmenu .smartselect_submenu {
973 position: absolute;
974 top: -1px;
975 left: 100%;
976}
977.smartselect.spanningmenu .smartselect_submenu a {
978 white-space: nowrap;
979 padding-right: 16px;
980}
981.smartselect.spanningmenu .smartselect_menu_content ul li a.selectable:hover {
982 text-decoration: underline;
983}
984/** Compact mode */
985.smartselect.compactmenu .smartselect_submenu {
986 position: relative;
987 margin: 2px -3px;
988 margin-left: 10px;
989 display: none;
990 border-width: 0;
991 z-index: 1010;
992}
993.smartselect.compactmenu .smartselect_submenu.visible {
994 display: block;
995}
996.smartselect.compactmenu .smartselect_menu {
997 z-index: 1000;
998 overflow: hidden;
999}
1000.smartselect.compactmenu .smartselect_submenu .smartselect_submenu {
1001 z-index: 1020;
1002}
1003.smartselect.compactmenu .smartselect_submenuitem:hover > .smartselect_menuitem_label {
1004 font-weight: bold;
1005}
1006/**
1007* Registration
1008*/
1009#page-admin-registration-register .registration_textfield {
1010 width: 300px;
1011}
1012/**
1013* Enrol
1014*/
1015.userenrolment {
1016 width: 100%;
1017 border-collapse: collapse;
1018}
1019.userenrolment tr {
1020 vertical-align:top;
1021}
1022.userenrolment td {
1023 padding: 0;
1024 height: 41px;
1025}
1026.userenrolment .subfield {
1027 margin-right: 5px;
1028}
1029.userenrolment .col_userdetails .subfield {
1030 margin-left: 40px;
1031}
1032.userenrolment .col_userdetails .subfield_picture {
1033 float: left;
1034 margin-left: 0;
1035}
1036.userenrolment .col_lastseen {
1037 width: 150px;
1038}
1039.userenrolment .col_role {
1040 width: 262px;
1041}
1042.userenrolment .col_role .roles,
1043.userenrolment .col_group .groups {
1044 margin-right: 30px;
1045}
1046.userenrolment .col_role .role,
1047.userenrolment .col_group .group {
1048 float: left;
1049 padding: 3px;
1050 margin: 3px;
1051 white-space: nowrap;
1052}
1053.userenrolment .col_role .role a,
1054.userenrolment .col_group .group a {
1055 margin-left: 3px;
1056 cursor: pointer;
1057}
1058.userenrolment .col_role .addrole,
1059.userenrolment .col_group .addgroup {
1060 float: right;
1061 padding: 3px;
1062 margin: 3px;
1063 > a:hover {
1064 border-bottom:1px solid #666;
1065 }
1066}
1067.userenrolment .col_role .addrole img,
1068.userenrolment .col_group .addgroup img {
1069 vertical-align: baseline;
1070}
1071
1072.userenrolment .hasAllRoles .col_role .addrole {
1073 display: none;
1074}
1075
1076.userenrolment .col_enrol .enrolment {
1077 float: left;
1078 padding: 3px;
1079 margin: 3px;
1080}
1081.userenrolment .col_enrol .enrolment a {
1082 float: right;
1083 margin-left: 3px;
1084}
1085#page-enrol-users {
1086 .enrol_user_buttons {
1087 float: right;
1088 .enrolusersbutton {
1089 display: inline;
1090 div,
1091 form {
1092 display: inline;
1093 margin-right: 0;
1094 }
1095 }
1096 }
1097 #filterform {
1098 @extend .card;
1099 display: inline-block;
1100 .fitem {
1101 display: inline-block;
1102 line-height: $line-height * 2;
1103 margin-right: .3em;
1104 white-space: nowrap;
1105 label {
1106 display: inline;
1107 line-height: $line-height;
1108 padding-right: .3em;
1109 }
1110 :before,
1111 :after {
1112 display: inline;
1113 }
1114 }
1115 div,
1116 fieldset {
1117 display: inline;
1118 float: none;
1119 clear: none;
1120 width: auto;
1121 margin: 0;
1122 }
1123 select,
1124 .ftext input {
1125 width: 7em;
1126 }
1127 input,
1128 select {
1129 margin-bottom: 0;
1130 }
1131 }
1132 .user-enroller-panel .uep-search-results .user .details {
1133 width: 237px;
1134 }
1135 .user-enroller-panel .uep-search-results .cohort .details {
1136 width: 237px;
1137 }
1138}
1139#page-enrol-users .enrol-users-page-action input {
1140 margin-left: 0
1141}
1142.corelightbox {
1143 background-color: #CCC;
1144 position: absolute;
1145 top: 0;
1146 left: 0;
1147 width: 100%;
1148 height: 100%;
1149 text-align: center;
1150}
1151.corelightbox img {
1152 position: fixed;
1153 top: 50%;
1154 left: 50%;
1155}
1156
1157.mod-indent-outer {
1158 display: table;
1159}
1160.mod-indent {
1161 display: table-cell;
1162}
1163.label .mod-indent {
1164 float:left;
1165 padding-top:20px
1166}
1167
1168$mod-indent-size: 30px;
1169/* Creates a series of .mod-indent-# rule declarations based on indent size and number of indent levels. */
1170@for $i from 1 through 16 {
1171 $width: ($i * $mod-indent-size);
1172
1173 .mod-indent-#{$i} {
1174 width: $width;
1175 }
1176}
1177.mod-indent-huge {
1178 width: (16 * $mod-indent-size);
1179}
1180
1181/* Audio player size in 'block' mode (can only change width, height is hardcoded in JS) */
1182.resourcecontent .mediaplugin_mp3 object {
1183 height: 25px;
1184 width: 600px
1185}
1186.resourcecontent audio.mediaplugin_html5audio {
1187 width: 600px
1188}
1189/** Large resource images should avoid hidden overflow **/
1190.resourceimage {
1191 max-width: 100%;
1192}
1193/* Audio player size in 'inline' mode (can only change width, as above) */
1194.mediaplugin_mp3 object {
1195 height: 15px;
1196 width: 300px
1197}
1198audio.mediaplugin_html5audio {
1199 width: 300px
1200}
1201/* TinyMCE moodle media preview frame should not have padding */
1202.core_media_preview.pagelayout-embedded #content {
1203 padding: 0;
1204}
1205.core_media_preview.pagelayout-embedded #maincontent {
1206 height: 0;
1207}
1208body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
1209 padding: 0;
1210 margin: 0;
1211 min-width: 0;
1212 background: none;
1213}
1214.path-rating .ratingtable {
1215 width: 100%;
1216 margin-bottom: 1em;
1217}
1218.path-rating .ratingtable th.rating {
1219 width: 100%;
1220}
1221.path-rating .ratingtable td.rating,
1222.path-rating .ratingtable td.time {
1223 white-space: nowrap;
1224 text-align: center;
1225}
1226.initialbar {
1227 a, strong {
1228 padding-left: 3px;
1229 padding-right: 3px;
1230 }
1231}
1232/* Moodle Dialogue Settings (moodle-core-dialogue) */
1233.moodle-dialogue-base .moodle-dialogue-lightbox {
1234 background-color: #AAA;
1235}
1236.moodle-dialogue-base .hidden,
1237.moodle-dialogue-base .moodle-dialogue-hidden {
1238 display: none;
1239}
1240.no-scrolling {
1241 overflow: hidden;
1242}
1243.moodle-dialogue-base .moodle-dialogue-fullscreen {
1244 left: 0px;
1245 top: 0px;
1246 right: 0px;
1247 bottom: -50px;
1248 position: fixed;
1249}
1250.moodle-dialogue-base .moodle-dialogue-fullscreen .moodle-dialogue-content {
1251 overflow: auto;
1252}
1253.moodle-dialogue-base .moodle-dialogue-fullscreen .closebutton {
1254 width: 28px;
1255 height: 16px;
1256 background-size: 100%;
1257}
1258.moodle-dialogue-base .moodle-dialogue {
1259 padding: 0;
1260 margin: 0;
1261 background: none;
1262 border: none;
1263 z-index: 600;
1264 outline: #000 dotted 0;
1265}
1266.moodle-dialogue-base .moodle-dialogue-wrap {
1267 margin-top: -3px;
1268 margin-left: -3px;
1269 background-color: #fff;
1270 border: 1px solid #ccc;
1271 @include border-radius(10px);
1272 @include box-shadow(5px 5px 20px 0 #666);
1273}
1274.moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd,
1275.moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd.yui3-widget-hd {
1276 margin: 0;
1277 padding: 5px;
1278 font-size: 12px;
1279 font-weight: normal;
1280 letter-spacing: 1px;
1281 color: #333;
1282 text-align: center;
1283 text-shadow: 1px 1px 1px #fff;
1284 @include border-radius(10px 10px 0 0);
1285 border-bottom: 1px solid #bbb;
1286 background: #ccc;
1287 @include gradient-vertical(#fff, #ccc);
1288 filter: 0;
1289}
1290.moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd h1 {
1291 margin: 0;
1292 padding: 0;
1293 display: inline;
1294 font-size: 100%;
1295 font-weight: bold;
1296}
1297.moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd .yui3-widget-buttons {
1298 padding: 5px;
1299}
1300.moodle-dialogue-base .closebutton {
1301 width: 25px;
1302 height: 15px;
1303 float: right;
1304 vertical-align: middle;
1305 display: inline-block;
1306 cursor: pointer;
1307 padding: 0;
1308 background-image: url([[pix:theme|sprite]]);
1309 background-repeat: no-repeat;
1310 border-style: none;
1311}
1312.moodle-dialogue-base .moodle-dialogue .moodle-dialogue-bd {
1313 padding: 1em;
1314 line-height: 2em;
1315 color: #555;
1316 font-size: 12px;
1317}
1318.moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-content {
1319 padding: 0;
1320 background: #FFF;
1321}
1322
1323.moodle-dialogue-base .moodle-dialogue-fullscreen .moodle-dialogue-hd {
1324 padding: 10px;
1325 font-size: 16px;
1326}
1327
1328.moodle-dialogue-base .moodle-dialogue-fullscreen .moodle-dialogue-content {
1329 overflow: auto;
1330 position: absolute;
1331 top: 0px;
1332 bottom: 50px;
1333 left: 0px;
1334 right: 0px;
1335 margin: 0px;
1336 border: 0px;
1337}
1338.moodle-dialogue-base .moodle-dialogue-fullscreen .moodle-dialogue-hd,
1339.moodle-dialogue-base .moodle-dialogue-fullscreen .moodle-dialogue-wrap {
1340 border-radius: 0px;
1341}
1342.moodle-dialogue-confirm .confirmation-dialogue {
1343 text-align: center;
1344}
1345.moodle-dialogue-confirm .confirmation-dialogue input {
1346 text-align: center;
1347}
1348.moodle-dialogue-exception .moodle-exception-message {
1349 text-align: center
1350}
1351.moodle-dialogue-exception .moodle-exception-param label {
1352 font-weight: bold;
1353}
1354.moodle-dialogue-exception .param-stacktrace label {
1355 background-color: #EEE;
1356 border: 1px solid #ccc;
1357 border-bottom-width: 0;
1358}
1359.moodle-dialogue-exception .param-stacktrace pre {
1360 border: 1px solid #ccc;
1361 background-color: #fff;
1362}
1363.moodle-dialogue-exception .param-stacktrace .stacktrace-file {
1364 color: navy;
1365 font-size: $font-size-sm;
1366}
1367.moodle-dialogue-exception .param-stacktrace .stacktrace-line {
1368 @extend .text-warning;
1369 font-size: $font-size-sm;
1370}
1371.moodle-dialogue-exception .param-stacktrace .stacktrace-call {
1372 color: #333;
1373 font-size: 90%;
1374 border-bottom: 1px solid #eee;
1375}
1376.moodle-dialogue-base .moodle-dialogue .moodle-dialogue-content .moodle-dialogue-ft {
1377 padding: 0;
1378 margin: 0.7em 1em;
1379 text-align: right;
1380 background-color: #FFF;
1381 font-size: 12px;
1382}
1383.moodle-dialogue-confirm .confirmation-message {
1384 margin: 0.5em 1em;
1385}
1386.moodle-dialogue-confirm .confirmation-dialogue input {
1387 min-width: 80px
1388}
1389.moodle-dialogue-exception .moodle-exception-message {
1390 margin: 1em;
1391}
1392.moodle-dialogue-exception .moodle-exception-param {
1393 margin-bottom: 0.5em;
1394}
1395.moodle-dialogue-exception .moodle-exception-param label {
1396 width: 150px;
1397}
1398.moodle-dialogue-exception .param-stacktrace label {
1399 display: block;
1400 margin: 0;
1401 padding: 4px 1em;
1402}
1403.moodle-dialogue-exception .param-stacktrace pre {
1404 display: block;
1405 height: 200px;
1406 overflow: auto;
1407}
1408.moodle-dialogue-exception .param-stacktrace .stacktrace-file {
1409 display: inline-block;
1410 margin: 4px 0;
1411}
1412.moodle-dialogue-exception .param-stacktrace .stacktrace-line {
1413 display: inline-block;
1414 width: 50px;
1415 margin: 4px 1em;
1416}
1417.moodle-dialogue-exception .param-stacktrace .stacktrace-call {
1418 padding-left: 25px;
1419 margin-bottom: 4px;
1420 padding-bottom: 4px;
1421}
1422.moodle-dialogue .moodle-dialogue-bd .content-lightbox {
1423 opacity: 0.75;
1424 width: 100%;
1425 height: 100%;
1426 top: 0;
1427 left: 0;
1428 background-color: white;
1429 text-align: center;
1430 padding: 10% 0;
1431}
1432/* Apply a default max-height on tooltip text */
1433.moodle-dialogue .tooltiptext {
1434 max-height: 300px;
1435}
1436
1437.moodle-dialogue-base .moodle-dialogue.moodle-dialogue-tooltip {
1438 z-index: 3001;
1439
1440 .moodle-dialogue-bd {
1441 overflow: auto;
1442 }
1443}
1444
1445/**
1446 * Chooser Dialogues (moodle-core-chooserdialogue)
1447 *
1448 * This CSS belong to the chooser dialogue which should work both with, and
1449 * without javascript enabled
1450 */
1451/* Hide the dialog and it's title */
1452.chooserdialoguebody,
1453.choosertitle {
1454 display: none;
1455}
1456.moodle-dialogue.chooserdialogue .moodle-dialogue-content .moodle-dialogue-ft {
1457 margin: 0;
1458}
1459.chooserdialogue .moodle-dialogue-wrap .moodle-dialogue-bd {
1460 padding: 0;
1461 background: #F2F2F2;
1462 @include border-bottom-radius(10px);
1463}
1464/* Center the submit buttons within the area */
1465.choosercontainer #chooseform .submitbuttons {
1466 padding: 0.7em 0;
1467 text-align: center;
1468}
1469/* Fixed for safari browser on iPhone4S with ios7@mixin */
1470@media (max-height: 639px) {
1471 .ios.safari .choosercontainer #chooseform .submitbuttons {
1472 padding: 45px 0;
1473 }
1474}
1475.choosercontainer #chooseform .submitbuttons input {
1476 min-width: 100px;
1477 margin: 0 0.5em;
1478}
1479/* Various settings for the options area */
1480.choosercontainer #chooseform .options {
1481 position: relative;
1482 border-bottom: 1px solid #BBBBBB;
1483}
1484/* Only set these options if we're showing the js container */
1485.jschooser .choosercontainer #chooseform .alloptions {
1486 overflow-x: hidden;
1487 overflow-y: auto;
1488 max-width: 20.3em;
1489 @include box-shadow(inset 0 0 30px 0px #ccc);
1490 .option {
1491 input[type=radio] {
1492 display: inline-block;
1493 }
1494 .modicon {
1495 display: inline-block;
1496 }
1497 .typename {
1498 display: inline-block;
1499 width: 65%;
1500 }
1501 }
1502}
1503/* Settings for option rows and option subtypes */
1504.choosercontainer #chooseform .moduletypetitle,
1505.choosercontainer #chooseform .option,
1506.choosercontainer #chooseform .nonoption {
1507 margin-bottom: 0;
1508 padding: 0 1.6em 0 1.6em;
1509}
1510.choosercontainer #chooseform .moduletypetitle {
1511 text-transform: uppercase;
1512 padding-top: 1.2em;
1513 padding-bottom: 0.4em;
1514}
1515.choosercontainer #chooseform .option .typename,
1516.choosercontainer #chooseform .option span.modicon img.icon,
1517.choosercontainer #chooseform .nonoption .typename,
1518.choosercontainer #chooseform .nonoption span.modicon img.icon {
1519 padding: 0 0 0 0.5em;
1520}
1521
1522.chooserdialogue-course-modchooser .choosercontainer #chooseform .option span.modicon img.icon,
1523.chooserdialogue-course-modchooser .choosercontainer #chooseform .nonoption span.modicon img.icon {
1524 height: 24px;
1525 width: 24px;
1526}
1527.choosercontainer #chooseform .option input[type=radio],
1528.choosercontainer #chooseform .option span.typename,
1529.choosercontainer #chooseform .option span.modicon {
1530 vertical-align: middle;
1531}
1532.choosercontainer #chooseform .option label {
1533 display: block;
1534 padding: 0.3em 0 0.1em 0;
1535 border-bottom: 1px solid #FFFFFF;
1536}
1537.choosercontainer #chooseform .nonoption {
1538 padding-left: 2.7em;
1539 padding-top: 0.3em;
1540 padding-bottom: 0.1em;
1541}
1542.choosercontainer #chooseform .subtype {
1543 margin-bottom: 0;
1544 padding: 0 1.6em 0 3.2em;
1545}
1546.choosercontainer #chooseform .subtype .typename {
1547 margin: 0 0 0 0.2em;
1548}
1549/* The instruction/help area */
1550.jschooser .choosercontainer #chooseform .instruction,
1551.jschooser .choosercontainer #chooseform .typesummary {
1552 display: none;
1553 position: absolute;
1554 top: 0;
1555 right: 0;
1556 bottom: 0;
1557 left: 20.3em;
1558 margin: 0;
1559 padding: 1.6em;
1560 background-color: #fff;
1561 overflow-x: hidden;
1562 overflow-y: auto;
1563 line-height: 2em;
1564}
1565/* Selected option settings */
1566.jschooser .choosercontainer #chooseform .instruction,
1567.choosercontainer #chooseform .selected .typesummary {
1568 display: block;
1569}
1570.choosercontainer #chooseform .selected {
1571 background-color: #fff;
1572 @include box-shadow(0px 0 10px 0 #ccc);
1573}
1574.section-modchooser-link img.smallicon {
1575 padding: 3px;
1576}
1577/* Form element: listing */
1578.formlistingradio {
1579 padding-bottom: 25px;
1580 padding-right: 10px;
1581}
1582.formlistinginputradio {
1583 float: left;
1584}
1585.formlistingmain {
1586 min-height: 225px;
1587}
1588.formlisting {
1589 position: relative;
1590 margin: 15px 0;
1591 padding: 1px 19px 14px;
1592 background-color: white;
1593 border: 1px solid #DDD;
1594 @include border-radius(4px);
1595}
1596.formlistingmore {
1597 position: absolute;
1598 cursor: pointer;
1599 bottom: -1px;
1600 right: -1px;
1601 padding: 3px 7px;
1602 font-size: 12px;
1603 font-weight: bold;
1604 background-color: whiteSmoke;
1605 border: 1px solid #ddd;
1606 color: #9DA0A4;
1607 @include border-radius(4px 0 4px 0);
1608}
1609.formlistingall {
1610 margin: 15px 0;
1611 padding: 0;
1612 @include border-radius(4px);
1613}
1614.formlistingrow {
1615 cursor: pointer;
1616 border-bottom: 1px solid;
1617 border-color: #E1E1E8;
1618 border-left: 1px solid #E1E1E8;
1619 border-right: 1px solid #E1E1E8;
1620 background-color: #F7F7F9;
1621 @include border-radius(0 0 4px 4px);
1622 padding: 6px;
1623 top: 50%;
1624 left: 50%;
1625 min-height: 34px;
1626 float: left;
1627 width: 150px;
1628}
1629body.jsenabled .formlistingradio {
1630 display: none;
1631}
1632body.jsenabled .formlisting {
1633 display: block;
1634}
1635
1636/* Badges styles */
1637table.collection {
1638 @extend .table;
1639 @extend .table-bordered;
1640 @extend .table-striped;
1641}
1642table.collection .name {
1643 text-align: left;
1644 vertical-align: middle;
1645}
1646table.collection .awards {
1647 width: 10%;
1648 text-align: center;
1649 vertical-align: middle;
1650}
1651table.collection .criteria {
1652 width: 40%;
1653 text-align: left;
1654 vertical-align: top;
1655}
1656table.collection .badgeimage,
1657table.collection .status {
1658 width: 15%;
1659 text-align: center;
1660 vertical-align: middle;
1661}
1662table.collection .description {
1663 width: 25%;
1664 text-align: left;
1665}
1666table.collection .actions {
1667 width: 11em;
1668 text-align: center;
1669 vertical-align: middle;
1670}
1671
1672a.criteria-action {
1673 padding: 0px 3px;
1674 float: right;
1675}
1676div.criteria-description {
1677 padding: 10px 15px;
1678 margin: 5px 0px;
1679 background: none repeat scroll 0 0 #f9f9f9;
1680 border: 1px solid #EEE;
1681}
1682ul.badges {
1683 margin: 0;
1684 list-style: none;
1685}
1686.badges li {
1687 position: relative;
1688 display: inline-block;
1689 padding-top: 1em;
1690 text-align: center;
1691 vertical-align: top;
1692 width: 150px;
1693}
1694.badges li .badge-name {
1695 display: block;
1696 padding: 5px;
1697}
1698.badges li > img {
1699 position: absolute;
1700}
1701.badges li .badge-image {
1702 width: 100px;
1703 height: 100px;
1704 left: 10px;
1705 top: 0px;
1706 z-index: 1;
1707}
1708.badges li .badge-actions {
1709 position: relative;
1710}
1711.badges li .expireimage {
1712 width: 100px;
1713 height: 100px;
1714 left: 25px;
1715 top: 0px;
1716 position: absolute;
1717 z-index: 10;
1718 opacity: 0.85;
1719}
1720
1721#badge-image {
1722 background-color: transparent;
1723 padding: 0;
1724 position: relative;
1725 min-width: 100px;
1726 width: 20%;
1727 display: inline-block;
1728 vertical-align: top;
1729 margin-top: 17px;
1730
1731 .expireimage {
1732 width: 100px;
1733 height: 100px;
1734 left: 0px;
1735 top: 0px;
1736 opacity: 0.85;
1737 position: absolute;
1738 z-index:10;
1739 }
1740
1741 .singlebutton {
1742 padding-top: 5px;
1743
1744 input {
1745 margin-left: 0px;
1746 }
1747 }
1748}
1749#badge-details {
1750 display: inline-block;
1751 width: 79%;
1752}
1753
1754#badge-overview dl,
1755#badge-details dl {
1756 margin: 0;
1757
1758 dt,
1759 dd {
1760 vertical-align: top;
1761 padding: 3px 0;
1762 }
1763 dt {
1764 clear: both;
1765 display: inline-block;
1766 width: 20%;
1767 min-width: 100px;
1768 }
1769 dd {
1770 display: inline-block;
1771 width: 79%;
1772 margin-left: 1%;
1773 }
1774}
1775
1776.badge-profile {
1777 vertical-align: top;
1778}
1779.connected {
1780 @extend .text-success;
1781}
1782.notconnected {
1783 @extend .text-danger;
1784}
1785.connecting {
1786 @extend .text-warning;
1787}
1788#page-badges-award .recipienttable tr td {
1789 vertical-align: top;
1790}
1791#page-badges-award .recipienttable tr td.actions .actionbutton {
1792 margin: 0.3em 0;
1793 padding: 0.5em 0;
1794 width: 100%;
1795}
1796#page-badges-award .recipienttable tr td.existing,
1797#page-badges-award .recipienttable tr td.potential {
1798 width: 42%;
1799}
1800
1801#issued-badge-table .activatebadge {
1802 display: inline-block;
1803}
1804.statusbox.active {
1805 background-color: $state-success-bg;
1806}
1807.statusbox.inactive {
1808 background-color: $state-warning-bg;
1809}
1810.statusbox {
1811 text-align: center;
1812 margin-bottom: 5px;
1813 padding: 5px;
1814}
1815.statusbox .activatebadge {
1816 display: inline-block;
1817}
1818.statusbox .activatebadge input[type=submit]{
1819 margin: 3px;
1820}
1821.activatebadge {
1822 margin: 0px;
1823 text-align: left;
1824 vertical-align: middle;
1825}
1826img#persona_signin {
1827 cursor: pointer;
1828}
1829.addcourse {
1830 float: right;
1831}
1832.invisiblefieldset {
1833 display: inline;
1834 margin: 0;
1835 padding: 0;
1836 border-width: 0;
1837}
1838.breadcrumb-nav {
1839 float: left;
1840 margin-bottom: 10px;
1841}
1842.breadcrumb-button .singlebutton div {
1843 margin-right: 0;
1844}
1845.breadcrumb-nav .breadcrumb {
1846 margin: 0;
1847}
1848
1849/** Header-bar styles **/
1850.page-context-header {
1851 // We need to be explicit about the height of the header.
1852 $pageHeaderHeight: 140px;
1853
1854 // Do not remove these rules.
1855 overflow: hidden;
1856
1857 .page-header-image,
1858 .page-header-headings {
1859 display: block;
1860 position: relative;
1861 }
1862 .page-header-image {
1863 float: left;
1864 margin-right: 1em;
1865 margin-bottom: 1em;
1866 }
1867 .page-header-headings {
1868 margin-top: 30px;
1869 margin-bottom: 10px;
1870
1871 h1 {
1872 display: block;
1873 }
1874 }
1875
1876 .page-header-headings,
1877 .header-button-group {
1878 position: relative;
1879 line-height: 24px;
1880 vertical-align: middle;
1881 }
1882
1883 .header-button-group {
1884 display: block;
1885 float: left;
1886 a {
1887 position: relative;
1888
1889 // Don't touch it unless you know exactly what you are doing.
1890 top: -0.4em;
1891 }
1892 }
1893}
1894
1895/** Action menu component styles **/
1896.moodle-actionmenu,
1897.moodle-actionmenu > ul,
1898.moodle-actionmenu > ul > li {
1899 display: inline-block;
1900}
1901
1902.moodle-actionmenu ul {
1903 padding: 0;
1904 margin: 0;
1905 list-style-type: none;
1906}
1907
1908.section_action_menu .moodle-actionmenu ul.menubar {
1909 margin: 0;
1910}
1911
1912.section_action_menu .moodle-actionmenu ul.menu {
1913 margin: 0 10px 10px 0;
1914}
1915
1916.moodle-actionmenu .toggle-display,
1917.moodle-actionmenu .menu-action-text {
1918 display: none; /** Hidden by default, display none so that we don't take up space. **/
1919}
1920
1921.jsenabled {
1922 .moodle-actionmenu[data-enhance] {
1923 display: block;
1924 .menu {
1925 display:none;
1926 }
1927 .toggle-display {
1928 display: inline; /** JS is enabled, we'll be using it so return display to normal **/
1929 opacity: 0.5;
1930 }
1931 .toggle-display.textmenu {
1932 display: block;
1933 margin-left: 4px;
1934 padding-left: 4px;
1935 padding-right: 4px;
1936
1937 .iconsmall,
1938 .smallicon {
1939 margin: 4px 4px 4px 0px;
1940 padding: 8px 4px 0px 2px;
1941 vertical-align: text-bottom;
1942 }
1943
1944 .caret {
1945 margin-top: 8px;
1946 margin-left: 2px;
1947 border-top-color: $dropdown-link-color;
1948 &:hover,
1949 &:active {
1950 border-top-color: $dropdown-link-active-color;
1951 }
1952 }
1953 }
1954 }
1955 .moodle-actionmenu[data-enhanced] {
1956 .toggle-display {
1957 opacity: 1;
1958 }
1959 .menu-action-text {
1960 display:inline;
1961 }
1962 }
1963}
1964
1965.moodle-actionmenu[data-enhanced].show {
1966
1967 position: relative;
1968
1969 .menu {
1970
1971 display:block;
1972 position: absolute;
1973 text-align: left;
1974 @extend .bg-faded;
1975 border: 1px solid $dropdown-border-color;
1976 z-index:1000;
1977 @include border-radius(5px);
1978 @include box-shadow(5px 5px 20px 0 #666);
1979
1980 a {
1981 display: block;
1982 color: $dropdown-link-color;
1983 padding:2px 1em 2px 28px;
1984 &:hover {
1985 color: $dropdown-link-hover-color;
1986 background-color: $dropdown-link-hover-bg;
1987 }
1988 &:first-child {
1989 @include border-top-radius(4px);
1990 }
1991 &:last-child {
1992 @include border-bottom-radius(4px);
1993 }
1994 }
1995 a.hidden {
1996 display:none;
1997 }
1998 img {
1999 vertical-align: middle;
2000 }
2001 .iconsmall,
2002 .smallicon {
2003 margin: 4px 4px 4px -24px;
2004 padding: 4px;
2005 }
2006 > li {
2007 display:block;
2008 }
2009
2010 /** bottom left of button **/
2011 &.align-tl-bl {top: 100%;left:0;margin-top: 4px;}
2012 &.align-tr-bl {top: 100%;right: 100%;}
2013 &.align-bl-bl {bottom: 100%;left:0;}
2014 &.align-br-bl {bottom: 100%;right: 100%;}
2015 /** bottom right of button **/
2016 &.align-tl-br {top: 100%;left:100%;}
2017 &.align-tr-br {top: 100%;right: 0;margin-top: 4px;}
2018 &.align-bl-br {bottom: 100%;left:100%;}
2019 &.align-br-br {bottom: 100%;right: 0;}
2020 /** top left of button **/
2021 &.align-tl-tl {top: 0;left:0;}
2022 &.align-tr-tl {top: 0;right: 100%;margin-right: 4px;}
2023 &.align-bl-tl {bottom: 100%;left:0;margin-bottom: 4px;}
2024 &.align-br-tl {bottom: 100%;right: 100%;}
2025 /** top right of button **/
2026 &.align-tl-tr {top: 0;left:100%;margin-left: 4px;}
2027 &.align-tr-tr {top: 0;right: 0;}
2028 &.align-bl-tr {bottom: 100%;left:100%;}
2029 &.align-br-tr {bottom: 100%;right: 0;margin-bottom: 4px;}
2030 }
2031 /** no wrap is set - prevent menu items from wrapping **/
2032 &.nowrap-items .menu > li {
2033 white-space: nowrap;
2034 }
2035}
2036
2037.block .moodle-actionmenu {
2038 text-align: right;
2039}
2040
2041ul.dragdrop-keyboard-drag li {
2042 list-style-type: none;
2043}
2044
2045.block-control-actions .moodle-core-dragdrop-draghandle img {
2046 width: 12px;
2047 height: 12px;
2048}
2049
2050a.disabled:hover,
2051a.disabled {
2052 text-decoration: none;
2053 cursor: default;
2054 font-style: italic;
2055 color: #808080;
2056}
2057body.lockscroll {
2058 height: 100%;
2059 overflow: hidden;
2060}
2061
2062.progressbar_container {
2063 max-width: 500px;
2064 margin: 0 auto;
2065}
2066
2067/* IE10 only fix for calendar titling */
2068.ie10 .yui3-calendar-header-label {
2069 display: inline-block;
2070}
2071
2072dd:before,
2073dd:after {
2074 display: block;
2075 content: " ";
2076}
2077dd:after {
2078 clear: both;
2079}
2080
2081// Active tabs with links should have a different
2082// cursor to indicate they are clickable.
2083.nav-tabs > .active > a[href],
2084.nav-tabs > .active > a[href]:hover,
2085.nav-tabs > .active > a[href]:focus {
2086 cursor: pointer;
2087}
2088
2089.inplaceeditable {
2090
2091 &.inplaceeditingon {
2092 position: relative;
2093
2094 .editinstructions {
2095 margin-top: -30px;
2096 font-weight: normal;
2097 margin-right: 0;
2098 margin-left: 0;
2099 left: 0;
2100 right: auto;
2101 white-space: nowrap;
2102 }
2103
2104 input {
2105 width: 330px;
2106 height: 16px;
2107 vertical-align: text-bottom;
2108 margin-bottom: 0;
2109 }
2110
2111 select {
2112 margin-bottom: 0;
2113 }
2114 }
2115
2116 .quickediticon img {
2117 opacity: 0.2;
2118 }
2119
2120 .quickeditlink {
2121 color: inherit;
2122 text-decoration: inherit;
2123 }
2124
2125 &:hover .quickeditlink .quickediticon img,
2126 .quickeditlink:focus .quickediticon img {
2127 opacity: 1;
2128 }
2129
2130 &.inplaceeditable-toggle .quickediticon {
2131 display: none;
2132 }
2133}
2134
2135h3.sectionname .inplaceeditable.inplaceeditingon .editinstructions {
2136 margin-top: -20px;
2137}
2138// Reset for ul.
2139ul {
2140 padding-left: 1rem;
2141}