ramon
/
vbv
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use different content height for preview

This commit is contained in:
Christian Cueni 2023-11-02 08:47:14 +01:00
parent 5833c29817
commit 2159473e99
1 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
client/src/pages/learningPath/learningContentPage/LearningContentContainer.vue
View File

@ -14,7 +14,13 @@ defineEmits(["exit"]);
<div>
<div class="absolute bottom-0 top-0 w-full bg-white">
<CoursePreviewBar v-if="courseSessionsStore.hasCourseSessionPreview" />
<div class="h-content overflow-y-auto">
<div
:class="{
'h-content': !courseSessionsStore.hasCourseSessionPreview,
'h-content-preview': courseSessionsStore.hasCourseSessionPreview,
}"
class="overflow-y-auto"
>
<header
class="relative flex h-12 w-full items-center justify-between bg-white px-4 lg:h-16 lg:px-8"
>
@ -34,12 +40,17 @@ defineEmits(["exit"]);
</template>
<style lang="scss" scoped>
$nav-height: 86px;
$nav-height: 86px; // navigation height
$nav-height-preview: $nav-height + 64px; //navigation height + preview bar height
.h-content {
height: calc(100vh - $nav-height);
}
.h-content-preview {
height: calc(100vh - $nav-height-preview);
}
.nav {
height: $nav-height;
}