Siklos/svg-layout-designer-react
1
1
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Add selector an animation
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse source
This commit is contained in:
Siklos 2022-08-04 00:22:39 +02:00
parent d959945da7
commit 767afb230d
2 changed files with 7 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/App.scss
View file

@ -17,3 +17,8 @@ text {
stroke-linejoin: miter; stroke-linejoin: miter;
stroke-opacity: 1; stroke-opacity: 1;
} }
@keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}

4
src/Components/SVG/Elements/Selector.tsx
View file

@ -19,13 +19,13 @@ export const Selector: React.FC<ISelectorProps> = (props) => {
props.selected.props.properties.height props.selected.props.properties.height
]; ];
const style = { const style = {
strokeDasharray: '8, 10',
stroke: '#3B82F6', // tw blue-500 stroke: '#3B82F6', // tw blue-500
strokeWidth: 4, strokeWidth: 4,
fillOpacity: 0, fillOpacity: 0,
transitionProperty: 'all', transitionProperty: 'all',
transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)', transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
transitionDuration: '150ms' transitionDuration: '150ms',
animation: 'fadein 750ms ease-in alternate infinite'
} as React.CSSProperties; } as React.CSSProperties;
return ( return (