SEC_Warehouse/src/pages/family/detail.module.scss

210 lines
3.6 KiB
SCSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

.page {
min-height: 100vh;
background: $color-bg;
padding-bottom: 40px;
}
.stateWrap {
margin-top: 80px;
display: flex;
flex-direction: column;
align-items: center;
}
.body {
padding: 24px;
}
// 添加关爱对象虚线卡:与列表页底部加号卡同款式
.addCared {
margin-top: 0;
padding: 48px 32px;
background: $color-bg-white;
border: 1px dashed $color-primary-light-border;
border-radius: $radius-lg;
display: flex;
flex-direction: column;
align-items: center;
}
// 达上限态:灰化降级,明确"不可点"
.addCaredDisabled {
border-color: $color-border;
}
.addCaredIcon {
width: 96px;
height: 96px;
border-radius: $radius-circle;
background: $color-primary-grad;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 16px;
}
.addCaredIconDisabled {
background: $color-bg-disabled;
}
.addCaredIconText {
font-size: 48px;
font-weight: 300;
color: #ffffff;
}
.addCaredIconTextDisabled {
color: $color-text-tertiary;
}
.addCaredText {
font-size: 26px;
color: $color-text-secondary;
}
.addCaredTextDisabled {
color: $color-text-tertiary;
}
.addCaredPressed {
opacity: 0.85;
}
.section {
margin-top: 24px;
}
// 邀请行:open-type=share 的原生 Button 铺满整行(整行可点拉起转发面板),样式与 ListRow 一致
.shareRow {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
min-height: 104px;
padding: 0 32px;
box-sizing: border-box;
margin: 0;
background: $color-bg-white;
border: none;
border-bottom: 1px solid $color-border;
border-radius: 0;
font-size: inherit;
line-height: inherit;
text-align: left;
&::after {
border: none;
}
}
.shareRowPressed {
background: $color-bg-press;
}
.shareLabel {
font-size: 30px;
color: $color-text;
}
.shareArrow {
font-size: 36px;
color: $color-text-placeholder;
}
.sectionTitle {
display: block;
font-size: 26px;
color: $color-text-secondary;
margin: 8px 8px 16px;
}
.sectionEmpty {
display: block;
padding: 32px 8px;
font-size: 26px;
color: $color-text-tertiary;
}
// 家庭成员行「群主」徽章:浅绿底胶囊,右贴箭头
// margin-left:auto 在 flex 行里把它推到最右;Text 需 inline-block 撑高背景
.valueTag {
display: inline-block;
line-height: 1.4;
padding: 6px 20px;
background: $color-primary-light-bg;
border-radius: $radius-pill;
font-size: 22px;
font-weight: 500;
color: $color-primary-deep;
margin-left: auto;
flex-shrink: 0;
}
// 转让群主选人弹层(Modal 内容)
.transferTitle {
display: block;
text-align: center;
font-size: 36px;
font-weight: 600;
color: $color-text;
margin-bottom: 24px;
}
.transferList {
margin-bottom: 16px;
max-height: 600px;
overflow-y: auto;
}
.transferEmpty {
display: block;
padding: 48px 16px;
text-align: center;
font-size: 26px;
color: $color-text-tertiary;
}
.transferItem {
padding: 20px 24px;
background: $color-bg-gray;
border-radius: $radius-md;
margin-bottom: 12px;
}
.transferItemPressed {
background: $color-bg-press;
}
.transferItemName {
display: block;
font-size: 30px;
font-weight: 600;
color: $color-text;
margin-bottom: 6px;
}
.transferItemMeta {
display: block;
font-size: 22px;
color: $color-text-secondary;
}
.transferCancel {
height: 88px;
border-radius: $radius-pill;
background: $color-bg-gray;
display: flex;
align-items: center;
justify-content: center;
margin-top: 8px;
}
.transferCancelPressed {
opacity: 0.85;
}
.transferCancelText {
font-size: 30px;
color: $color-text-secondary;
}