/** * 这里是uni-app内置的常用样式变量 * * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量 * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App * */ /** * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能 * * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件 */ /* 颜色变量 */ /* 行为相关颜色 */ /* 藏青系主色(高亮) */ /* 文字基本颜色 */ /* 背景颜色 */ /* 边框颜色 */ /* 尺寸变量 */ /* 文字尺寸 */ /* 图片尺寸 */ /* Border Radius */ /* 水平间距 */ /* 垂直间距 */ /* 透明度 */ /* 文章场景相关 */ /* 表单控件尺寸(统一配置,避免页面内硬编码) */ /** * 这里是uni-app内置的常用样式变量 * * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量 * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App * */ /** * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能 * * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件 */ /* 颜色变量 */ /* 行为相关颜色 */ /* 藏青系主色(高亮) */ /* 文字基本颜色 */ /* 背景颜色 */ /* 边框颜色 */ /* 尺寸变量 */ /* 文字尺寸 */ /* 图片尺寸 */ /* Border Radius */ /* 水平间距 */ /* 垂直间距 */ /* 透明度 */ /* 文章场景相关 */ /* 表单控件尺寸(统一配置,避免页面内硬编码) */ .auth-page { padding: 32rpx; display: flex; flex-direction: column; gap: 24rpx; position: relative; min-height: 100vh; } .header { display: flex; align-items: center; justify-content: center; padding: 8rpx 0 0; } .title { font-size: 34rpx; font-weight: 800; color: #111; } .login-hero { display: flex; justify-content: center; padding: 16rpx 0 0; } .login-hero-img { width: 72%; max-width: 560rpx; border-radius: 8rpx; } .panel { display: flex; flex-direction: column; gap: 16rpx; background: transparent; padding: 0; border-radius: 0; border: none; } .panel.minor { margin-top: 12rpx; } .input { background: #ffffff; border: 2rpx solid #e5e7eb; border-radius: 12rpx; padding: 22rpx 20rpx; font-size: 28rpx; } .row { display: flex; gap: 12rpx; align-items: center; } .flex1 { flex: 1; } .btn { padding: 22rpx 20rpx; border-radius: 12rpx; font-weight: 800; text-align: center; } .btn.primary { background: linear-gradient(135deg, #4788ff 0%, #2d6be6 100%); color: #fff; border: 1rpx solid rgba(45, 107, 230, 0.25); width: 72%; margin: 0 auto; padding: 14rpx 16rpx; } .btn.ghost { background: #eef3ff; color: #2d6be6; } /* 右下角快捷入口:贴着登录功能,无边框、无背景 */ .quick-inline { display: flex; gap: 28rpx; justify-content: flex-end; align-items: center; margin-top: 10rpx; } .quick-link { background: transparent !important; color: #2d6be6; border: none !important; outline: none; padding: 0; font-size: 26rpx; font-weight: 700; box-shadow: none; line-height: 1.2; } .quick-link::after { border: none !important; } /* 注册/重置页:验证码按钮与左侧输入框等高,且更紧凑 */ .panel.minor .row > .input { height: 76rpx; padding: 0 20rpx; } .panel.minor .row > .btn.ghost { height: 76rpx; padding: 0 20rpx; border-radius: 12rpx; display: inline-flex; align-items: center; justify-content: center; }