import type React from 'react';

import styles from './GoogleSvg.module.scss';

const GoogleSvg: React.FC = (): JSX.Element => (
	<div className={styles.googleBtn}>
		<svg fill="none" height="22" viewBox="0 0 22 22" width="22" xmlns="http://www.w3.org/2000/svg">
			<path
				d="M21.7861 8.84565H20.9V8.8H11V13.2H17.2167C16.3097 15.7614 13.8727 17.6 11 17.6C7.35515 17.6 4.4 14.6448 4.4 11C4.4 7.35515 7.35515 4.4 11 4.4C12.6825 4.4 14.2131 5.0347 15.3786 6.07145L18.4899 2.9601C16.5253 1.12915 13.8974 0 11 0C4.92525 0 0 4.92525 0 11C0 17.0748 4.92525 22 11 22C17.0748 22 22 17.0748 22 11C22 10.2625 21.9241 9.5425 21.7861 8.84565Z"
				fill="#FFC107"
			/>
			<path
				d="M1.26758 5.88005L4.88163 8.5305C5.85953 6.1094 8.22783 4.4 10.9993 4.4C12.6817 4.4 14.2124 5.0347 15.3778 6.07145L18.4892 2.9601C16.5246 1.12915 13.8967 0 10.9993 0C6.77418 0 3.11008 2.38535 1.26758 5.88005Z"
				fill="#FF3D00"
			/>
			<path
				d="M10.9998 21.9998C13.8411 21.9998 16.4228 20.9124 18.3747 19.1442L14.9702 16.2633C13.8287 17.1314 12.4339 17.6009 10.9998 17.5998C8.13868 17.5998 5.70933 15.7754 4.79413 13.2295L1.20703 15.9932C3.02753 19.5556 6.72463 21.9998 10.9998 21.9998Z"
				fill="#4CAF50"
			/>
			<path
				d="M21.786 8.84545H20.9V8.7998H11V13.1998H17.2167C16.7828 14.4188 16.0013 15.4841 14.9688 16.2639L14.9704 16.2628L18.375 19.1437C18.1341 19.3626 22 16.4998 22 10.9998C22 10.2623 21.9241 9.5423 21.786 8.84545Z"
				fill="#1976D2"
			/>
		</svg>
		<small>Continue with google</small>
	</div>
);

export default GoogleSvg;