elearning/Frontend-Learner/layouts/landing.vue

<script setup lang="ts">
/**
 * @file landing.vue
 * @description Layout for the landing page (public facing).
 * Uses Quasar QLayout with overlay header.
 */
</script>

<template>
  <q-layout view="lHh LpR lFf" class="bg-slate-50 dark:bg-slate-900 text-slate-900 dark:text-slate-100 font-inter">
    
    <!-- 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>
.font-inter {
  font-family: 'Inter', sans-serif;
}
</style>