| | |
| | | @import '@/styles/common.scss'; |
| | | |
| | | // .mine-page-wrapper { |
| | | // background-color: $body-background-color; |
| | | // } |
| | | |
| | | .mine-page-bg { |
| | | position: fixed; |
| | | z-index: -1; |
| | |
| | | object-fit: cover; |
| | | } |
| | | |
| | | .mine-page-wrapper { |
| | | .mine-avatar-wrapper { |
| | | .mine-page-top-view { |
| | | display: flex; |
| | | padding: 30px 20px; |
| | | margin-top: 30px; |
| | | |
| | | .mine-avatar { |
| | | width: 120px; |
| | | height: 120px; |
| | | object-fit: cover; |
| | | margin-right: 30px; |
| | | } |
| | | |
| | | .user-info { |
| | | display: flex; |
| | | align-items: center; |
| | | flex: 1; |
| | | min-width: 0; |
| | | display: flex; |
| | | |
| | | .mine-avatar { |
| | | margin-right: 22px; |
| | | } |
| | | |
| | | .user-info { |
| | | .user-info-name { |
| | | font-size: 36px; |
| | | font-weight: bold; |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | flex: 1; |
| | | min-width: 0; |
| | | display: flex; |
| | | flex-direction: column; |
| | | padding: 6px 0; |
| | | justify-content: space-between; |
| | | |
| | | .user-info-item { |
| | | font-weight: 600; |
| | | font-size: 34px; |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | line-height: 44px; |
| | | @include ellipsis; |
| | | } |
| | | .user-info-auth { |
| | | display: inline-flex; |
| | | .user-info-auth-item { |
| | | margin-right: 20px; |
| | | display: inline-flex; |
| | | align-items: center; |
| | | |
| | | .user-info-unCertified { |
| | | display: inline-flex; |
| | | align-items: center; |
| | | height: 34px; |
| | | width: fit-content; |
| | | |
| | | .user-info-unCertified-icon { |
| | | width: 20px; |
| | | height: 28px; |
| | | margin-right: 6px; |
| | | } |
| | | |
| | | .user-info-unCertified-text { |
| | | font-weight: 400; |
| | | font-size: 28px; |
| | | color: boleGetCssVar('text-color', 'secondary'); |
| | | } |
| | | .user-info-unCertified-btn { |
| | | font-weight: 400; |
| | | font-size: 28px; |
| | | color: boleGetCssVar('color', 'primary'); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | .mine-go-login { |
| | | font-size: 40px; |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | line-height: 104px; |
| | | @include ellipsis; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .mine-content-scroll-view { |
| | | padding-top: 26px; |
| | | background-color: transparent; |
| | | |
| | | .mine-order-list { |
| | | margin-bottom: 18px; |
| | | padding: 0 24px; |
| | | .mine-order-list-title { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | border-bottom: 2px solid #eeeeee; |
| | | padding: 24px 0; |
| | | .mine-order-list-title-text { |
| | | font-weight: 600; |
| | | font-size: 28px; |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | line-height: 32px; |
| | | } |
| | | .mine-order-list-title-icon { |
| | | width: 32px; |
| | | height: 32px; |
| | | } |
| | | } |
| | | .mine-order-list-content { |
| | | padding: 24px 0; |
| | | display: flex; |
| | | justify-content: space-around; |
| | | |
| | | .mine-order-list-item { |
| | | display: inline-flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | .mine-order-list-icon { |
| | | width: 64px; |
| | | height: 64px; |
| | | } |
| | | .mine-order-list-text { |
| | | font-size: 28px; |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | .mine-balance { |
| | | margin-bottom: 18px; |
| | | padding: 24px; |
| | | padding-left: 34px; |
| | | .mine-balance-title { |
| | | font-size: 30px; |
| | | line-height: 42px; |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | margin-bottom: 16px; |
| | | } |
| | | .mine-balance-money { |
| | | font-size: 48px; |
| | | line-height: 68px; |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | } |
| | | .mine-balance-btn { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: flex-end; |
| | | font-size: 22px; |
| | | color: boleGetCssVar('text-color', 'regular'); |
| | | line-height: 36px; |
| | | .mine-balance-btn-icon { |
| | | width: 32px; |
| | | height: 32px; |
| | | } |
| | | } |
| | | } |
| | | .mine-list-wrapper { |
| | | border-radius: 12px; |
| | | } |
| | | } |
| | | .mine-list-wrapper { |
| | | margin-top: 60px; |
| | | } |