TyleoDvDelaware3217/Kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2025-07-18 23:34:04 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

border fix

Browse source
This commit is contained in:
Doruk 2025-06-19 19:55:01 +02:00
parent 9b4e28b81f
commit 6045db458a
1 changed files with 21 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/components/Tooltip.vue
View file

@ -129,6 +129,18 @@ export default {
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
min-width: 120px; min-width: 120px;
text-align: center; text-align: center;
position: relative;
&::before {
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);
width: 14px;
height: 2px;
background: rgba(17, 24, 39, 0.95);
top: -1px;
}
.tooltip-status { .tooltip-status {
font-size: 16px; font-size: 16px;
@ -181,13 +193,10 @@ export default {
height: 0; height: 0;
border-left: 6px solid transparent; border-left: 6px solid transparent;
border-right: 6px solid transparent; border-right: 6px solid transparent;
// Default: tooltip below element, arrow points up
border-bottom: 6px solid rgba(17, 24, 39, 0.95); border-bottom: 6px solid rgba(17, 24, 39, 0.95);
top: -6px; top: -6px;
&.arrow-above { &.arrow-above {
// Tooltip above element, arrow points down
top: auto; top: auto;
bottom: -6px; bottom: -6px;
border-bottom: none; border-bottom: none;
@ -200,6 +209,11 @@ export default {
&.tooltip-above { &.tooltip-above {
transform: translateX(-50%) translateY(-8px); transform: translateX(-50%) translateY(-8px);
.tooltip-content::before {
top: auto;
bottom: -1px;
}
} }
} }
@ -208,15 +222,17 @@ export default {
.tooltip-content { .tooltip-content {
background: rgba(31, 41, 55, 0.95); background: rgba(31, 41, 55, 0.95);
border-color: rgba(107, 114, 128, 0.3); border-color: rgba(107, 114, 128, 0.3);
&::before {
background: rgba(31, 41, 55, 0.95);
}
} }
.tooltip-arrow { .tooltip-arrow {
border-bottom-color: rgba(31, 41, 55, 0.95); border-bottom-color: rgba(31, 41, 55, 0.95);
top: -6px;
&.arrow-above { &.arrow-above {
border-top-color: rgba(31, 41, 55, 0.95); border-top-color: rgba(31, 41, 55, 0.95);
bottom: -6px;
} }
} }
} }