mirror of
https://github.com/PrimalHQ/primal-web-app.git
synced 2024-10-03 02:10:55 +00:00
Move lottie zap animation to a specialized component
This commit is contained in:
parent
7d6114f85c
commit
fd9d28fa11
@ -14,6 +14,7 @@ import { SendNoteResult } from '../../types/primal';
|
||||
import { useProfileContext } from '../../contexts/ProfileContext';
|
||||
import Branding from '../Branding/Branding';
|
||||
import BannerIOS, { isIOS } from '../BannerIOS/BannerIOS';
|
||||
import ZapAnimation from '../ZapAnimation/ZapAnimation';
|
||||
|
||||
export const [isHome, setIsHome] = createSignal(false);
|
||||
|
||||
@ -87,14 +88,7 @@ const Layout: Component = () => {
|
||||
<div class="zap_icon_fill"></div>
|
||||
<div class="like_icon"></div>
|
||||
<div class="like_icon_fill"></div>
|
||||
<lottie-player
|
||||
src={zapSM}
|
||||
speed="1"
|
||||
></lottie-player>
|
||||
<lottie-player
|
||||
src={zapMD}
|
||||
speed="1"
|
||||
></lottie-player>
|
||||
<ZapAnimation src={zapMD} />
|
||||
</div>
|
||||
<div id="modal" class={styles.modal}></div>
|
||||
<BannerIOS />
|
||||
|
@ -18,6 +18,7 @@ import PrimalMenu from '../../PrimalMenu/PrimalMenu';
|
||||
import { hookForDev } from '../../../lib/devTools';
|
||||
import NoteContextMenu from '../NoteContextMenu';
|
||||
import { getScreenCordinates } from '../../../utils';
|
||||
import ZapAnimation from '../../ZapAnimation/ZapAnimation';
|
||||
|
||||
const NoteFooter: Component<{ note: PrimalNote, id?: string }> = (props) => {
|
||||
|
||||
@ -336,13 +337,12 @@ const NoteFooter: Component<{ note: PrimalNote, id?: string }> = (props) => {
|
||||
<div id={props.id} class={styles.footer} ref={footerDiv}>
|
||||
|
||||
<Show when={showZapAnim()}>
|
||||
<lottie-player
|
||||
<ZapAnimation
|
||||
id={`note-med-zap-${props.note.post.id}`}
|
||||
src={zapMD}
|
||||
speed="1"
|
||||
class={styles.mediumZapLottie}
|
||||
ref={medZapAnimation}
|
||||
></lottie-player>
|
||||
/>
|
||||
</Show>
|
||||
|
||||
{actionButton({
|
||||
|
24
src/components/ZapAnimation/ZapAnimation.tsx
Normal file
24
src/components/ZapAnimation/ZapAnimation.tsx
Normal file
@ -0,0 +1,24 @@
|
||||
import { Component } from 'solid-js';
|
||||
|
||||
const ZapAnimation: Component<{
|
||||
id?: string,
|
||||
class?: string,
|
||||
src: any,
|
||||
ref?: HTMLElement | undefined,
|
||||
}> = (props) => {
|
||||
|
||||
return (
|
||||
// @ts-ignore
|
||||
<lottie-player
|
||||
id={props.id}
|
||||
src={props.src}
|
||||
speed="1"
|
||||
class={props.class}
|
||||
ref={props.ref}
|
||||
>
|
||||
{/* @ts-ignore */}
|
||||
</lottie-player>
|
||||
);
|
||||
}
|
||||
|
||||
export default ZapAnimation;
|
Loading…
Reference in New Issue
Block a user