yexuejc007/PlayEdu-backend
1
0
Fork 0
mirror of https://github.com/PlayEdu/backend synced 2025-12-28 16:59:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

首页概览初步

Browse Source
This commit is contained in:
禺狨
2023-03-20 12:12:33 +08:00
parent 0614f198e4
commit e4ffae20b2
13 changed files with 610 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

204
src/pages/dashboard/index.module.less
View File

@@ -0,0 +1,204 @@
.label-item {
width: auto;
height: 94px;
display: flex;
flex-direction: column;
.label {
width: 84px;
height: 24px;
font-size: 14px;
font-weight: 400;
color: rgba(0, 0, 0, 0.88);
line-height: 24px;
}
.info {
width: auto;
height: 46px;
display: flex;
flex-direction: row;
margin-top: 24px;
align-items: center;
.num {
width: auto;
height: 46px;
font-size: 30px;
font-weight: 600;
color: rgba(0, 0, 0, 0.88);
line-height: 46px;
}
.compare {
width: auto;
height: 24px;
font-size: 14px;
font-weight: 400;
color: rgba(0, 0, 0, 0.45);
line-height: 24px;
margin-left: 24px;
display: flex;
flex-direction: row;
align-items: center;
.down {
color: #00cc66;
font-size: 10px;
}
.up {
color: #ff4d4f;
font-size: 10px;
}
}
}
}
.large-title {
width: 100%;
height: 28px;
font-size: 18px;
font-weight: 600;
color: rgba(0, 0, 0, 0.88);
line-height: 28px;
}
.mode-box {
width: 100%;
height: 76px;
display: grid;
column-gap: 24px;
grid-template-columns: repeat(4, minmax(0, 1fr));
margin-top: 24px;
.link-mode {
width: 176px;
height: 76px;
border-radius: 7px;
display: flex;
align-items: center;
box-sizing: border-box;
padding: 24px;
cursor: pointer;
&:hover {
background: #fafafa;
}
i {
margin-right: 16px;
}
span {
font-size: 14px;
font-weight: 400;
color: rgba(0, 0, 0, 0.88);
line-height: 24px;
}
}
}
.usage-guide {
width: 100%;
height: 76px;
background: #fafafa;
border-radius: 7px;
display: flex;
align-items: center;
margin-top: 24px;
.banner {
width: 130px;
height: 130px;
position: absolute;
top: 22px;
left: 196px;
z-index: 10;
}
.link {
margin-left: 352px;
height: 24px;
font-size: 14px;
font-weight: 400;
color: rgba(0, 0, 0, 0.45);
line-height: 24px;
display: flex;
align-items: center;
cursor: pointer;
&:hover {
text-decoration: underline;
}
.icon {
width: 16px;
height: 16px;
margin-left: 8px;
}
}
}
.rank-list {
width: 100%;
height: auto;
display: grid;
column-gap: 100px;
grid-template-columns: repeat(2, minmax(0, 1fr));
margin-top: 24px;
margin-bottom: 12px;
.half-list {
width: 100%;
height: auto;
display: flex;
flex-direction: column;
.rank-item {
width: 100%;
height: 24px;
display: flex;
align-items: center;
margin-bottom: 36px;
justify-content: space-between;
&:last-child {
margin-bottom: 0px;
}
.left-item {
width: auto;
display: flex;
align-items: center;
.item-num {
width: 24px;
height: 24px;
border-radius: 50%;
font-size: 14px;
background-color: #fafafa;
color: rgba(0, 0, 0, 0.45);
display: flex;
align-items: center;
justify-content: center;
margin-right: 8px;
}
.item-icon {
width: 24px;
height: 24px;
margin-right: 8px;
}
.item-name {
width: 150px;
height: 24px;
font-size: 14px;
font-weight: 400;
color: rgba(0, 0, 0, 0.88);
line-height: 24px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
.item-time {
height: 24px;
font-size: 12px;
font-weight: 400;
color: rgba(0, 0, 0, 0.45);
line-height: 24px;
}
}
}
}
.charts {
width: 100%;
height: 300px;
box-sizing: border-box;
padding-top: 24px;
}