page { background-color: #F7F8FA; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", sans-serif; } .container { width: 100%; min-height: 100vh; display: flex; flex-direction: column; box-sizing: border-box; } /* 表单滚动区 */ .form-scroll { flex: 1; padding: 24rpx 0rpx; box-sizing: border-box; margin-top:30rpx; background: #FFFFFF; } /* 表单项 */ .form-item { border-radius: 12rpx; padding: 24rpx; margin-bottom: 16rpx; box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04); position: relative; } .form-label { font-size: 28rpx; color: #1D2129; font-weight: 500; margin-bottom: 16rpx; display: flex; align-items: center; } .required { color: #F53F3F; margin-right: 8rpx; font-size: 32rpx; } .form-input { font-size: 28rpx; color: #1D2129; padding: 8rpx 0; /* border-bottom: 1rpx solid #F2F3F5; */ } .form-input:focus { border-bottom-color: #007545; } .form-input::placeholder { color: #C9CDD4; } /* 地址项 */ .address-input { padding-right: 120rpx; } .address-btn { position: absolute; right: 24rpx; bottom: 24rpx; width: 100rpx; height: 64rpx; line-height: 64rpx; padding: 0; background: #EEF7FF; color: #007545; font-size: 26rpx; border-radius: 8rpx; border: none; } .address-btn::after { border: none; } /* 经纬度项 */ .latitude-item { padding-bottom: 0; } .lat-lng-wrap { display: flex; gap: 16rpx; } .lat-input, .lng-input { flex: 1; border-bottom: 1rpx solid #F2F3F5; padding: 8rpx 0; } /* 文本域 */ .form-textarea { font-size: 28rpx; color: #1D2129; line-height: 1.6; padding: 8rpx 0; min-height: 120rpx; } .form-textarea::placeholder { color: #C9CDD4; } /* 图片上传 */ .upload-wrap { display: flex; flex-wrap: wrap; gap: 16rpx; margin-top: 8rpx; } .upload-item { width: 160rpx; height: 160rpx; border-radius: 8rpx; overflow: hidden; position: relative; } .upload-img { width: 100%; height: 100%; } .upload-del { position: absolute; top: 8rpx; right: 8rpx; width: 40rpx; height: 40rpx; background: rgba(0, 0, 0, 0.5); color: #FFFFFF; font-size: 32rpx; text-align: center; line-height: 40rpx; border-radius: 50%; } .upload-btn { width: 160rpx; height: 160rpx; border: 1rpx dashed #C9CDD4; border-radius: 8rpx; display: flex; flex-direction: column; align-items: center; justify-content: center; } .upload-icon { font-size: 48rpx; color: #C9CDD4; margin-bottom: 8rpx; } .upload-text { font-size: 24rpx; color: #86909C; } .upload-tips { font-size: 24rpx; color: #86909C; align-self: center; margin-top: 20rpx; } /* 提交按钮栏 */ .submit-bar { padding: 20rpx 24rpx; /* background: #FFFFFF; */ box-shadow: 0 -2rpx 12rpx rgba(0, 0, 0, 0.06); } .submit-btn { width: 100%; height: 88rpx; line-height: 88rpx; padding: 0; background: linear-gradient(135deg, #007545 0%, #0F4CD3 100%); color: #FFFFFF; font-size: 32rpx; font-weight: 600; border-radius: 12rpx; border: none; } .submit-btn::after { border: none; } .submit-btn[loading] { background: #86909C; } /* 深色模式适配 */ @media (prefers-color-scheme: dark) { .form-item, .submit-bar { background: #2C2C2E; } .form-label, .form-input, .form-textarea { color: #FFFFFF; } .form-input::placeholder, .form-textarea::placeholder { color: #8E8E93; } .form-input, .lat-input, .lng-input { border-bottom-color: #3A3A3C; } .address-btn { background: #254EDB; color: #FFFFFF; } }