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