path: root/packages/ui/components/icons.tsx

import type { SVGProps } from "react";
export const Github = (props: SVGProps<SVGSVGElement>) => (
	<svg
		viewBox="0 0 256 250"
		width="1em"
		height="1em"
		fill="currentColor"
		xmlns="http://www.w3.org/2000/svg"
		preserveAspectRatio="xMidYMid"
		{...props}
	>
		<path d="M128.001 0C57.317 0 0 57.307 0 128.001c0 56.554 36.676 104.535 87.535 121.46 6.397 1.185 8.746-2.777 8.746-6.158 0-3.052-.12-13.135-.174-23.83-35.61 7.742-43.124-15.103-43.124-15.103-5.823-14.795-14.213-18.73-14.213-18.73-11.613-7.944.876-7.78.876-7.78 12.853.902 19.621 13.19 19.621 13.19 11.417 19.568 29.945 13.911 37.249 10.64 1.149-8.272 4.466-13.92 8.127-17.116-28.431-3.236-58.318-14.212-58.318-63.258 0-13.975 5-25.394 13.188-34.358-1.329-3.224-5.71-16.242 1.24-33.874 0 0 10.749-3.44 35.21 13.121 10.21-2.836 21.16-4.258 32.038-4.307 10.878.049 21.837 1.47 32.066 4.307 24.431-16.56 35.165-13.12 35.165-13.12 6.967 17.63 2.584 30.65 1.255 33.873 8.207 8.964 13.173 20.383 13.173 34.358 0 49.163-29.944 59.988-58.447 63.157 4.591 3.972 8.682 11.762 8.682 23.704 0 17.126-.148 30.91-.148 35.126 0 3.407 2.304 7.398 8.792 6.14C219.37 232.5 256 184.537 256 128.002 256 57.307 198.691 0 128.001 0Zm-80.06 182.34c-.282.636-1.283.827-2.194.39-.929-.417-1.45-1.284-1.15-1.922.276-.655 1.279-.838 2.205-.399.93.418 1.46 1.293 1.139 1.931Zm6.296 5.618c-.61.566-1.804.303-2.614-.591-.837-.892-.994-2.086-.375-2.66.63-.566 1.787-.301 2.626.591.838.903 1 2.088.363 2.66Zm4.32 7.188c-.785.545-2.067.034-2.86-1.104-.784-1.138-.784-2.503.017-3.05.795-.547 2.058-.055 2.861 1.075.782 1.157.782 2.522-.019 3.08Zm7.304 8.325c-.701.774-2.196.566-3.29-.49-1.119-1.032-1.43-2.496-.726-3.27.71-.776 2.213-.558 3.315.49 1.11 1.03 1.45 2.505.701 3.27Zm9.442 2.81c-.31 1.003-1.75 1.459-3.199 1.033-1.448-.439-2.395-1.613-2.103-2.626.301-1.01 1.747-1.484 3.207-1.028 1.446.436 2.396 1.602 2.095 2.622Zm10.744 1.193c.036 1.055-1.193 1.93-2.715 1.95-1.53.034-2.769-.82-2.786-1.86 0-1.065 1.202-1.932 2.733-1.958 1.522-.03 2.768.818 2.768 1.868Zm10.555-.405c.182 1.03-.875 2.088-2.387 2.37-1.485.271-2.861-.365-3.05-1.386-.184-1.056.893-2.114 2.376-2.387 1.514-.263 2.868.356 3.061 1.403Z" />
	</svg>
);

export const Twitter = (props: SVGProps<SVGSVGElement>) => (
	<svg
		viewBox="0 0 256 209"
		width="1em"
		height="1em"
		xmlns="http://www.w3.org/2000/svg"
		preserveAspectRatio="xMidYMid"
		{...props}
	>
		<path
			d="M256 25.45c-9.42 4.177-19.542 7-30.166 8.27 10.845-6.5 19.172-16.793 23.093-29.057a105.183 105.183 0 0 1-33.351 12.745C205.995 7.201 192.346.822 177.239.822c-29.006 0-52.523 23.516-52.523 52.52 0 4.117.465 8.125 1.36 11.97-43.65-2.191-82.35-23.1-108.255-54.876-4.52 7.757-7.11 16.78-7.11 26.404 0 18.222 9.273 34.297 23.365 43.716a52.312 52.312 0 0 1-23.79-6.57c-.003.22-.003.44-.003.661 0 25.447 18.104 46.675 42.13 51.5a52.592 52.592 0 0 1-23.718.9c6.683 20.866 26.08 36.05 49.062 36.475-17.975 14.086-40.622 22.483-65.228 22.483-4.24 0-8.42-.249-12.529-.734 23.243 14.902 50.85 23.597 80.51 23.597 96.607 0 149.434-80.031 149.434-149.435 0-2.278-.05-4.543-.152-6.795A106.748 106.748 0 0 0 256 25.45"
			fill="currentColor"
		/>
	</svg>
);

export const Medium = (props: SVGProps<SVGSVGElement>) => (
	<svg
		width="52"
		height="52"
		viewBox="0 0 52 52"
		fill="none"
		xmlns="http://www.w3.org/2000/svg"
		{...props}
	>
		<path
			d="M17.332 13C20.7798 13 24.0864 14.3696 26.5244 16.8076C28.9624 19.2456 30.332 22.5522 30.332 26C30.332 29.4478 28.9624 32.7544 26.5244 35.1924C24.0864 37.6304 20.7798 39 17.332 39C13.8842 39 10.5776 37.6304 8.13964 35.1924C5.70167 32.7544 4.33203 29.4478 4.33203 26C4.33203 22.5522 5.70167 19.2456 8.13964 16.8076C10.5776 14.3696 13.8842 13 17.332 13ZM36.832 15.1667C40.082 15.1667 42.2487 20.0178 42.2487 26C42.2487 31.9822 40.082 36.8333 36.832 36.8333C33.582 36.8333 31.4154 31.9822 31.4154 26C31.4154 20.0178 33.582 15.1667 36.832 15.1667ZM45.4987 16.25C46.322 16.25 47.0414 18.0418 47.4054 21.1163L47.5072 22.0762L47.5484 22.5853L47.6134 23.6557L47.635 24.2168L47.661 25.389L47.6654 26L47.661 26.611L47.635 27.7832L47.6134 28.3465L47.5484 29.4147L47.505 29.9238L47.4075 30.8837C47.0414 33.9603 46.3242 35.75 45.4987 35.75C44.6754 35.75 43.956 33.9582 43.592 30.8837L43.4902 29.9238C43.4753 29.7542 43.4616 29.5845 43.449 29.4147L43.384 28.3443C43.3756 28.1573 43.3684 27.9703 43.3624 27.7832L43.3364 26.611V25.389L43.3624 24.2168L43.384 23.6535L43.449 22.5853L43.4924 22.0762L43.5899 21.1163C43.956 18.0397 44.6732 16.25 45.4987 16.25Z"
			fill="currentColor"
		/>
	</svg>
);

export const Reddit = (props: SVGProps<SVGSVGElement>) => (
	<svg
		xmlns="http://www.w3.org/2000/svg"
		xmlnsXlink="http://www.w3.org/1999/xlink"
		className="_1O4jTk-dZ-VIxsCuYB6OR8"
		viewBox="0 0 216 216"
		width="1em"
		height="1em"
		{...props}
	>
		<defs>
			<radialGradient
				id="snoo-radial-gragient"
				cx={169.75}
				cy={92.19}
				r={50.98}
				fx={169.75}
				fy={92.19}
				gradientTransform="matrix(1 0 0 .87 0 11.64)"
				gradientUnits="userSpaceOnUse"
			>
				<stop offset={0} stopColor="#feffff" />
				<stop offset={0.4} stopColor="#feffff" />
				<stop offset={0.51} stopColor="#f9fcfc" />
				<stop offset={0.62} stopColor="#edf3f5" />
				<stop offset={0.7} stopColor="#dee9ec" />
				<stop offset={0.72} stopColor="#d8e4e8" />
				<stop offset={0.76} stopColor="#ccd8df" />
				<stop offset={0.8} stopColor="#c8d5dd" />
				<stop offset={0.83} stopColor="#ccd6de" />
				<stop offset={0.85} stopColor="#d8dbe2" />
				<stop offset={0.88} stopColor="#ede3e9" />
				<stop offset={0.9} stopColor="#ffebef" />
			</radialGradient>
			<radialGradient
				xlinkHref="#snoo-radial-gragient"
				id="snoo-radial-gragient-2"
				cx={47.31}
				r={50.98}
				fx={47.31}
			/>
			<radialGradient
				xlinkHref="#snoo-radial-gragient"
				id="snoo-radial-gragient-3"
				cx={109.61}
				cy={85.59}
				r={153.78}
				fx={109.61}
				fy={85.59}
				gradientTransform="matrix(1 0 0 .7 0 25.56)"
			/>
			<radialGradient
				id="snoo-radial-gragient-4"
				cx={-6.01}
				cy={64.68}
				r={12.85}
				fx={-6.01}
				fy={64.68}
				gradientTransform="matrix(1.07 0 0 1.55 81.08 27.26)"
				gradientUnits="userSpaceOnUse"
			>
				<stop offset={0} stopColor="#f60" />
				<stop offset={0.5} stopColor="#ff4500" />
				<stop offset={0.7} stopColor="#fc4301" />
				<stop offset={0.82} stopColor="#f43f07" />
				<stop offset={0.92} stopColor="#e53812" />
				<stop offset={1} stopColor="#d4301f" />
			</radialGradient>
			<radialGradient
				xlinkHref="#snoo-radial-gragient-4"
				id="snoo-radial-gragient-5"
				cx={-73.55}
				cy={64.68}
				r={12.85}
				fx={-73.55}
				fy={64.68}
				gradientTransform="matrix(-1.07 0 0 1.55 62.87 27.26)"
			/>
			<radialGradient
				id="snoo-radial-gragient-6"
				cx={107.93}
				cy={166.96}
				r={45.3}
				fx={107.93}
				fy={166.96}
				gradientTransform="matrix(1 0 0 .66 0 57.4)"
				gradientUnits="userSpaceOnUse"
			>
				<stop offset={0} stopColor="#172e35" />
				<stop offset={0.29} stopColor="#0e1c21" />
				<stop offset={0.73} stopColor="#030708" />
				<stop offset={1} />
			</radialGradient>
			<radialGradient
				xlinkHref="#snoo-radial-gragient"
				id="snoo-radial-gragient-7"
				cx={147.88}
				cy={32.94}
				r={39.77}
				fx={147.88}
				fy={32.94}
				gradientTransform="matrix(1 0 0 .98 0 .54)"
			/>
			<radialGradient
				id="snoo-radial-gragient-8"
				cx={131.31}
				cy={73.08}
				r={32.6}
				fx={131.31}
				fy={73.08}
				gradientUnits="userSpaceOnUse"
			>
				<stop offset={0.48} stopColor="#7a9299" />
				<stop offset={0.67} stopColor="#172e35" />
				<stop offset={0.75} />
				<stop offset={0.82} stopColor="#172e35" />
			</radialGradient>
			<style>
				{"\n            .snoo-cls-11{strokeWidth:0;fill:#ffc49c}\n        "}
			</style>
		</defs>
		<path
			fill="#ff4500"
			strokeWidth={0}
			d="M108 0C48.35 0 0 48.35 0 108c0 29.82 12.09 56.82 31.63 76.37l-20.57 20.57C6.98 209.02 9.87 216 15.64 216H108c59.65 0 108-48.35 108-108S167.65 0 108 0Z"
		/>
		<circle
			cx={169.22}
			cy={106.98}
			r={25.22}
			fill="url(#snoo-radial-gragient)"
			strokeWidth={0}
		/>
		<circle
			cx={46.78}
			cy={106.98}
			r={25.22}
			fill="url(#snoo-radial-gragient-2)"
			strokeWidth={0}
		/>
		<ellipse
			cx={108.06}
			cy={128.64}
			fill="url(#snoo-radial-gragient-3)"
			strokeWidth={0}
			rx={72}
			ry={54}
		/>
		<path
			fill="url(#snoo-radial-gragient-4)"
			strokeWidth={0}
			d="M86.78 123.48c-.42 9.08-6.49 12.38-13.56 12.38s-12.46-4.93-12.04-14.01c.42-9.08 6.49-15.02 13.56-15.02s12.46 7.58 12.04 16.66Z"
		/>
		<path
			fill="url(#snoo-radial-gragient-5)"
			strokeWidth={0}
			d="M129.35 123.48c.42 9.08 6.49 12.38 13.56 12.38s12.46-4.93 12.04-14.01c-.42-9.08-6.49-15.02-13.56-15.02s-12.46 7.58-12.04 16.66Z"
		/>
		<ellipse
			cx={79.63}
			cy={116.37}
			className="snoo-cls-11"
			rx={2.8}
			ry={3.05}
		/>
		<ellipse
			cx={146.21}
			cy={116.37}
			className="snoo-cls-11"
			rx={2.8}
			ry={3.05}
		/>
		<path
			fill="url(#snoo-radial-gragient-6)"
			strokeWidth={0}
			d="M108.06 142.92c-8.76 0-17.16.43-24.92 1.22-1.33.13-2.17 1.51-1.65 2.74 4.35 10.39 14.61 17.69 26.57 17.69s22.23-7.3 26.57-17.69c.52-1.23-.33-2.61-1.65-2.74-7.77-.79-16.16-1.22-24.92-1.22Z"
		/>
		<circle
			cx={147.49}
			cy={49.43}
			r={17.87}
			fill="url(#snoo-radial-gragient-7)"
			strokeWidth={0}
		/>
		<path
			fill="url(#snoo-radial-gragient-8)"
			strokeWidth={0}
			d="M107.8 76.92c-2.14 0-3.87-.89-3.87-2.27 0-16.01 13.03-29.04 29.04-29.04 2.14 0 3.87 1.73 3.87 3.87s-1.73 3.87-3.87 3.87c-11.74 0-21.29 9.55-21.29 21.29 0 1.38-1.73 2.27-3.87 2.27Z"
		/>
		<path
			fill="#842123"
			strokeWidth={0}
			d="M62.82 122.65c.39-8.56 6.08-14.16 12.69-14.16 6.26 0 11.1 6.39 11.28 14.33.17-8.88-5.13-15.99-12.05-15.99s-13.14 6.05-13.56 15.2c-.42 9.15 4.97 13.83 12.04 13.83h.52c-6.44-.16-11.3-4.79-10.91-13.2Zm90.48 0c-.39-8.56-6.08-14.16-12.69-14.16-6.26 0-11.1 6.39-11.28 14.33-.17-8.88 5.13-15.99 12.05-15.99 7.07 0 13.14 6.05 13.56 15.2.42 9.15-4.97 13.83-12.04 13.83h-.52c6.44-.16 11.3-4.79 10.91-13.2Z"
		/>
	</svg>
);

export const Notion = (props: SVGProps<SVGSVGElement>) => (
	<svg
		xmlns="http://www.w3.org/2000/svg"
		width="1em"
		height="1em"
		preserveAspectRatio="xMidYMid"
		viewBox="0 0 256 268"
		{...props}
	>
		<path
			fill="#FFF"
			d="M16.092 11.538 164.09.608c18.179-1.56 22.85-.508 34.28 7.801l47.243 33.282C253.406 47.414 256 48.975 256 55.207v182.527c0 11.439-4.155 18.205-18.696 19.24L65.44 267.378c-10.913.517-16.11-1.043-21.825-8.327L8.826 213.814C2.586 205.487 0 199.254 0 191.97V29.726c0-9.352 4.155-17.153 16.092-18.188Z"
		/>
		<path d="M164.09.608 16.092 11.538C4.155 12.573 0 20.374 0 29.726v162.245c0 7.284 2.585 13.516 8.826 21.843l34.789 45.237c5.715 7.284 10.912 8.844 21.825 8.327l171.864-10.404c14.532-1.035 18.696-7.801 18.696-19.24V55.207c0-5.911-2.336-7.614-9.21-12.66l-1.185-.856L198.37 8.409C186.94.1 182.27-.952 164.09.608ZM69.327 52.22c-14.033.945-17.216 1.159-25.186-5.323L23.876 30.778c-2.06-2.086-1.026-4.69 4.163-5.207l142.274-10.395c11.947-1.043 18.17 3.12 22.842 6.758l24.401 17.68c1.043.525 3.638 3.637.517 3.637L71.146 52.095l-1.819.125Zm-16.36 183.954V81.222c0-6.767 2.077-9.887 8.3-10.413L230.02 60.93c5.724-.517 8.31 3.12 8.31 9.879v153.917c0 6.767-1.044 12.49-10.387 13.008l-161.487 9.361c-9.343.517-13.489-2.594-13.489-10.921ZM212.377 89.53c1.034 4.681 0 9.362-4.681 9.897l-7.783 1.542v114.404c-6.758 3.637-12.981 5.715-18.18 5.715-8.308 0-10.386-2.604-16.609-10.396l-50.898-80.079v77.476l16.1 3.646s0 9.362-12.989 9.362l-35.814 2.077c-1.043-2.086 0-7.284 3.63-8.318l9.351-2.595V109.823l-12.98-1.052c-1.044-4.68 1.55-11.439 8.826-11.965l38.426-2.585 52.958 81.113v-71.76l-13.498-1.552c-1.043-5.733 3.111-9.896 8.3-10.404l35.84-2.087Z" />
	</svg>
);

export const X = (props: SVGProps<SVGSVGElement>) => (
	<svg
		xmlns="http://www.w3.org/2000/svg"
		width="1em"
		height="1em"
		fill="none"
		viewBox="0 0 1200 1227"
		{...props}
	>
		<path
			fill="#fff"
			d="M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z"
		/>
	</svg>
);

export const Google = (props: SVGProps<SVGSVGElement>) => (
	<svg
		width="1.3em"
		height="1.3em"
		viewBox="0 0 256 262"
		xmlns="http://www.w3.org/2000/svg"
		preserveAspectRatio="xMidYMid"
		{...props}
	>
		<path
			d="M255.878 133.451c0-10.734-.871-18.567-2.756-26.69H130.55v48.448h71.947c-1.45 12.04-9.283 30.172-26.69 42.356l-.244 1.622 38.755 30.023 2.685.268c24.659-22.774 38.875-56.282 38.875-96.027"
			fill="#ffffff"
		/>
		<path
			d="M130.55 261.1c35.248 0 64.839-11.605 86.453-31.622l-41.196-31.913c-11.024 7.688-25.82 13.055-45.257 13.055-34.523 0-63.824-22.773-74.269-54.25l-1.531.13-40.298 31.187-.527 1.465C35.393 231.798 79.49 261.1 130.55 261.1"
			fill="#ffffff"
		/>
		<path
			d="M56.281 156.37c-2.756-8.123-4.351-16.827-4.351-25.82 0-8.994 1.595-17.697 4.206-25.82l-.073-1.73L15.26 71.312l-1.335.635C5.077 89.644 0 109.517 0 130.55s5.077 40.905 13.925 58.602l42.356-32.782"
			fill="#ffffff"
		/>
		<path
			d="M130.55 50.479c24.514 0 41.05 10.589 50.479 19.438l36.844-35.974C195.245 12.91 165.798 0 130.55 0 79.49 0 35.393 29.301 13.925 71.947l42.211 32.783c10.59-31.477 39.891-54.251 74.414-54.251"
			fill="#ffffff"
		/>
	</svg>
);