mirror of
https://github.com/hi2shark/nazhua.git
synced 2026-01-17 09:40:42 +08:00
🎨 调整移动端的提示框位置和样式
This commit is contained in:
parent
69f7031c0d
commit
825c655185
@ -190,7 +190,7 @@ const tipsContentStyle = computed(() => {
|
|||||||
style.left = `${activeTipsXY.value.x}px`;
|
style.left = `${activeTipsXY.value.x}px`;
|
||||||
style.transform = 'translate(-50%, 20px)';
|
style.transform = 'translate(-50%, 20px)';
|
||||||
} else {
|
} else {
|
||||||
style.bottom = '10px';
|
style.bottom = '4px';
|
||||||
style.left = '50%';
|
style.left = '50%';
|
||||||
style.transform = 'translate(-50%, 0)';
|
style.transform = 'translate(-50%, 0)';
|
||||||
}
|
}
|
||||||
@ -232,11 +232,11 @@ function handlePointTap(e) {
|
|||||||
padding: 5px 10px;
|
padding: 5px 10px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
line-height: 20px;
|
line-height: 20px;
|
||||||
|
white-space: pre;
|
||||||
color: #eee;
|
color: #eee;
|
||||||
background: rgba(#000, 0.8);
|
background: rgba(#000, 0.8);
|
||||||
box-shadow: 1px 4px 8px rgba(#303841, 0.4);
|
box-shadow: 1px 4px 8px rgba(#303841, 0.4);
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
white-space: pre;
|
|
||||||
|
|
||||||
// 向上的尖角
|
// 向上的尖角
|
||||||
&::before {
|
&::before {
|
||||||
@ -250,6 +250,15 @@ function handlePointTap(e) {
|
|||||||
border-bottom-color: rgba(#000, 0.8);
|
border-bottom-color: rgba(#000, 0.8);
|
||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 500px) {
|
||||||
|
line-height: 16px;
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user