Fix border radius rounding on hover and selection indicators in builder preview
This commit is contained in:
parent
3f1d3328e2
commit
e7899d7f22
|
@ -24,6 +24,7 @@
|
||||||
class:flipped
|
class:flipped
|
||||||
class:line
|
class:line
|
||||||
style="top: {top}px; left: {left}px; width: {width}px; height: {height}px; --color: {color}; --zIndex: {zIndex};"
|
style="top: {top}px; left: {left}px; width: {width}px; height: {height}px; --color: {color}; --zIndex: {zIndex};"
|
||||||
|
class:withText={!!text}
|
||||||
>
|
>
|
||||||
{#if text}
|
{#if text}
|
||||||
<div class="text" class:flipped class:line class:right={alignRight}>
|
<div class="text" class:flipped class:line class:right={alignRight}>
|
||||||
|
@ -39,12 +40,12 @@
|
||||||
z-index: var(--zIndex);
|
z-index: var(--zIndex);
|
||||||
border: 2px solid var(--color);
|
border: 2px solid var(--color);
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
border-top-right-radius: 4px;
|
border-radius: 4px;
|
||||||
border-top-left-radius: 0;
|
|
||||||
border-bottom-left-radius: 4px;
|
|
||||||
border-bottom-right-radius: 4px;
|
|
||||||
}
|
}
|
||||||
.indicator.flipped {
|
.indicator.withText {
|
||||||
|
border-top-left-radius: 0;
|
||||||
|
}
|
||||||
|
.indicator.withText.flipped {
|
||||||
border-top-left-radius: 4px;
|
border-top-left-radius: 4px;
|
||||||
}
|
}
|
||||||
.indicator.line {
|
.indicator.line {
|
||||||
|
@ -74,8 +75,7 @@
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
}
|
}
|
||||||
.text.flipped {
|
.text.flipped {
|
||||||
border-top-left-radius: 4px;
|
border-radius: 4px;
|
||||||
border-bottom-left-radius: 4px;
|
|
||||||
transform: translateY(0%);
|
transform: translateY(0%);
|
||||||
top: -2px;
|
top: -2px;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue