/** * 这里是uni-app内置的常用样式变量 * * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量 * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App * */ /** * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能 * * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件 */ /* 颜色变量 */ /* 行为相关颜色 */ /* 文字基本颜色 */ /* 背景颜色 */ /* 边框颜色 */ /* 尺寸变量 */ /* 文字尺寸 */ /* 图片尺寸 */ /* Border Radius */ /* 水平间距 */ /* 垂直间距 */ /* 透明度 */ /* 文章场景相关 */ .edit-profile.data-v-c93de0a0 { min-height: 100vh; background-color: #f5f5f5; position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; padding-bottom: 140rpx; box-sizing: border-box; } .nav-bar.data-v-c93de0a0 { display: flex; align-items: center; height: 88rpx; background: #fff; padding: 0 30rpx; position: fixed; top: 0; left: 0; right: 0; z-index: 100; width: 100vw; box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.03); } .nav-bar .back.data-v-c93de0a0 { padding: 20rpx; margin-left: -20rpx; display: flex; align-items: center; height: 88rpx; } .nav-bar .title.data-v-c93de0a0 { flex: 1; text-align: center; font-size: 34rpx; font-weight: 500; color: #222; letter-spacing: 0.5px; line-height: 88rpx; } .nav-bar .nav-bar-right.data-v-c93de0a0 { width: 44px; height: 88rpx; display: flex; align-items: center; justify-content: flex-end; } .info-container.data-v-c93de0a0 { flex: 1; overflow-y: auto; padding: 0 40rpx 0; box-sizing: border-box; } .info-card.data-v-c93de0a0 { background: linear-gradient(180deg, #fff7e6 0%, #fff 100%); border-radius: 24rpx; box-shadow: 0 8rpx 32rpx rgba(60, 167, 250, 0.08); padding: 48rpx 40rpx 32rpx 40rpx; width: 100%; max-width: 700rpx; margin: 0 auto; position: relative; box-sizing: border-box; } .section-title.data-v-c93de0a0 { font-size: 36rpx; font-weight: bold; color: #222; margin-bottom: 24rpx; } .divider.data-v-c93de0a0 { border-bottom: 2rpx solid #f2f2f2; margin-bottom: 24rpx; } .info-item.data-v-c93de0a0 { margin-bottom: 24rpx; width: 100%; box-sizing: border-box; min-height: 60rpx; display: flex; flex-direction: column; justify-content: center; } .info-item .label.data-v-c93de0a0 { font-size: 28rpx; color: #333; margin-bottom: 12rpx; display: block; } .info-item input.data-v-c93de0a0 { font-size: 32rpx; color: #222; width: 100%; padding: 16rpx 0; border: none; background: none; outline: none; box-sizing: border-box; height: 80rpx; line-height: 48rpx; vertical-align: middle; } .info-item .phone-input.data-v-c93de0a0 { display: flex; align-items: center; width: 100%; box-sizing: border-box; } .info-item .phone-input input.data-v-c93de0a0 { flex: 1; width: 100%; box-sizing: border-box; height: 80rpx; line-height: 48rpx; vertical-align: middle; } .avatar-section .avatar-container.data-v-c93de0a0 { display: flex; gap: 20rpx; width: 100%; box-sizing: border-box; } .avatar-section .avatar-box.data-v-c93de0a0, .avatar-section .new-avatar.data-v-c93de0a0 { padding: 0; margin: 0; width: 150rpx; height: 120rpx; border-radius: 18rpx; background: #f5f5f5; display: flex; align-items: center; justify-content: center; } .avatar-section .avatar-box image.data-v-c93de0a0, .avatar-section .new-avatar.data-v-c93de0a0 { width: 100%; height: 100%; } .save-button.data-v-c93de0a0 { position: fixed; left: 30rpx; right: 30rpx; bottom: calc(env(safe-area-inset-bottom) + 30rpx); height: 90rpx; background: linear-gradient(90deg, #ffd01e 0%, #ffb400 100%); border-radius: 45rpx; display: flex; align-items: center; justify-content: center; box-shadow: 0 4rpx 16rpx rgba(255, 149, 0, 0.08); z-index: 10; } .save-button text.data-v-c93de0a0 { color: #fff; font-size: 32rpx; font-weight: 500; } .upload-status.data-v-c93de0a0 { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 999; display: flex; align-items: center; justify-content: center; } .upload-status .status-mask.data-v-c93de0a0 { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.6); } .upload-status .status-content.data-v-c93de0a0 { position: relative; width: 240rpx; height: 240rpx; background: rgba(0, 0, 0, 0.8); border-radius: 20rpx; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20rpx; } .upload-status .status-content text.data-v-c93de0a0 { color: #fff; font-size: 28rpx; } .upload-status .status-content .loading-icon.data-v-c93de0a0 { width: 60rpx; height: 60rpx; border: 4rpx solid #fff; border-top-color: transparent; border-radius: 50%; animation: spin-c93de0a0 1s linear infinite; } @keyframes spin-c93de0a0 { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .safe-area.data-v-c93de0a0 { padding-bottom: env(safe-area-inset-bottom); }