parent
5d10886ded
commit
d9b26088eb
@ -0,0 +1,16 @@
|
||||
[
|
||||
{
|
||||
"email": "3454934335@qq.com",
|
||||
"username": "wwb",
|
||||
"registeredAt": "2025-10-11T05:26:22.038Z",
|
||||
"password": "cc43f52af644042612d98dea06cf5b64d8e2f8af1de8065fe83b208f4a6d8875",
|
||||
"updatedAt": "2025-10-11T05:26:22.051Z"
|
||||
},
|
||||
{
|
||||
"email": "3063485007@qq.com",
|
||||
"registeredAt": "2025-10-12T08:56:13.598Z",
|
||||
"username": "wqs",
|
||||
"password": "be0c664d19564b568c4dd76d00a26a08ee89214877e52225eee5ffefab36c15f",
|
||||
"updatedAt": "2025-10-12T08:56:13.606Z"
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,14 @@
|
||||
{
|
||||
"name": "math-learning-backend",
|
||||
"version": "1.0.0",
|
||||
"description": "小初高数学学习软件 - 后端业务逻辑",
|
||||
"main": "utils/",
|
||||
"scripts": {
|
||||
"install-deps": "npm install"
|
||||
},
|
||||
"dependencies": {
|
||||
"nodemailer": "^6.9.7"
|
||||
},
|
||||
"author": "Pair Backend",
|
||||
"license": "MIT"
|
||||
}
|
||||
@ -0,0 +1,483 @@
|
||||
/* CSS变量定义 - 主题色彩配置 */
|
||||
:root {
|
||||
--bg: #0e1116;
|
||||
--border: #202734;
|
||||
--danger: #ef4444;
|
||||
--muted: #9aa4b2;
|
||||
--panel: #151a21;
|
||||
--primary: #3b82f6;
|
||||
--primary-2: #2563eb;
|
||||
--success: #22c55e;
|
||||
--text: #e8edf3;
|
||||
}
|
||||
|
||||
/* 全局盒模型设置 */
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 页面高度设置 */
|
||||
html,
|
||||
body,
|
||||
#app {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* 页面基础样式 */
|
||||
body {
|
||||
background: var(--bg);
|
||||
color: var(--text);
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* 应用头部样式 */
|
||||
.app-header {
|
||||
align-items: center;
|
||||
border-bottom: 1px solid var(--border);
|
||||
display: flex;
|
||||
height: 80px;
|
||||
justify-content: space-between;
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
/* 应用标题样式 */
|
||||
.app-title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* 应用操作按钮区域 */
|
||||
.app-actions {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
/* 链接按钮样式 */
|
||||
.app-actions .link {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--primary);
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
/* 用户信息框样式 */
|
||||
.user-box {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
/* 头像容器样式 */
|
||||
.avatar-container {
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* 用户头像样式 */
|
||||
.avatar {
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
background: #233;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 50%;
|
||||
height: 40px;
|
||||
image-rendering: -webkit-optimize-contrast;
|
||||
image-rendering: crisp-edges;
|
||||
image-rendering: high-quality;
|
||||
image-rendering: pixelated;
|
||||
object-fit: cover;
|
||||
transform: translateZ(0);
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
/* 用户名样式 */
|
||||
.user-name {
|
||||
color: #cbd5e1;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
height: 42px;
|
||||
line-height: 40px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 用户操作按钮区域 */
|
||||
.user-actions {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
/* 主视图容器样式 */
|
||||
.view-container {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
height: calc(100% - 80px);
|
||||
justify-content: center;
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
/* 页面视图样式 */
|
||||
.view {
|
||||
background: var(--panel);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 12px;
|
||||
display: none;
|
||||
max-width: 100%;
|
||||
min-height: 440px; /* 固定高度避免跳动 */
|
||||
padding: 24px;
|
||||
width: 860px;
|
||||
}
|
||||
|
||||
.view.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 注册页面样式 */
|
||||
/* 注册页按钮与上方间距 */
|
||||
#view-register .primary {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* 登录页面样式 */
|
||||
/* 登录页：增加表单项间距 */
|
||||
#view-login .form-group {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/* 设置密码页面样式 */
|
||||
/* 设置密码页：调大首个分组间距，调小按钮上边距 */
|
||||
#view-set-password .form-group:first-of-type {
|
||||
margin-bottom: 22px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
#view-set-password .form-group:first-of-type label {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
#view-set-password .primary {
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
/* 年级选择页面样式 */
|
||||
/* 年级选择：标题与卡片拉开距离并居中卡片 */
|
||||
#view-grade h2 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#view-grade .grade-grid {
|
||||
margin-top: 80px; /* 增加与标题的距离，减少下方空白 */
|
||||
justify-content: center; /* 居中排列 */
|
||||
grid-template-columns: repeat(3, 200px); /* 固定宽度列，利于视觉对齐 */
|
||||
max-width: 680px; /* 容器最大宽度，便于居中 */
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
gap: 16px; /* 稍大空隙更美观 */
|
||||
}
|
||||
|
||||
/* 生成题目页面样式 */
|
||||
/* 生成题目：标题与输入区域拉开距离 */
|
||||
#view-count h2 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#view-count .form-group.small {
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
/* 答题页面样式 */
|
||||
/* 答题页：对齐选项单选与文本；增加内部间距，防止与按钮重叠的视觉拥挤 */
|
||||
.quiz-card {
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.question {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.options {
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.options li label {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.options input[type="radio"] {
|
||||
margin-bottom: 1px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/* 成绩页面样式 */
|
||||
/* 成绩页居中+留白与间距，避免拥挤 */
|
||||
#view-result.view.active {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 32px 24px; /* 增加内部留白 */
|
||||
gap: 16px; /* 元素之间更舒展 */
|
||||
}
|
||||
|
||||
/* 通用标题与表单控件样式 */
|
||||
h2 {
|
||||
font-size: 20px;
|
||||
margin: 0 0 16px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.form-group.small {
|
||||
max-width: 320px;
|
||||
}
|
||||
|
||||
label {
|
||||
color: var(--muted);
|
||||
font-size: 13px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
input[type="email"], input[type="text"], input[type="password"], input[type="number"] {
|
||||
background: #0c1016;
|
||||
border: 1px solid var(--border);
|
||||
color: var(--text);
|
||||
padding: 10px 12px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.hint {
|
||||
color: var(--muted);
|
||||
font-size: 12px;
|
||||
min-height: 16px;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
align-items: flex-end;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
button {
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
padding: 10px 14px;
|
||||
}
|
||||
|
||||
button.primary {
|
||||
background: var(--primary);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
button.primary:hover {
|
||||
background: var(--primary-2);
|
||||
}
|
||||
|
||||
button.secondary {
|
||||
background: #2a3342;
|
||||
color: #cbd5e1;
|
||||
}
|
||||
|
||||
button.danger {
|
||||
background: var(--danger);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.toast {
|
||||
color: var(--success);
|
||||
margin-top: 8px;
|
||||
min-height: 18px;
|
||||
}
|
||||
|
||||
/* 年级选择栅格与卡片样式 */
|
||||
.grade-grid {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
|
||||
.grade-card {
|
||||
background: #0c1016;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 12px;
|
||||
color: #e5e7eb;
|
||||
font-size: 18px;
|
||||
height: 128px;
|
||||
}
|
||||
|
||||
.grade-card:hover {
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
/* 答题页面题干与选项容器样式 */
|
||||
.quiz-header {
|
||||
color: var(--muted);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.quiz-card {
|
||||
background: #0c1016;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 300px;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.question {
|
||||
font-size: 18px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.options {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.options li {
|
||||
align-items: center;
|
||||
background: #0f1420;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.quiz-actions {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
justify-content: flex-end;
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
.quiz-actions .primary {
|
||||
order: 1;
|
||||
}
|
||||
|
||||
.quiz-actions .secondary {
|
||||
order: 2;
|
||||
}
|
||||
|
||||
/* 成绩页面分数与操作按钮样式 */
|
||||
.score {
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background: linear-gradient(90deg, #60a5fa, #a78bfa);
|
||||
background-clip: text;
|
||||
font-size: 64px; /* 更醒目 */
|
||||
font-weight: 700;
|
||||
line-height: 1.05;
|
||||
margin: 8px 0 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.result-actions {
|
||||
display: flex;
|
||||
gap: 16px; /* 按钮更疏朗 */
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#view-result .result-actions button {
|
||||
min-width: 128px;
|
||||
height: 42px;
|
||||
padding: 0 16px;
|
||||
box-shadow: 0 6px 16px rgba(0,0,0,0.25);
|
||||
transition: transform .15s ease, box-shadow .15s ease;
|
||||
}
|
||||
|
||||
#view-result .result-actions button:hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 10px 24px rgba(0,0,0,0.28);
|
||||
}
|
||||
|
||||
/* 模态框样式（修改用户名/密码） */
|
||||
.modal-mask {
|
||||
align-items: center;
|
||||
background: rgba(0,0,0,0.5);
|
||||
display: flex;
|
||||
inset: 0;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.modal {
|
||||
background: var(--panel);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 12px;
|
||||
padding: 16px;
|
||||
width: 420px;
|
||||
}
|
||||
|
||||
.modal-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
/* 自定义提示框样式 */
|
||||
#custom-alert-mask .modal {
|
||||
text-align: center;
|
||||
width: 360px;
|
||||
}
|
||||
|
||||
#custom-alert-mask h3 {
|
||||
color: var(--text);
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
margin: 0 0 16px 0;
|
||||
}
|
||||
|
||||
#custom-alert-mask p {
|
||||
color: var(--muted);
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#custom-alert-mask .modal-actions {
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
#custom-alert-mask .modal-actions button {
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
/* 自定义确认对话框样式 */
|
||||
#custom-alert-mask .modal-actions {
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
#custom-alert-mask .modal-actions .secondary {
|
||||
background: var(--border);
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
#custom-alert-mask .modal-actions .secondary:hover {
|
||||
background: var(--muted);
|
||||
color: var(--panel);
|
||||
}
|
||||
|
||||
Loading…
Reference in new issue