style: 优化页面样式和布局,提升用户体验

This commit is contained in:
2025-07-10 23:50:19 +08:00
parent f2c51f45b6
commit d0f9e65ad1
6 changed files with 644 additions and 115 deletions

View File

@@ -9,11 +9,84 @@
<!-- Bootstrap CSS -->
<link href="/static/css/bootstrap.min.css" rel="stylesheet">
<style>
/* Custom styles */
* {
box-sizing: border-box;
}
body {
font-family: 'Google Sans', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f8f9fa;
min-height: 100vh;
color: #202124;
line-height: 1.6;
}
.container {
max-width: 600px;
margin: 0 auto;
padding: 24px 16px;
background-color: #ffffff;
border-radius: 8px;
margin-top: 40px;
box-shadow: 0 1px 3px rgba(60, 64, 67, 0.3);
}
h2 {
color: #1a73e8;
font-weight: 400;
margin-bottom: 24px;
text-align: center;
}
.form-control {
border: 1px solid #dadce0;
border-radius: 4px;
padding: 12px;
font-family: inherit;
}
.form-control:focus {
outline: none;
border-color: #1a73e8;
box-shadow: 0 0 0 2px rgba(26, 115, 232, 0.2);
}
.btn-primary {
background: #1a73e8;
border: 1px solid #1a73e8;
color: #ffffff;
padding: 12px 24px;
border-radius: 4px;
font-weight: 500;
transition: all 0.2s ease;
cursor: pointer;
}
.btn-primary:hover {
background: #1557b0;
border-color: #1557b0;
}
.progress {
background-color: #f1f3f4;
border-radius: 4px;
overflow: hidden;
margin-top: 16px;
}
#progress_bar {
background-color: #1a73e8;
height: 8px;
width: 0;
background-color: #64B587;
height: 20px;
transition: width 0.3s ease;
}
#loading {
margin-top: 12px;
color: #5f6368;
font-size: 14px;
}
</style>
</head>