选择风格变为生成四个,调整渐变按钮样式

This commit is contained in:
X1627315083
2025-12-29 14:42:50 +08:00
parent 1a52eaa3c3
commit 15a4220fbc
10 changed files with 247 additions and 89 deletions

View File

@@ -82,22 +82,11 @@ const {} = toRefs(data);
</div>
<div class="mask" v-if="item.id == select?.oldId"></div>
</div>
<div class="btn">
<!-- <div>
<SvgIcon v-if="!item.isLike" @click.stop="setLike(item,'like')" name="noLike" size="30" />
<SvgIcon v-else name="like" @click.stop="setLike(item,'noLike')" color="#FF4949" size="30" />
</div> -->
<!-- <div class="btn">
<div>
<SvgIcon @click.stop="updateStyle(item,index)" name="update" size="30" />
</div>
<!-- <div>
<SvgIcon v-if="!item.isAdd" @click.stop="addLibrary(item,'add')" name="add" size="30" />
<SvgIcon v-else @click.stop="addLibrary(item,'delete')" name="confirmation" size="30" />
</div> -->
<!-- <div>
<SvgIcon @click.stop="deleteStyle(index)" name="delete" size="30" />
</div> -->
</div>
</div> -->
</div>
</div>
@@ -109,7 +98,7 @@ const {} = toRefs(data);
flex-wrap: wrap;
justify-content: space-between;
> .item{
width: calc(50% - 3.1rem / 2);
width: calc(50% - 3.5rem / 2);
position: relative;
// margin-bottom: 3.3rem;
display: flex;
@@ -126,7 +115,7 @@ const {} = toRefs(data);
align-items: center;
flex-wrap: wrap;
height: 45rem;
margin: 2.4rem 0;
margin: 2.3rem 0;
background-color: #fff;
justify-content: center;
border: .6px solid #acacac;
@@ -170,26 +159,26 @@ const {} = toRefs(data);
// max-height: 50%;
}
}
> .btn{
display: flex;
align-items: center;
justify-content: flex-end;
> div{
color: #000;
margin-right: 1.2rem;
border-radius: 50%;
width: 5.2rem;
height: 5.2rem;
padding: 1rem;
background-color: #fff;
&:last-child{
margin-right: 0rem;
}
&:hover{
color: #000;
}
}
}
// > .btn{
// display: flex;
// align-items: center;
// justify-content: flex-end;
// > div{
// color: #000;
// margin-right: 1.2rem;
// border-radius: 50%;
// width: 5.2rem;
// height: 5.2rem;
// padding: 1rem;
// background-color: #fff;
// &:last-child{
// margin-right: 0rem;
// }
// &:hover{
// color: #000;
// }
// }
// }
}
}
</style>