Header+Footer: log GA events on download(s)
This commit is contained in:
@@ -1,5 +1,6 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { ArrowElbowDownRight, Coffee, Heart } from "phosphor-react";
|
import { ArrowElbowDownRight, Coffee, Heart } from "phosphor-react";
|
||||||
|
import { OutboundLink } from "react-ga";
|
||||||
|
|
||||||
import uArrowUpLeft from "../../assets/u-arrow-up-left.svg";
|
import uArrowUpLeft from "../../assets/u-arrow-up-left.svg";
|
||||||
import markerGreen from "../../assets/marker-green.svg";
|
import markerGreen from "../../assets/marker-green.svg";
|
||||||
@@ -37,25 +38,35 @@ const Footer: React.FC<FooterProps> = () => {
|
|||||||
<div className="links">
|
<div className="links">
|
||||||
<div>
|
<div>
|
||||||
<ArrowElbowDownRight size={24} />
|
<ArrowElbowDownRight size={24} />
|
||||||
<a
|
<OutboundLink
|
||||||
className="nav-link"
|
className="nav-link"
|
||||||
href="https://phosphoricons.com/assets/phosphor-icons.zip"
|
to="https://phosphoricons.com/assets/phosphor-icons.zip"
|
||||||
|
eventLabel="Download all"
|
||||||
download
|
download
|
||||||
|
type="application/zip"
|
||||||
>
|
>
|
||||||
Download all
|
Download all
|
||||||
</a>
|
</OutboundLink>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<ArrowElbowDownRight size={24} />
|
<ArrowElbowDownRight size={24} />
|
||||||
<a className="nav-link" href="#">
|
<OutboundLink
|
||||||
|
className="nav-link"
|
||||||
|
to="#"
|
||||||
|
eventLabel="Figma library"
|
||||||
|
>
|
||||||
Figma library
|
Figma library
|
||||||
</a>
|
</OutboundLink>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<ArrowElbowDownRight size={24} />
|
<ArrowElbowDownRight size={24} />
|
||||||
<a className="nav-link" href="#">
|
<OutboundLink
|
||||||
|
className="nav-link"
|
||||||
|
to="#"
|
||||||
|
eventLabel="Figma plugin"
|
||||||
|
>
|
||||||
Figma plugin
|
Figma plugin
|
||||||
</a>
|
</OutboundLink>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<ArrowElbowDownRight size={24} />
|
<ArrowElbowDownRight size={24} />
|
||||||
@@ -73,7 +84,10 @@ const Footer: React.FC<FooterProps> = () => {
|
|||||||
Donate on PayPal
|
Donate on PayPal
|
||||||
</a>
|
</a>
|
||||||
{" / "}
|
{" / "}
|
||||||
<a className="nav-link" href="https://patreon.com/phosphoricons">
|
<a
|
||||||
|
className="nav-link"
|
||||||
|
href="https://patreon.com/phosphoricons"
|
||||||
|
>
|
||||||
Patreon
|
Patreon
|
||||||
</a>
|
</a>
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
@@ -4,6 +4,7 @@ import {
|
|||||||
ArrowCircleDown,
|
ArrowCircleDown,
|
||||||
ArrowElbowDownRight,
|
ArrowElbowDownRight,
|
||||||
} from "phosphor-react";
|
} from "phosphor-react";
|
||||||
|
import { OutboundLink } from "react-ga";
|
||||||
|
|
||||||
import "./Header.css";
|
import "./Header.css";
|
||||||
import markerPurple from "../../assets/marker-purple.svg";
|
import markerPurple from "../../assets/marker-purple.svg";
|
||||||
@@ -76,25 +77,35 @@ const Header: React.FC<HeaderProps> = () => {
|
|||||||
<div className="links">
|
<div className="links">
|
||||||
<div>
|
<div>
|
||||||
<ArrowElbowDownRight size={24} />
|
<ArrowElbowDownRight size={24} />
|
||||||
<a
|
<OutboundLink
|
||||||
className="nav-link"
|
className="nav-link"
|
||||||
href="https://phosphoricons.com/assets/phosphor-icons.zip"
|
to="https://phosphoricons.com/assets/phosphor-icons.zip"
|
||||||
|
eventLabel="Download all"
|
||||||
download
|
download
|
||||||
|
type="application/zip"
|
||||||
>
|
>
|
||||||
Download all
|
Download all
|
||||||
</a>
|
</OutboundLink>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<ArrowElbowDownRight size={24} />
|
<ArrowElbowDownRight size={24} />
|
||||||
<a className="nav-link" href="#">
|
<OutboundLink
|
||||||
|
className="nav-link"
|
||||||
|
to="#"
|
||||||
|
eventLabel="Figma library"
|
||||||
|
>
|
||||||
Figma library
|
Figma library
|
||||||
</a>
|
</OutboundLink>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<ArrowElbowDownRight size={24} />
|
<ArrowElbowDownRight size={24} />
|
||||||
<a className="nav-link" href="#">
|
<OutboundLink
|
||||||
|
className="nav-link"
|
||||||
|
to="#"
|
||||||
|
eventLabel="Figma plugin"
|
||||||
|
>
|
||||||
Figma plugin
|
Figma plugin
|
||||||
</a>
|
</OutboundLink>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<ArrowElbowDownRight size={24} />
|
<ArrowElbowDownRight size={24} />
|
||||||
@@ -112,7 +123,10 @@ const Header: React.FC<HeaderProps> = () => {
|
|||||||
Donate on PayPal
|
Donate on PayPal
|
||||||
</a>
|
</a>
|
||||||
{" / "}
|
{" / "}
|
||||||
<a className="nav-link" href="https://patreon.com/phosphoricons">
|
<a
|
||||||
|
className="nav-link"
|
||||||
|
href="https://patreon.com/phosphoricons"
|
||||||
|
>
|
||||||
Patreon
|
Patreon
|
||||||
</a>
|
</a>
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
Reference in New Issue
Block a user