GithubBackup/MoviePilot-Frontend
1
0
Fork 0
mirror of https://github.com/jxxghp/MoviePilot-Frontend.git synced 2026-09-05 07:28:37 +08:00
Code Issues Packages Projects Releases Wiki Activity

优化用户列表和卡片样式，提升响应式布局和用户体验

Browse Source
This commit is contained in:
jxxghp
2025-04-02 09:06:55 +08:00
parent b5b2de30a2
commit c15927cca0
7 changed files with 633 additions and 350 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/styles.scss
+58 -1
View File
@@ -218,10 +218,35 @@ html.v-overlay-scroll-blocked body {
}
.grid-user-card {
grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
padding-block-end: 1rem;
}
@media (max-width: 600px) {
.user-list-container {
padding: 12px;
}
.grid-user-card {
grid-template-columns: 1fr;
gap: 1rem;
}
}
@media (min-width: 601px) and (max-width: 960px) {
.grid-user-card{
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 1rem;
}
}
@media (min-width: 961px) {
.grid-user-card {
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
gap: 1.5rem;
}
}
.grid-app-card {
grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
padding-block-end: 1rem;
@@ -269,3 +294,35 @@ html.v-overlay-scroll-blocked body {
content: '';
inset: 0;
}
.card-list-container {
padding: 20px;
margin: 0 auto;
}
@media (max-width: 600px) {
.card-list-container {
padding: 12px;
}
}
.page-content-header {
margin-bottom: 24px;
}
.page-content-header-title {
display: flex;
align-items: center;
}
.page-content-header-title-icon {
margin-right: 12px;
}
.page-content-header-title-text {
font-size: 1.5rem;
font-weight: 600;
color: rgba(var(--v-theme-on-surface), 0.87);
margin: 0;
}