Add locked indicator
This commit is contained in:
parent
3d936fd0a5
commit
93e774691d
2 changed files with 4 additions and 0 deletions
|
@ -34,6 +34,7 @@ export const ShapeIndicator = observer(function ShapeIndicator<T extends TLShape
|
||||||
'tl-absolute',
|
'tl-absolute',
|
||||||
isSelected && !user ? 'tl-selected' : 'tl-hovered',
|
isSelected && !user ? 'tl-selected' : 'tl-hovered',
|
||||||
isEditing ? 'tl-editing' : '',
|
isEditing ? 'tl-editing' : '',
|
||||||
|
shape.isLocked ? 'tl-locked' : '',
|
||||||
].join(' ')}
|
].join(' ')}
|
||||||
>
|
>
|
||||||
<svg width="100%" height="100%">
|
<svg width="100%" height="100%">
|
||||||
|
|
|
@ -264,6 +264,9 @@ export const TLCSS = css`
|
||||||
.tl-selected {
|
.tl-selected {
|
||||||
stroke: var(--tl-selectStroke);
|
stroke: var(--tl-selectStroke);
|
||||||
}
|
}
|
||||||
|
.tl-locked {
|
||||||
|
stroke-dasharray: calc(3px * var(--tl-scale)) calc(3px * var(--tl-scale));
|
||||||
|
}
|
||||||
.tl-editing {
|
.tl-editing {
|
||||||
stroke-width: calc(2.5px * min(5, var(--tl-scale)));
|
stroke-width: calc(2.5px * min(5, var(--tl-scale)));
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue