chamomind/elearning
7
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages 3 Wiki Activity Actions

feat: Initialize core frontend application structure, including layouts, authentication pages, and common UI components.

Browse source
This commit is contained in:
supalerk-ar66 2026-01-26 09:27:31 +07:00
parent ae84e7e879
commit 69eb60f901
16 changed files with 1178 additions and 1396 deletions
Download patch file Download diff file Expand all files Collapse all files

45
Frontend-Learner/layouts/landing.vue
View file

@ -2,39 +2,32 @@
/**
* @file landing.vue
* @description Layout for the landing page (public facing).
* Applies a dark theme by default and includes the public header and footer.
* Uses Quasar QLayout with overlay header.
*/
</script>
<template>
<!-- Landing Layout Container: Forces Dark Theme -->
<div class="landing-layout dark">
<LandingHeader />
<q-layout view="lHh LpR lFf" class="bg-slate-900 text-slate-100 font-inter">
<!-- Main Content Area: Grows to fill available space -->
<main class="flex-grow">
<slot />
</main>
<LandingFooter />
</div>
<!-- Header (Transparent & Overlay) -->
<q-header class="bg-transparent" style="height: auto;">
<LandingHeader />
</q-header>
<!-- Main Content -->
<!-- padding-top: 0 forces content to go under the header (Hero effect) -->
<q-page-container style="padding-top: 0 !important;">
<q-page>
<slot />
</q-page>
</q-page-container>
</q-layout>
</template>
<style>
/*
Layout Styling:
- Flexbox column layout to stick footer to bottom.
- Dark background base.
*/
.landing-layout {
min-height: 100vh;
display: flex;
flex-direction: column;
background-color: #0f172a; /* Slate 900 */
color: #f1f5f9; /* Slate 100 */
}
.flex-grow {
flex-grow: 1;
.font-inter {
font-family: 'Inter', sans-serif;
}
</style>