vue/jingrowtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

美化添加背景页面色阶栏及右边栏

Browse Source
This commit is contained in:
jingrow 2026-01-21 16:20:18 +08:00
parent 73cad2900d
commit cffe81c594
1 changed files with 16 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/views/tools/add_background/add_background.vue
View File

@ -1380,6 +1380,10 @@ const removeHistoryItem = (index: number) => {
border: 2px solid transparent;
transition: all 0.15s ease;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
position: relative;
display: flex;
align-items: center;
justify-content: center;
&:hover {
transform: scale(1.1);
@ -1388,8 +1392,6 @@ const removeHistoryItem = (index: number) => {
}
&.active {
border-color: #1fc76f;
box-shadow: 0 0 0 3px rgba(31, 199, 111, 0.3);
transform: scale(1.15);
&::after {
@ -1397,12 +1399,11 @@ const removeHistoryItem = (index: number) => {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transform: translate(-50%, -50%) rotate(45deg);
width: 8px;
height: 8px;
background: white;
border-radius: 50%;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
height: 14px;
border: solid #1fc76f;
border-width: 0 2.5px 2.5px 0;
}
}
}
@ -1793,7 +1794,7 @@ const removeHistoryItem = (index: number) => {
.common-colors-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(4, 1fr);
gap: 10px;
}
@ -2054,6 +2055,12 @@ const removeHistoryItem = (index: number) => {
.shade-item {
width: 32px;
height: 32px;
&.active::after {
width: 7px;
height: 12px;
border-width: 0 2px 2px 0;
}
}
.toolbar-actions {
@ -2173,7 +2180,7 @@ const removeHistoryItem = (index: number) => {
}
.common-colors-grid {
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(4, 1fr);
}
}
</style>