From b44f29bfbf1e4b474eb8ba16dd0a6491241df15e Mon Sep 17 00:00:00 2001 From: Anthony Dumas Date: Fri, 10 Mar 2023 09:53:39 +0000 Subject: [PATCH] Better glitching --- src/components/MainCard/MainCard.js | 31 ++++++++++++++++++++++++++--- 1 file changed, 28 insertions(+), 3 deletions(-) diff --git a/src/components/MainCard/MainCard.js b/src/components/MainCard/MainCard.js index d963acb..4c5f1fc 100644 --- a/src/components/MainCard/MainCard.js +++ b/src/components/MainCard/MainCard.js @@ -11,10 +11,35 @@ import { PowerGlitch } from 'powerglitch'; class MainCard extends Component { - glitching() { - PowerGlitch.glitch('#photoProfil'); + componentDidMount() { + PowerGlitch.glitch('img', + { + playMode: 'hover', + hideOverflow: true, + timing: { + duration: 1000, + iterations: 15, + easing: 'ease-in-out', + }, + glitchTimeSpan: { + start: 0.0, + end: 0.7, + }, + shake: { + velocity: 10, + amplitudeX: 0.4, + amplitudeY: 0.4, + }, + slice: { + count: 4, + velocity: 10, + minHeight: 0.02, + maxHeight: 0.40, + hueRotate: true, + }, + } + ); } - render() { var metaThemeColor = document.querySelector("meta[name=theme-color]"); metaThemeColor.setAttribute("content", window.matchMedia('(prefers-color-scheme: dark)').matches ? "#25444b" : "#5c9ead");