feat: LMS is now compatible with Frappe Theme (#17600)

* style: UI fixes for frappe_theme compatibility

* chore: minor ui fixes
This commit is contained in:
Shivam Mishra 2019-05-16 16:38:13 +05:30 committed by GitHub
parent 1bcdb094ea
commit 8a976ba8ab
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 52 additions and 57 deletions

View File

@ -1,5 +1,5 @@
<template> <template>
<section class="featured-products-section" :class='sectionType'> <div class="featured-products-section py-3">
<h5 class='featured-heading' v-html="title"></h5> <h5 class='featured-heading' v-html="title"></h5>
<div class="featured-products row"> <div class="featured-products row">
<!-- <p class='lead text-center' v-html="description"></p> --> <!-- <p class='lead text-center' v-html="description"></p> -->
@ -8,11 +8,11 @@
<div class='mt-4 text-center'> <div class='mt-4 text-center'>
<slot name="list-bottom"></slot> <slot name="list-bottom"></slot>
</div> </div>
</section> </div>
</template> </template>
<script> <script>
export default { export default {
props:['title', 'description', 'sectionType'], props:['title', 'description'],
name: "CardList", name: "CardList",
}; };
</script> </script>

View File

@ -8,7 +8,7 @@
<div class='card-body'> <div class='card-body'>
<h5 class="card-title">{{ course.course_name }}</h5> <h5 class="card-title">{{ course.course_name }}</h5>
<span class="course-list text-muted" id="getting-started"> <span class="course-list text-muted" id="getting-started">
{{ course.course_intro }} {{ course.course_intro.substring(0,120) }}
</span> </span>
</div> </div>
<div class='p-3' style="display: flex; justify-content: space-between;"> <div class='p-3' style="display: flex; justify-content: space-between;">

View File

@ -1,5 +1,4 @@
<template> <template>
<section>
<div class="py-5"> <div class="py-5">
<div class="row"> <div class="row">
<div class="col-sm-12"> <div class="col-sm-12">
@ -30,7 +29,6 @@
</div> </div>
<div ></div> <div ></div>
</div> </div>
</section>
</template> </template>
<script> <script>

View File

@ -8,7 +8,7 @@
</div> </div>
<div class='card-body'> <div class='card-body'>
<h5 class='card-title'>{{ program.program_name }}</h5> <h5 class='card-title'>{{ program.program_name }}</h5>
<div class="text-muted">{{ program.description.substring(0,200) }}...</div> <div class="text-muted">{{ program.description.substring(0,120) }}...</div>
</div> </div>
</router-link> </router-link>
<div class='text-right p-3'> <div class='text-right p-3'>

View File

@ -1,6 +1,6 @@
<template> <template>
<div> <div>
<section class='mt-2'> <div class='mt-2'>
<div> <div>
<div class="mt-3 row"> <div class="mt-3 row">
<div class="col-md-8"> <div class="col-md-8">
@ -16,8 +16,8 @@
<youtube-player :url="contentData.url" class="mt-3"/> <youtube-player :url="contentData.url" class="mt-3"/>
<hr> <hr>
</div> </div>
</section> </div>
<section class="video-description-section"> <div class="video-description-section">
<div> <div>
<div class="content" v-html="contentData.description"> <div class="content" v-html="contentData.description">
</div> </div>
@ -30,7 +30,7 @@
Mistake</a> Mistake</a>
</div> </div>
</div> </div>
</section> </div>
</div> </div>
</template> </template>
<script> <script>

View File

@ -1,6 +1,5 @@
<template> <template>
<div> <div>
<breadcrumb/>
<component v-bind:is="currentComponent" :content="content" :type="type"> <component v-bind:is="currentComponent" :content="content" :type="type">
<ContentNavigation :nextContent="nextContent" :nextContentType="nextContentType"/> <ContentNavigation :nextContent="nextContent" :nextContentType="nextContentType"/>
</component> </component>
@ -11,7 +10,6 @@ import Article from "../components/Article.vue"
import Quiz from "../components/Quiz.vue" import Quiz from "../components/Quiz.vue"
import Video from "../components/Video.vue" import Video from "../components/Video.vue"
import ContentNavigation from "../components/ContentNavigation.vue" import ContentNavigation from "../components/ContentNavigation.vue"
import Breadcrumb from "../components/Breadcrumb.vue"
export default { export default {
props:['program_name', 'course_name', 'topic', 'type', 'content'], props:['program_name', 'course_name', 'topic', 'type', 'content'],
@ -56,8 +54,7 @@ export default {
Article, Article,
Video, Video,
Quiz, Quiz,
ContentNavigation, ContentNavigation
Breadcrumb
} }
}; };
</script> </script>

View File

@ -1,9 +1,9 @@
<template> <template>
<div> <div>
<breadcrumb></breadcrumb> <breadcrumb></breadcrumb>
<TopSection v-bind:title="course.course_name" v-bind:description="course.description"> <TopSection v-bind:title="course.course_name" v-bind:description="course.course_intro">
</TopSection> </TopSection>
<CardList :title="'Topics'" :description="''" :sectionType="'section-padding section-bg'"> <CardList :title="'Topics'" :description="''">
<TopicCard slot="card-list-slot" v-for="topic in topicData" :topic="topic" :course_name="course_name" :program_name="program_name" :key="topic.name"/> <TopicCard slot="card-list-slot" v-for="topic in topicData" :topic="topic" :course_name="course_name" :program_name="program_name" :key="topic.name"/>
</CardList> </CardList>
</div> </div>

View File

@ -3,7 +3,7 @@
<TopSection :title="portal.title" :description="portal.description"> <TopSection :title="portal.title" :description="portal.description">
<TopSectionButton/> <TopSectionButton/>
</TopSection> </TopSection>
<CardList :title="'Featured Programs'" :description="'Master ERPNext'" :sectionType="'section-padding section-bg'"> <CardList :title="'Featured Programs'" :description="'Master ERPNext'">
<ProgramCard slot="card-list-slot" v-for="item in featuredPrograms" :key="item.program.name" :program="item.program" :enrolled="item.is_enrolled"/> <ProgramCard slot="card-list-slot" v-for="item in featuredPrograms" :key="item.program.name" :program="item.program" :enrolled="item.is_enrolled"/>
<AButton slot="list-bottom" :type="'primary'" :size="'md'" :route="'List/Program'">View All</AButton> <AButton slot="list-bottom" :type="'primary'" :size="'md'" :route="'List/Program'">View All</AButton>
</CardList> </CardList>

View File

@ -3,7 +3,7 @@
<TopSection :title="'Programs at ' + portal.title" :description="portal.description"> <TopSection :title="'Programs at ' + portal.title" :description="portal.description">
<AButton v-if="isLogin" :type="'primary'" :size="'lg'" :route="{ name: 'signup'}">Sign Up</AButton> <AButton v-if="isLogin" :type="'primary'" :size="'lg'" :route="{ name: 'signup'}">Sign Up</AButton>
</TopSection> </TopSection>
<CardList :title="'All Programs'" :description="''" :sectionType="'section-padding section-bg'"> <CardList :title="'All Programs'" :description="''">
<ProgramCard slot="card-list-slot" v-for="item in masterData" :key="item.program.name" :program="item.program" :enrolled="item.is_enrolled"/> <ProgramCard slot="card-list-slot" v-for="item in masterData" :key="item.program.name" :program="item.program" :enrolled="item.is_enrolled"/>
</CardList> </CardList>
</div> </div>

View File

@ -2,10 +2,10 @@
<div> <div>
<ProfileInfo :enrolledPrograms="enrolledPrograms"></ProfileInfo> <ProfileInfo :enrolledPrograms="enrolledPrograms"></ProfileInfo>
<div v-if="enrolledPrograms"> <div v-if="enrolledPrograms">
<CardList :title="'Your Progress'" :description="''" :sectionType="'section-padding section-bg'"> <CardList :title="'Your Progress'" :description="''">
<ProgressCard slot="card-list-slot" v-for="program in enrolledPrograms" :program="program" :key="program"/> <ProgressCard slot="card-list-slot" v-for="program in enrolledPrograms" :program="program" :key="program"/>
</CardList> </CardList>
<CardList :title="'Quiz Attempts'" :description="''" :sectionType="'section-padding section'"> <CardList :title="''" :description="''">
<ScoreCard slot="card-list-slot" v-for="program in enrolledPrograms" :program="program" :key="program"/> <ScoreCard slot="card-list-slot" v-for="program in enrolledPrograms" :program="program" :key="program"/>
</CardList> </CardList>
</div> </div>

View File

@ -3,7 +3,7 @@
<breadcrumb></breadcrumb> <breadcrumb></breadcrumb>
<TopSection v-bind:title="program.program_name" v-bind:description="program.description"> <TopSection v-bind:title="program.program_name" v-bind:description="program.description">
</TopSection> </TopSection>
<CardList :title="'Courses'" :description="''" :sectionType="'section-padding'"> <CardList :title="'Courses'" :description="''">
<CourseCard slot="card-list-slot" v-for="course in courseData" :course="course" :program_name="program_name" :key="course.name"/> <CourseCard slot="card-list-slot" v-for="course in courseData" :course="course" :program_name="program_name" :key="course.name"/>
</CardList> </CardList>
</div> </div>