fix(course): restore mobile mark complete and outline progress card (#942)
* fix(course): pass progress into mobile outline sheet card
The outline sheet bound CourseProgressCard with {courseProgress}, which
sets a courseProgress prop the card does not read. progress was
undefined, so opening the sheet crashed on progress.percent. Pass
progress={courseProgress} and treat missing progress as zeros.
Co-authored-by: Rotimi Best <rotimi-best@users.noreply.github.com>
* fix(course): keep mark complete on mobile student lessons
The mobile bottom nav hid the whole lesson action row, so students had no way to mark a lesson complete. Hide only prev/next when the bottom bar is shown.
Co-authored-by: Rotimi Best <rotimi-best@users.noreply.github.com>
* fix(course): show a check on the right of a completed lesson title
When a student marks a lesson complete, hide the disabled Mark as Complete
button and place a filled check icon on the right of the lesson title.
Co-authored-by: Rotimi Best <rotimi-best@users.noreply.github.com>
* fix(course): show completion check on mobile bottom-nav title
Move the filled check from the lesson page heading to the right of
the active lesson title in the mobile bottom bar.
Co-authored-by: Rotimi Best <rotimi-best@users.noreply.github.com>
---------
This commit is contained in:
co-authored by
Rotimi Best
parent
4fae088626
commit
44f09bbe6b
@@ -124,6 +124,25 @@
|
||||
{/snippet}
|
||||
</Story>
|
||||
|
||||
<Story name="Bottom nav · completed lesson">
|
||||
{#snippet template()}
|
||||
<div class="ui:relative ui:min-h-[200px] ui:bg-background">
|
||||
<PublicCourse.PublicCourseBottomNav
|
||||
positionLabel="2 / 6"
|
||||
sublineLabel="Delving into Data Analysis with Pandas"
|
||||
sublineComplete
|
||||
hasPrev
|
||||
hasNext
|
||||
centerVariant="ring"
|
||||
progressPercent={33}
|
||||
onPrev={() => console.log('prev')}
|
||||
onNext={() => console.log('next')}
|
||||
onOpenSheet={() => console.log('open sheet')}
|
||||
/>
|
||||
</div>
|
||||
{/snippet}
|
||||
</Story>
|
||||
|
||||
<Story name="Mobile sheet · collapse + long course">
|
||||
{#snippet template()}
|
||||
{@const activeSlug = 'module-10-lesson-4'}
|
||||
|
||||
Reference in New Issue
Block a user