Merged in feature/VBV-576-preview-overlap (pull request #228)

Use different content height for preview

Approved-by: Daniel Egger
This commit is contained in:
Christian Cueni 2023-11-02 16:01:42 +00:00 committed by Daniel Egger
commit fbc97195a4
1 changed files with 13 additions and 2 deletions

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;
}