style: 优化首页样式

This commit is contained in:
xieyonghong 2023-03-26 00:24:33 +08:00
parent b9e332447e
commit ec7ad63f89
2 changed files with 18 additions and 10 deletions

View File

@ -76,18 +76,15 @@ const jumpPage = (item: bootConfig) => {
.box-item {
cursor: pointer;
position: relative;
border-width: 1px 1px 1px 2px;
border-style: solid;
border-color: rgb(238, 238, 238) rgb(238, 238, 238)
rgb(238, 238, 238) rgb(133, 165, 255);
//border-width: 1px 1px 1px 2px;
//border-style: solid;
//border-color: rgb(238, 238, 238) rgb(238, 238, 238)
// rgb(238, 238, 238) rgb(133, 165, 255);
border: 1px solid #e6e6e6;
padding: 11px;
background: linear-gradient(
135.62deg,
#f6f7fd 22.27%,
rgba(255, 255, 255, 0.86) 91.82%
);
background: linear-gradient(0deg, #FFFFFF, #FFFFFF), linear-gradient(135.62deg, rgba(47, 84, 235, 0.07) 22.27%, rgba(47, 84, 235, 0.01) 91.82%);
border-radius: 2px;
box-shadow: 0 4px 18px #efefef;
box-shadow: -2px 0 #85A5FF;
&:not(:first-child) {
margin-top: 12px;
}

View File

@ -12,11 +12,13 @@
<div class="box-list">
<div class="list-item" v-for="item in props.dataList">
<div class="item-content">
<div class="box-top" @click="jumpPage(item)">
<span class="top-title">{{ item.title }}</span>
<img :src="item.iconUrl" alt="" />
</div>
<div class="box-details">{{ item.details }}</div>
</div>
</div>
</div>
</div>
@ -82,6 +84,14 @@ const jumpPage = (row: recommendList) => {
.list-item {
flex: 1;
position: relative;
.item-content {
display: flex;
flex-direction: column;
height: 100%;
&:hover {
box-shadow: @shadow-1-down;
}
}
.box-top {
position: relative;
padding: 16px 24px;
@ -103,6 +113,7 @@ const jumpPage = (row: recommendList) => {
padding: 24px;
border: 1px solid #e5edf4;
border-top: none;
flex: 1 1 auto;
}
&:not(:last-child)::after {