MDL-38016 Themes - Add a bootstrap theme to core
[moodle.git] / theme / bootstrap / less / moodle / course.less
CommitLineData
8903b17b
BB
1/* course.less */
2.section_add_menus {
3 text-align: right;
4}
5.dir-rtl .section_add_menus {
6 text-align: left;
7}
8.section_add_menus .horizontal div,
9.section_add_menus .horizontal form {
10 display: inline;
11}
12.section_add_menus optgroup {
13 font-weight: normal;
14 font-style: italic;
15}
16.section_add_menus .urlselect {
17 margin-left: .4em;
18}
19.dir-rtl .section_add_menus .urlselect {
20 margin-right: .4em;
21 margin-left: 0;
22}
23.section_add_menus .urlselect select {
24 margin-left: .2em;
25}
26.dir-rtl .section_add_menus .urlselect select {
27 margin-right: .2em;
28 margin-left: 0;
29}
30.section_add_menus .urlselect img.iconhelp {
31 padding: 0;
32 margin: 0;
33 vertical-align: text-bottom;
34}
35
36.site-topic ul.section,
37.course-content ul.section {
38 margin: 1em;
39}
40.section .activity img.activityicon {
41 vertical-align: text-bottom;
42 margin-right: 6px;
43}
44.dir-rtl .section .activity img.activityicon {
45 margin-left: 6px;
46 margin-right: 0;
47}
48.section .activity .activityinstance,
49.section .activity .activityinstance div {
50 display: inline-block;
51}
52.editing .section .activity .activityinstance {
53 min-width: 40%;
54}
55.section .activity .activityinstance > a {
56 display: block;
57}
58.editing_show + .editing_assign,
59.editing_hide + .editing_assign {
60 // if roles icon missing, add space
61 margin-left: 20px;
62}
63.section .activity .commands {
64 white-space: nowrap;
65 display: inline;
66}
67.section .activity.modtype_label .commands {
68 margin-left: 40%;
69 padding-left: 22px;
70}
71.section li.activity {
72 padding: .2em;
73 clear: both;
74}
75.section .activity .activityinstance .groupinglabel {
76 padding-left: .45em;
77}
78.section .activity .availabilityinfo,
79.section .activity .contentafterlink {
80 margin-top: 0.5em;
81 margin-left: 30px;
82}
83.dir-rtl .section .activity .availabilityinfo,
84.dir-rtl .section .activity .contentafterlink {
85 margin-left: 0;
86 margin-right: 30px;
87}
88.section .activity .contentafterlink p {
89 margin: .5em 0;
90}
91.editing .section .activity:hover {
92 background-color: @grayLighter;
93}
94.course-content .section-summary {
95 border: 1px solid #DDD;
96 margin-top: 5px;
97 list-style: none;
98}
99.course-content .section-summary .section-title {
100 margin: 2px 5px 10px 5px;
101}
102.course-content .section-summary .summarytext {
103 margin: 2px 5px 2px 5px;
104}
105.course-content .section-summary .section-summary-activities .activity-count {
106 .muted;
107 font-size: @fontSizeSmall;
108 margin: 3px;
109 white-space: nowrap;
110 display: inline-block;
111}
112.course-content .section-summary .summary {
113 margin-top: 5px;
114}
115.course-content .single-section {
116 margin-top: 1em;
117}
118.course-content .single-section .section-navigation {
119 display: block;
120 padding: 0.5em;
121 margin-bottom: -0.5em;
122}
123.course-content .single-section .section-navigation .title {
124 font-weight: bold;
125 font-size: 108%;
126 clear: both;
127}
128.course-content .single-section .section-navigation .mdl-left {
129 font-weight: normal;
130 float: left;
131 margin-right: 1em;
132}
133.dir-rtl .course-content .single-section .section-navigation .mdl-left {
134 float: right;
135}
136.course-content .single-section .section-navigation .mdl-left .larrow {
137 margin-right: 0.1em;
138}
139.course-content .single-section .section-navigation .mdl-right {
140 font-weight: normal;
141 float: right;
142 margin-left: 1em;
143}
144.dir-rtl .course-content .single-section .section-navigation .mdl-right {
145 float: left;
146}
147.course-content .single-section .section-navigation .mdl-right .rarrow {
148 margin-left: 0.1em;
149}
150.course-content .single-section .section-navigation .mdl-bottom {
151 margin-top: 0;
152}
153.course-content ul li.section.main {
154 border-bottom: 2px solid #eee;
155 margin-top: 0;
156}
157.course-content ul li.section.hidden {
158 opacity: 0.5;
159}
160.course-content ul.topics li.section .content,
161.course-content ul.weeks li.section .content {
162 margin-right: 20px;
163 margin-left: 20px;
164 padding: 0;
165}
166
167.course-content {
168 margin-top: 0;
169}
170
171.course-content ul.topics li.section {
172 padding-bottom: 20px;
173}
174
175.course-content ul.topics li.section .summary {
176 margin-left: 25px;
177}
178
179.path-course-view .completionprogress {
180 margin-left: 25px
181}
182
183.path-course-view .completionprogress {
184 display: block;
185 float: right;
186 height: 20px;
187 position: relative;
188 z-index: 1000;
189}
190
191#page-site-index .subscribelink {
192 text-align: right;
193}
194#page-site-index .headingblock {
195 margin-bottom: 9px;
196}
197
198.path-course-view a.reduce-sections {
199 padding-left: 0.2em;
200}
201.path-course-view .headingblock {
202 margin-bottom: 9px;
203}
204.path-course-view .subscribelink {
205 text-align: right;
206}
207.path-course-view .unread {
208 margin-left: 3em;
209}
210.path-course-view .block.drag .header {
211 cursor: move;
212}
213.path-course-view .completionprogress {
214 text-align: right;
215}
216.dir-rtl.path-course-view .completionprogress {
217 text-align: left;
218}
219.path-course-view .single-section .completionprogress {
220 margin-right: 5px;
221}
222.path-course-view .section .summary {
223 line-height: normal;
224}
225
226.path-site li.activity > div,
227.path-course-view li.activity > div {
228 position: relative;
229}
230.path-course-view li.activity span.autocompletion,
231.path-course-view li.activity form.togglecompletion {
232 float: right;
233}
234.path-course-view li.activity form.togglecompletion .ajaxworking {
235 width: 16px;
236 height: 16px;
237 background: url([[pix:i/ajaxloader]]) no-repeat;
238}
239.dir-rtl.path-course-view li.activity form.togglecompletion,
240.dir-rtl.path-course-view li.activity span.autocompletion {
241 float: left;
242}
243.dir-rtl.path-course-view .completionprogress {
244 float: none;
245}
246.dir-rtl.path-course-view li.activity form.togglecompletion .ajaxworking {
247 right: -22px;
248}
249
250li.section.hidden span.commands a.editing_hide,
251li.section.hidden span.commands a.editing_show {
252 cursor: default;
253}
254ul.weeks h3.sectionname {
255 white-space: nowrap;
256}
257.editing ul.weeks h3.sectionname {
258 white-space: normal;
259}
260
261.section img.movetarget {
262 height: 16px;
263 width: 80px;
264}
265
266#page-course-enrol .generalbox,
267#page-course-enrol .coursebox {
268 margin-top: 20px;
269}
270
271#page-course-pending .singlebutton,
272#page-course-category #renameform,
273#page-course-category #themeform,
274#page-course-category #coursesearch,
275#page-course-category .singlebutton,
276#page-course-editsection .singlebutton {
277 text-align: center;
278}
279#page-course-category #movecourses td img {
280 margin: 0 .22em;
281 vertical-align: text-bottom;
282}
283#page-course-category #movecourses td img.icon {
284 padding: 0;
285}
286
287#coursesearch,
288#coursesearch2 {
289 margin-top: 1em;
290 text-align: center;
291}
292
293#page-course-info .generalbox.icons {
294 text-align: center;
295}
296#page-course-info .generalbox.info {
297 margin-left: auto;
298 margin-right: auto;
299}
300
301#page-course-pending .pendingcourserequests {
302 margin-bottom: 1em;
303}
304#page-course-pending .pendingcourserequests .singlebutton {
305 display: inline;
306}
307#page-course-pending .pendingcourserequests .cell {
308 padding: 0 5px;
309}
310#page-course-pending .pendingcourserequests .cell.c6 {
311 white-space: nowrap;
312}
313
314.coursebox {
315 margin-bottom: 15px;
316 border: 1px dotted #ddd;
317 .border-radius(4px);
318 padding: 5px;
319}
320.coursebox .summary .category {
321 text-align: right;
322}
323.coursebox .teachers li {
324 list-style-type: none;
325 padding: 0;
326 margin: 0;
327}
328.coursebox .enrolmenticons img {
329 margin-right: .45em;
330}
331.coursebox .enrolmenticons {
332 border: 1px dotted #DDDDDD;
333 .border-radius(3px);
334 margin-top: 0.3em;
335 padding: 3px;
336}
337
338.coursebox h3.name {
339 margin: 0;
340}
341
342.coursebox .info,
343.coursebox .summary {
344 border: 0;
345 margin: 0;
346 padding: 0;
347 float: none;
348 width: none;
349 .box-sizing(border-box);
350 display: block;
351 float: left;
352 margin-left: 2.76243%;
353 min-height: 30px;
354}
355
356.coursebox .summary {
357 margin-top: 5px;
358}
359
360.categorylist .category .numberofcourse {
361 font-size: @fontSizeSmall;
362}
363.categorylist .category {
364 padding-top: 5px;
365 padding-bottom: 5px;
366}
367.categorylist .info,
368.categorylist .name,
369.categorylist .category .image {
370 display: inline-block;
371 margin-left: .2em;
372 margin-right: .2em;
373}
374.categorylist .course {
375 padding-left: 24px;
376 margin-bottom: .5em;
377 line-height: 1.5em;
378}
379.categorylist .indentation {
380 margin-left: 24px;
381}
382
383.course ul.section {
384 margin: 5px;
385 padding: 0;
386}
387
388.weeks-format,
389.topics-format {
390 margin-top: 8px;
391 min-width: 763px;
392}
393.categoryboxcontent {
394 border-width: 1px;
395 border-style: solid;
396}
397
398/* Course and category combo list on front page */
399.course_category_tree .controls {
400 visibility: hidden;
401}
402.course_category_tree .controls div {
403 display: inline;
404 cursor: pointer;
405}
406.course_category_tree .category.with_children>.category_label {
407 background-image: url([[pix:moodle|t/expanded]]);
408 background-repeat: no-repeat;
409}
410.course_category_tree .category_label {
411 padding-left: 13px;
412}
413.course_category_tree .category .category {
414 margin: 5px 0;
415}
416.course_category_tree .category .courses {
417 padding-left: 16px;
418}
419.course_category_tree .category .courses .course_link {
420 display: block;
421 background-image: url([[pix:moodle|i/course]]);
422 background-repeat: no-repeat;
423 padding-left: 21px;
424}
425.course_category_tree .category .course {
426 position: relative;
427}
428.course_category_tree .category .course_info {
429 position: absolute;
430 right: 0;
431 top: 0;
432}
433.dir-rtl .course_category_tree .category .course_info {
434 position: static;
435}
436.dir-rtl .course_category_tree .category .course_info a,
437.dir-rtl .course_category_tree .category .course_info div {
438 float: right;
439}
440.dir-rtl .course_category_tree .controls div {
441 padding: 7px;
442}
443.course_category_tree .category .course_info img {
444 margin-left: .45em;
445}
446.dir-rtl .course_category_tree .category .course_info img {
447 margin-right: .45em;
448 margin-left: 0;
449}
450.jsenabled .course_category_tree .controls {
451 visibility: visible;
452}
453.jsenabled .course_category_tree .category.with_children.collapsed .category_label {
454 background-image: url([[pix:moodle|t/collapsed]]);
455}
456.jsenabled .course_category_tree .category.with_children.collapsed .subcategories,
457.jsenabled .course_category_tree .category.with_children.collapsed .courses {
458 display: none;
459}
460
461/**
462 * Overide for RTL layout
463 */
464.dir-rtl .coursebox .info {
465 float: right;
466 text-align: right;
467}
468.dir-rtl .coursebox .summary {
469 text-align: right;
470}
471.dir-rtl .course_category_tree .category.with_children > .category_label {
472 background-position: center right;
473 padding-right: 18px;
474}
475.dir-rtl .course_category_tree .category_label, .dir-rtl .course_category_tree .category .course {
476 padding-right: 18px;
477}
478.dir-rtl.jsenabled .course_category_tree .category.with_children.collapsed .category_label {
479 background-image: url([[pix:moodle|t/collapsed_rtl]]);
480}
481.dir-rtl .course_category_tree .category .courses .course_link {
482 background-position: center right;
483 padding-right: 18px;
484}
485.dir-rtl .categorylist .course {
486 padding-right: 18px;
487}
488
489#page-course-index.dir-rtl .category .image {
490 padding-left: 5px;
491 padding-right: 0;
492}
493#page-course-index.dir-rtl .indentation {
494 padding-left: 0;
495 padding-right: 30px;
496}
497
498table.category_subcategories {
499 margin-bottom: 1em;
500}
501table.category_subcategories td {
502 white-space: nowrap;
503}
504
505span.editinstructions {
506 position: absolute;
507 top: 0;
508 left: 0;
509 margin-top: -22px;
510 margin-left: 30px;
511 line-height: 16px;
512 font-size: @fontSizeSmall;
513 padding: .1em .4em;
514 background-color: @infoBackground;
515 color: @infoText;
516 text-decoration: none;
517 z-index: 9999;
518 .box-shadow(2px 2px 5px 1px #ccc);
519 border: 1px solid @infoBorder;
520}
521.dir-rtl span.editinstructions {
522 left: auto;
523 right: 32px;
524}
525input.titleeditor {
526 width: 330px;
527 vertical-align: text-bottom;
528}
529
530/* Course drag and drop upload styles */
531#dndupload-status {
532 width: 40%;
533 margin: 0 30%;
534 padding: 6px;
535 border: 1px solid @infoBorder;
536 text-align: center;
537 background: @infoBackground;
538 color: @infoText;
539 position: absolute;
540 z-index: 9999;
541 .box-shadow(2px 2px 5px 1px #ccc);
542 .border-bottom-radius(8px);
543 z-index: 0;
544}
545.dndupload-preview {
546 color: #909090;
547 border: 1px dashed #909090;
548 list-style: none;
549 margin-top: .2em;
550 padding: .3em;
551}
552.dndupload-preview img.icon {
553 vertical-align: text-bottom;
554 padding: 0;
555}
556.dndupload-progress-outer {
557 .progress;
558}
559.dndupload-progress-inner {
560 .progress .bar;
561}
562.dndupload-hidden {
563 display: none;
564}
565