130 lines
3.6 KiB
HTML
130 lines
3.6 KiB
HTML
{% extends "lms/templates/lms_base.html" %}
|
|
|
|
|
|
{% block title %}
|
|
{{ _("Outline") }} - {{ course.title }}
|
|
{% endblock %}
|
|
|
|
{% block page_content %}
|
|
<main class="common-page-style">
|
|
|
|
<header class="sticky">
|
|
<div class="container w-75">
|
|
<button class="btn btn-primary btn-sm btn-save-course pull-right mt-1">
|
|
{{ _("Save") }}
|
|
</button>
|
|
|
|
<div class="page-title"> {{ _("Course Outline") }} </div>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="container w-75">
|
|
{{ Outline(chapters) }}
|
|
{{ CreateChapter() }}
|
|
{{ EmptyState() }}
|
|
</div>
|
|
</main>
|
|
{% endblock %}
|
|
|
|
{% macro Outline(chapters) %}
|
|
{% if chapters %}
|
|
{% for chapter in chapters %}
|
|
<article>
|
|
<div class="common-card-style column-card p-4 mb-5">
|
|
<div class="level">
|
|
<svg class="icon icon-xs level-item mr-2">
|
|
<use class="" href="#icon-drag"></use>
|
|
</svg>
|
|
<div class="bold-heading">
|
|
{{ chapter.title }}
|
|
</div>
|
|
</div>
|
|
|
|
{% for lesson in get_lessons(course.name, chapter) %}
|
|
<div class="outline-lesson level">
|
|
<svg class="icon icon-xs level-item mr-2">
|
|
<use class="" href="#icon-drag"></use>
|
|
</svg>
|
|
<!-- <div class="icon-bg">
|
|
<svg class="icon icon-sm level-item">
|
|
<use class="" href="#{{ lesson.icon }}">
|
|
</svg>
|
|
</div> -->
|
|
<div class="">
|
|
{{ lesson.title }}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
|
|
<button class="btn btn-default btn-sm align-self-start">
|
|
<svg class="icon icon-xs">
|
|
<use class="" href="#icon-add"></use>
|
|
</svg>
|
|
<span>
|
|
{{ _("Add Lesson") }}
|
|
</span>
|
|
</button>
|
|
</div>
|
|
</article>
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% endmacro %}
|
|
|
|
|
|
{% macro CreateChapter() %}
|
|
<article>
|
|
<div class="common-card-style column-card p-4">
|
|
<div class="field-group">
|
|
<div>
|
|
<div class="field-label">
|
|
{{ _("Chapter Title") }}
|
|
</div>
|
|
<div class="field-description">
|
|
{{ _("Something Short and Concise") }}
|
|
</div>
|
|
</div>
|
|
<div class="">
|
|
<input id="chapter-title" type="text" class="field-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field-group">
|
|
<div>
|
|
<div class="field-label">
|
|
{{ _("Short Description") }}
|
|
</div>
|
|
<div class="field-description">
|
|
{{ _("A breif description about this chapter.") }}
|
|
</div>
|
|
</div>
|
|
<div class="">
|
|
<input id="chapter-description" type="text" class="field-input">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
{% endmacro %}
|
|
|
|
|
|
{% macro EmptyState() %}
|
|
<article class="empty-state">
|
|
<div class="text-center">
|
|
<div class="bold-heading">
|
|
{{ _("You have not added any chapter yet") }}
|
|
</div>
|
|
<div>
|
|
{{ _("Create and manage your chapters from here.") }}
|
|
</div>
|
|
<div class="mt-4">
|
|
<button class="btn btn-default btn-sm">
|
|
<svg class="icon icon-xs">
|
|
<use class="" href="#icon-add"></use>
|
|
</svg>
|
|
<span>
|
|
{{ _("Add Chapter") }}
|
|
</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
{% endmacro %} |