no message

This commit is contained in:
A1300399510 2024-11-11 14:32:24 +08:00
parent de09eeacff
commit 8bd6a66a87
3 changed files with 33 additions and 3 deletions

View File

@ -138,7 +138,6 @@
.body .right .h .item.sort .sort-mask { .body .right .h .item.sort .sort-mask {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: #000000;
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
@ -155,6 +154,16 @@
left: 50%; left: 50%;
z-index: 102; z-index: 102;
transform: translateX(-50%); transform: translateX(-50%);
animation: sortShow 0.3s;
overflow: hidden;
}
@keyframes sortShow {
0% {
height: 0;
}
100% {
height: 150px;
}
} }
.body .right .h .item.sort .sort-list .sort-item { .body .right .h .item.sort .sort-list .sort-item {
height: 50px; height: 50px;
@ -164,6 +173,10 @@
.body .right .h .item.sort .sort-list .sort-item:not(:last-of-type) { .body .right .h .item.sort .sort-list .sort-item:not(:last-of-type) {
border-bottom: 1px solid #e4e7ed; border-bottom: 1px solid #e4e7ed;
} }
.body .right .h .item.sort .sort-list .sort-item.pitch {
color: #9a9d02;
font-weight: 650;
}
.body .right .h .item .img-sort { .body .right .h .item .img-sort {
width: 20px; width: 20px;
height: 20px; height: 20px;

View File

@ -146,7 +146,6 @@
.sort-mask { .sort-mask {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: #000000;
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
@ -163,6 +162,19 @@
left: 50%; left: 50%;
z-index: 102; z-index: 102;
transform: translateX(-50%); transform: translateX(-50%);
animation: sortShow 0.3s;
overflow: hidden;
@keyframes sortShow {
0% {
height: 0;
}
100% {
height: 150px;
}
}
.sort-item { .sort-item {
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
@ -170,6 +182,11 @@
&:not(:last-of-type) { &:not(:last-of-type) {
border-bottom: 1px solid #e4e7ed; border-bottom: 1px solid #e4e7ed;
} }
&.pitch {
color: #9a9d02;
font-weight: 650;
}
} }
} }
} }

View File

@ -50,7 +50,7 @@
<div class="item flexacenter sort"> <div class="item flexacenter sort">
学费由低到高 学费由低到高
<img class="img-sort" src="/img/sort-icon.png" /> <img class="img-sort" src="/img/sort-icon.png" />
<template v-if="sortState"> <template v-if="!sortState">
<div class="sort-mask"></div> <div class="sort-mask"></div>
<div class="sort-list"> <div class="sort-list">
<div class="sort-item pitch">排名由高到低</div> <div class="sort-item pitch">排名由高到低</div>