You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
57 lines
1.5 KiB
TypeScript
57 lines
1.5 KiB
TypeScript
import styles from './googlePlayButton.module.scss';
|
|
import Link, { LinkProps } from 'next/link';
|
|
import QRCodeSvg from '@/assets/images/qr-code.svg';
|
|
import LinkIcon from '@/assets/icons/link.svg';
|
|
import useLocale, { LocalesMap } from '@/utils/useLocale';
|
|
import clsx from 'clsx';
|
|
import { CursorEffect } from '@/components/cursor';
|
|
|
|
const locales: LocalesMap = {
|
|
ru: {
|
|
getText: 'Доступно в',
|
|
},
|
|
en: {
|
|
getText: 'Get it on',
|
|
},
|
|
};
|
|
|
|
type GooglePlayButtonProps = Omit<LinkProps, 'href'> & {
|
|
className?: string;
|
|
disableGlass?: boolean;
|
|
};
|
|
|
|
export function GooglePlayButton(props: GooglePlayButtonProps) {
|
|
const {
|
|
className: restCalssName,
|
|
disableGlass = false,
|
|
...restProps
|
|
} = props;
|
|
const t = useLocale(locales);
|
|
|
|
return (
|
|
<CursorEffect cursorBorderRadius={36} cursorPadding={12}>
|
|
<div
|
|
className={clsx(
|
|
styles.card,
|
|
disableGlass && styles.disableGlass,
|
|
restCalssName
|
|
)}
|
|
>
|
|
<Link
|
|
{...restProps}
|
|
target="_blank"
|
|
href="https://play.google.com/store/apps/details?id=org.xtimms.ridebus"
|
|
>
|
|
<div className={styles.content}>
|
|
<QRCodeSvg className={styles.qrCode} />
|
|
<div className={styles.textContainer}>
|
|
<LinkIcon className={styles.linkIcon} />
|
|
<span className={styles.getText}>{t('getText')}</span>
|
|
<span className={styles.storeNameText}>Google Play</span>
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
</div>
|
|
</CursorEffect>
|
|
);
|
|
} |