iter(g265): 新增布局骨架组件 layout

This commit is contained in:
HIsheR
2026-10-26 22:48:04 +08:00
parent 617269166a
commit 71cff84932
12 changed files with 299 additions and 12 deletions
+18
View File
@@ -30,6 +30,7 @@ import {
copyButton,
countdown,
dataTable,
layout,
kbd,
highlight,
datePicker,
@@ -1705,6 +1706,23 @@ const content = h(
),
),
),
section(
'sec-layout',
'布局骨架',
'layout:页头 / 侧栏 / 内容 / 页脚一次成型,页头左侧开关可折叠侧栏;内容区自己滚动,页头能吸顶。骨架上不放圆角与投影——那是卡片的事。',
h('div', { style: 'height:280px;overflow:hidden;border-radius:var(--ua-radius-md)' },
layout(
{
header: h('strong', null, '控制台'),
sider: h('div', null, h('div', { class: 'out' }, '概览'), h('div', { class: 'out' }, '订单'), h('div', { class: 'out' }, '设置')),
footer: '© 2026 @ui-arch',
collapsible: true,
sticky: true,
},
card({ title: '内容区' }, typography({ variant: 'paragraph', type: 'secondary', content: '省略 header / sider / footer 时内容区独占整行;长内容页打开 sticky,页头随滚动留在顶部。' })),
),
),
),
);
// 悬浮按钮:fixed 定位,挂 body 不参与页面布局