fix(style): 家庭圈添加页通栏布局修正与 CSS Modules 构建配置
- config/index.ts miniCssExtractPlugin 开启 ignoreOrder,消除公共 chunk 跨页面 import 顺序不一致的构建告警 - 家庭圈联系人添加页 .page 去掉四周 padding,hero Navbar 通栏接屏, 左右留白改由内容卡/提交按钮自身 margin 提供 - reset.scss 移除多余 @import(variables 已由 sass.resource 前置注入)
This commit is contained in:
parent
f0dbe5b1c5
commit
368fb3b12c
|
|
@ -38,6 +38,11 @@ export default defineConfig(async (merge) => {
|
||||||
modules: {
|
modules: {
|
||||||
exportLocalsConvention: 'camelCaseOnly'
|
exportLocalsConvention: 'camelCaseOnly'
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
// 全部组件样式走 CSS Modules(类名带 hash,互不冲突),
|
||||||
|
// 公共 chunk 内文件顺序无层叠影响,忽略跨页面 import 顺序不一致的告警
|
||||||
|
miniCssExtractPluginOption: {
|
||||||
|
ignoreOrder: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,21 +1,19 @@
|
||||||
|
// page 不加四周 padding:hero Navbar 需通栏接屏,左右留白由内容卡 margin 提供
|
||||||
.page {
|
.page {
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
background: $color-bg;
|
background: $color-bg;
|
||||||
padding: 24px 24px 40px;
|
padding-bottom: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card,
|
.card,
|
||||||
.contactsCard {
|
.contactsCard {
|
||||||
|
margin: 24px 24px 0;
|
||||||
background: $color-bg-white;
|
background: $color-bg-white;
|
||||||
border-radius: $radius-lg;
|
border-radius: $radius-lg;
|
||||||
box-shadow: $shadow-card;
|
box-shadow: $shadow-card;
|
||||||
padding: 8px 32px;
|
padding: 8px 32px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.contactsCard {
|
|
||||||
margin-top: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.formRow {
|
.formRow {
|
||||||
min-height: 104px;
|
min-height: 104px;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -114,9 +112,9 @@
|
||||||
|
|
||||||
.submit {
|
.submit {
|
||||||
height: 96px;
|
height: 96px;
|
||||||
margin-top: 40px;
|
margin: 40px 24px 0;
|
||||||
background: $color-primary-grad;
|
background: $color-primary-grad;
|
||||||
border-radius: 48px;
|
border-radius: $radius-pill;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,4 @@
|
||||||
@import './variables.scss';
|
// variables.scss 由 config/index.ts 的 sass.resource 自动前置到每个 scss 文件,无需在此 @import
|
||||||
|
|
||||||
// designWidth=750 下 1px=1rpx,正文默认字号取 28rpx(=14物理px)
|
// designWidth=750 下 1px=1rpx,正文默认字号取 28rpx(=14物理px)
|
||||||
page {
|
page {
|
||||||
background-color: $color-bg;
|
background-color: $color-bg;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue