elearning/frontend_management/app.vue

<template>
  <NuxtLayout>
    <NuxtPage />
  </NuxtLayout>
</template>

<script setup lang="ts">
// This is the main app entry point
</script>

<style>
/* Global font override for production build consistency */
:root {
  --q-body-font-size: 16px !important;
  font-size: 16px !important;
}

html {
  font-size: 16px !important;
}

body,
body.q-body--force-scrollbar-y,
.q-body--force-scrollbar-y {
  font-size: 16px !important;
  font-family: 'Prompt', 'Sarabun', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Force Quasar components to use correct font size */
.q-page,
.q-layout,
.q-drawer,
.q-header,
.q-footer,
.q-card,
.q-card__section,
.q-item,
.q-item__label,
.q-btn,
.q-table,
.q-tabs,
.q-tab,
.q-field,
.q-field__native,
.q-input,
.q-select {
  font-size: inherit !important;
  font-family: inherit !important;
}

/* Typography sizes */
h1, .text-h1 { font-size: 2rem !important; }
h2, .text-h2 { font-size: 1.5rem !important; }
h3, .text-h3 { font-size: 1.25rem !important; }
h4, .text-h4 { font-size: 1.15rem !important; }
h5, .text-h5 { font-size: 1.125rem !important; }
h6, .text-h6 { font-size: 1rem !important; }

.text-body1 { font-size: 1rem !important; }
.text-body2 { font-size: 0.875rem !important; }
.text-caption { font-size: 0.75rem !important; }
.text-overline { font-size: 0.75rem !important; }
.text-subtitle1 { font-size: 1rem !important; }
.text-subtitle2 { font-size: 0.875rem !important; }

/* Fix Quasar button full width - only for buttons */
.q-btn.w-full,
button.w-full {
  width: 100% !important;
}

/* Fix Quasar checkbox styling */
.q-checkbox__inner {
  font-size: 40px !important;
}

.q-checkbox__bg {
  border-radius: 4px !important;
}

.q-checkbox__inner--truthy .q-checkbox__bg {
  background-color: var(--q-primary) !important;
  border-color: var(--q-primary) !important;
}
</style>