| .auth-container { |
| display: flex; |
| align-items: center; |
| justify-content: flex-end; /* 使卡片靠右 */ |
| min-height: 100vh; |
| font-family: Arial, sans-serif; |
| background: linear-gradient(180deg, #5F4437, #823c3c); |
| padding: 0 2rem; /* 添加左右内边距 */ |
| } |
| |
| .auth-container img { |
| margin-left: 250px; |
| } |
| |
| .auth-form-section { |
| background: #E4D8C9; /* 米白色 */ |
| padding: 2rem; |
| border-radius: 10px; |
| box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); |
| width: 300px; |
| margin: 0 auto; |
| max-width: 400px; /* 限制卡片最大宽度 */ |
| } |
| |
| .form-group { |
| margin-bottom: 1.2rem; |
| display: flex; |
| flex-direction: column; |
| } |
| |
| label { |
| display: block; |
| font-size: 0.9rem; |
| margin-bottom: 0.5rem; |
| color: #4A3B34; /* 棕色 */ |
| } |
| |
| .form-input { |
| width: 100%; |
| padding: 0.8rem; |
| border: 1px solid #ddd; |
| border-radius: 5px; |
| font-size: 0.9rem; |
| box-sizing: border-box; |
| } |
| |
| .auth-button { |
| padding: 0.8rem 8.4rem; |
| background: #BA929A; /* 粉色 */ |
| color: #4A3B34; /* 棕色 */ |
| border: none; |
| border-radius: 5px; |
| cursor: pointer; |
| font-size: 0.9rem; |
| display: inline-block; |
| } |
| |
| .verify-button { |
| padding: 0.5rem 1rem; /* 更小的内边距 */ |
| background: #BA929A; /* 粉色 */ |
| color: #4A3B34; /* 棕色 */ |
| border: none; |
| border-radius: 5px; |
| cursor: pointer; |
| font-size: 0.8rem; /* 更小的字体 */ |
| display: inline-block; |
| } |
| |
| .link-button { |
| background: none; |
| border: none; |
| color: #4A3B34; /* 棕色 */ |
| /* text-decoration: underline; */ |
| cursor: pointer; |
| font-size: 0.8rem; |
| padding: 0; |
| } |
| |
| .forgot-password { |
| position: absolute; |
| right: 10px; /* 让按钮靠右 */ |
| bottom: 5px; /* 调整到底部 */ |
| font-size: 12px; |
| background: none; |
| border: none; |
| color: #4A3B34; /* 颜色与 "点击注册" 一致 */ |
| cursor: pointer; |
| text-decoration: underline; |
| } |
| |
| |
| .register-link, .login-link { |
| text-align: center; |
| font-size: 0.8rem; |
| margin-top: 1rem; |
| } |