| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132 |
- /* 页面背景 */
- body {
- background-color: #F8F8F8;
- font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Segoe UI, Arial, Roboto, 'PingFang SC', 'miui', 'Hiragino Sans GB', 'Microsoft Yahei', sans-serif;
- }
- .auth-container {
- padding: 0.625rem;
- padding-bottom: 6.25rem;
- }
- /* 顶部提示 */
- .top-tip {
- font-size: 0.75rem;
- color: #666;
- margin-bottom: 0.625rem;
- padding: 0 0.3125rem;
- }
- /* 表单卡片 */
- .form-card {
- background-color: #fff;
- border-radius: 0.625rem;
- padding: 0 0.9375rem;
- margin-bottom: 0.625rem;
- }
- .form-item {
- display: flex;
- align-items: center;
- height: 3.125rem;
- border-bottom: none;
- }
- .label {
- width: 5rem;
- font-size: 0.8125rem;
- /* 13号字体 */
- font-weight: bold;
- color: #333;
- }
- .input-area {
- flex: 1;
- font-size: 0.8125rem;
- /* 13号字体 */
- color: #333;
- }
- .input-placeholder {
- color: #ccc;
- font-size: 0.8125rem;
- /* 13号字体 */
- }
- .read-only-text {
- color: #333;
- font-size: 0.8125rem;
- /* 13号字体 */
- }
- /* ... existing code ... */
- .card-label {
- font-size: 0.8125rem;
- /* 13号字体 */
- color: #333;
- font-weight: bold;
- }
- /* ... existing code ... */
- .next-btn {
- background: linear-gradient(90deg, #FF6F00 0%, #FF5722 100%);
- color: #fff;
- font-size: 0.875rem;
- /* 14号字体 */
- font-weight: bold;
- height: 2.8125rem;
- line-height: 2.8125rem;
- border-radius: 1.40625rem;
- box-shadow: 0 0.3125rem 0.625rem rgba(255, 87, 34, 0.2);
- }
- /* 灰色背景输入框 (复刻图1样式,实际上图1是白色背景+灰色块? 不,图1看起来是整行白色,输入框区域是浅灰块) */
- /* 修正: 图1中输入框是浅灰色的矩形块 */
- .gray-input-box {
- flex: 1;
- height: 2.1875rem;
- background-color: #F8F8F8;
- border-radius: 0.25rem;
- display: flex;
- align-items: center;
- padding: 0 0.625rem;
- }
- .arrow-right {
- width: 0.75rem;
- height: 0.75rem;
- margin-left: auto;
- }
- /* 上传卡片 */
- .upload-card {
- background-color: #fff;
- border-radius: 0.625rem;
- padding: 1.25rem 0;
- margin-bottom: 0.625rem;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- }
- .upload-box {
- width: 18.75rem;
- height: 11.25rem;
- /* 身份证比例 roughly 1.6 */
- background-color: #F8F8F8;
- border: 0.0625rem dashed #eee;
- border-radius: 0.375rem;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- margin-bottom: 0.625rem;
- position: relative;
- overflow: hidden;
- }
- .camera-icon {
- width: 2rem;
- height: 2rem;
- margin-bottom: 0.46875rem;
- /* 使用SVG或图片 */
- }
- .upload-text {
- font-size: 0.8125rem;
- color: #ccc;
- }
- .preview-img {
- width: 100%;
- height: 100%;
- }
- /* 底部按钮 */
- .footer-btn-area {
- margin-top: 1.875rem;
- padding: 0 0.625rem;
- }
|