feat(ui): enforce shared page shell contract
This commit is contained in:
@@ -20,7 +20,10 @@ const requiredUnifiedTokens = [
|
||||
"--unified-shell-bg",
|
||||
"--unified-shell-radius",
|
||||
".unified-action-bar",
|
||||
".unified-section"
|
||||
".unified-section",
|
||||
".ctms-page-shell",
|
||||
".ctms-page-header-row",
|
||||
".ctms-page-content-grid"
|
||||
];
|
||||
|
||||
const missing = [
|
||||
|
||||
@@ -195,7 +195,9 @@
|
||||
<div class="content-wrapper">
|
||||
<router-view v-slot="{ Component }">
|
||||
<transition name="fade-transform" mode="out-in">
|
||||
<component :is="Component" />
|
||||
<div class="ctms-route-shell">
|
||||
<component :is="Component" />
|
||||
</div>
|
||||
</transition>
|
||||
</router-view>
|
||||
</div>
|
||||
@@ -704,6 +706,10 @@ const onCommand = (cmd: string) => {
|
||||
background: #f7f8fb;
|
||||
}
|
||||
|
||||
.ctms-route-shell {
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
/* 过渡动画 */
|
||||
.fade-transform-enter-active,
|
||||
.fade-transform-leave-active {
|
||||
|
||||
@@ -9,6 +9,22 @@
|
||||
--unified-muted-color: #6f84a8;
|
||||
}
|
||||
|
||||
.ctms-page-shell {
|
||||
padding: 16px 20px 20px;
|
||||
}
|
||||
|
||||
.ctms-page-header-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.ctms-page-content-grid {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.unified-shell {
|
||||
background: var(--unified-shell-bg);
|
||||
border: 0;
|
||||
|
||||
Reference in New Issue
Block a user