新增 ledger.css 设计令牌与桌面端布局,AppRail 左导航、PageHead 桌面页头、ResultsColumn 常驻结果栏;做菜/菜谱/发现/我的/设置/帮助/关于各页做桌面窄屏双形态适配,窄屏仍走原有底部标签栏与弹层交互。
26 lines
580 B
Vue
26 lines
580 B
Vue
<script lang="ts" setup>
|
|
/**
|
|
* 桌面端页面标题区(原型 .page-head)。窄屏仍用 Ionic 顶部栏的标题,这里隐藏。
|
|
*/
|
|
defineProps<{
|
|
title: string
|
|
subtitle?: string
|
|
}>()
|
|
</script>
|
|
|
|
<template>
|
|
<div class="ledger-page-head ledger-desktop-only">
|
|
<div class="ledger-page-titles">
|
|
<h1 class="ledger-page-title">
|
|
{{ title }}
|
|
</h1>
|
|
<p v-if="subtitle" class="ledger-page-sub">
|
|
{{ subtitle }}
|
|
</p>
|
|
</div>
|
|
<div v-if="$slots.default" class="ledger-page-actions">
|
|
<slot />
|
|
</div>
|
|
</div>
|
|
</template>
|