TradeMate Dev
a2a7cb893b
Desktop (≥1024px): - Tab bar becomes a 220px left sidebar with brand name and nav items - Page content shifts right and max-width constrained to 1200px - Base font-size reset to 16px for readable text - AI assistant floating button stays in bottom-right corner - No change to mobile layout (bottom tab bar preserved)
63 lines
1.2 KiB
Vue
63 lines
1.2 KiB
Vue
<template>
|
|
<router-view />
|
|
</template>
|
|
|
|
<script setup>
|
|
</script>
|
|
|
|
<style>
|
|
/* Global reset */
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html, body, #app {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
|
|
/* Let uni-app framework manage layout for native tabbar */
|
|
uni-page {
|
|
overflow-y: auto !important;
|
|
}
|
|
uni-page-body {
|
|
overflow-y: auto !important;
|
|
min-height: 100% !important;
|
|
}
|
|
|
|
/* ===== Desktop responsive (≥1024px) ===== */
|
|
@media (min-width: 1024px) {
|
|
/* Sidebar — shift page content right */
|
|
uni-page-body {
|
|
margin-left: 220px !important;
|
|
font-size: 16px !important;
|
|
}
|
|
|
|
/* Constrain + center page content */
|
|
uni-page-body > view {
|
|
max-width: 1200px !important;
|
|
margin-left: auto !important;
|
|
margin-right: auto !important;
|
|
padding: 40px 48px !important;
|
|
}
|
|
|
|
/* Cards more breathing room */
|
|
uni-page-body .card {
|
|
padding: 32px !important;
|
|
border-radius: 20px !important;
|
|
}
|
|
|
|
/* Fix floating AI assistant (clear sidebar + reasonable position) */
|
|
.ai-float-btn {
|
|
right: 40px !important;
|
|
bottom: 40px !important;
|
|
}
|
|
.ai-dialog {
|
|
right: 40px !important;
|
|
bottom: 100px !important;
|
|
}
|
|
}
|
|
</style>
|