Skip to content

Commit 879b00d

Browse files
parlandinparlandin
committed
feat: add BuyMeACoffee link and icon to Footer component
1 parent 1f135c8 commit 879b00d

File tree

3 files changed

+62
-55
lines changed

3 files changed

+62
-55
lines changed

‎src/components/Footer/index.tsx‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import Github from "@components/Icons/Github";
99
import LinkedIn from "@components/Icons/LinkedIn";
1010
import { Link } from "gatsby";
1111
import useEventTheme from "@src/hooks/useEventTheme";
12+
import BuyCoffeeIcon from "@Icons/BuyCoffee";
1213

1314
const listOfItems = [
1415
{
@@ -63,6 +64,7 @@ const Footer: React.FC = () => {
6364
title="ir para meu github"
6465
>
6566
<Github />
67+
<span>github</span>
6668
</a>
6769
<a
6870
href="https://www.linkedin.com/in/gustavoparlandim/"
@@ -71,6 +73,17 @@ const Footer: React.FC = () => {
7173
title="ir para meu linkedIn"
7274
>
7375
<LinkedIn />
76+
<span>linkedin</span>
77+
</a>
78+
79+
<a
80+
href="https://www.buymeacoffee.com/parlandim"
81+
target="_blank"
82+
rel="noopener noreferrer"
83+
title="ir para buy me a coffee"
84+
>
85+
<BuyCoffeeIcon />
86+
<span>buy me a coffee</span>
7487
</a>
7588
</S.SocialMedia>
7689
</S.MenuSection>

‎src/components/Footer/styles.tsx‎

Lines changed: 38 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -27,10 +27,6 @@ export const MenuSection = styled.nav`
2727
align-items: center;
2828
justify-content: space-between;
2929
30-
@media (max-width: 650px) {
31-
display: none;
32-
}
33-
3430
&.halloween {
3531
background-color: ${({ theme }) => theme.colors.menuBackground};
3632
padding: 4px;
@@ -42,6 +38,10 @@ export const MenuSection = styled.nav`
4238
export const Menu = styled.ul`
4339
display: flex;
4440
align-items: center;
41+
42+
@media (max-width: 650px) {
43+
display: none;
44+
}
4545
`;
4646

4747
export const MenuItem = styled.li`
@@ -91,6 +91,8 @@ export const HorizontalLine = styled.div`
9191

9292
export const SocialMedia = styled.div`
9393
color: ${({ theme }) => theme.colors.primary};
94+
display: flex;
95+
9496
& a {
9597
:first-of-type {
9698
margin-right: 8px;
@@ -101,6 +103,38 @@ export const SocialMedia = styled.div`
101103
width: 15px;
102104
height: 15px;
103105
}
106+
107+
& span {
108+
display: none;
109+
}
110+
111+
@media (max-width: 650px) {
112+
display: flex;
113+
flex-direction: row;
114+
align-items: center;
115+
margin: none;
116+
117+
&:first-of-type {
118+
margin-right: 16px;
119+
}
120+
121+
& svg {
122+
width: 20px;
123+
height: 20px;
124+
}
125+
126+
& span {
127+
display: inline;
128+
font-size: 0.7rem;
129+
}
130+
}
131+
}
132+
133+
@media (max-width: 650px) {
134+
width: 100%;
135+
display: flex;
136+
flex-direction: row;
137+
justify-content: center;
104138
}
105139
`;
106140

‎src/components/Icons/BuyCoffee.tsx‎

Lines changed: 11 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -4,69 +4,29 @@ const BuyCoffeeIcon = () => (
44
<svg
55
id="katman_1"
66
xmlns="http://www.w3.org/2000/svg"
7-
xmlnsXlink="http://www.w3.org/1999/xlink"
8-
x="0px"
9-
y="0px"
10-
viewBox="0 0 600 450"
11-
width="50"
12-
height="auto"
13-
style={{}}
14-
xmlSpace="preserve"
7+
x={0}
8+
y={0}
9+
viewBox="146.09 60.782 313.151 329.502"
1510
>
16-
<style type="text/css">
17-
{
18-
"\n .st0 {\n fill: currentColor;\n }\n\n .st1 {\n fill: #FFDD06;\n }\n "
19-
}
20-
</style>
11+
<style>{".st0{fill:currentColor}"}</style>
2112
<path
2213
className="st0"
23-
d="M390.1,137.3l-0.2-0.1l-0.5-0.2C389.5,137.2,389.8,137.3,390.1,137.3z"
14+
d="M390.1 137.3l-.2-.1-.5-.2c.1.2.4.3.7.3zM393.4 160.9l-.3.1.3-.1zM390.1 137.2c-.1 0-.1 0 0 0zM393.1 160.7l.4-.2.1-.1.1-.1c-.2.1-.4.3-.6.4z"
2415
/>
25-
<path className="st0" d="M393.4,160.9l-0.3,0.1L393.4,160.9z" />
2616
<path
2717
className="st0"
28-
d="M390.1,137.2C390.1,137.2,390.1,137.2,390.1,137.2C390,137.2,390,137.2,390.1,137.2 C390.1,137.2,390.1,137.2,390.1,137.2z"
18+
d="M390.7 137.8l-.4-.4-.3-.1c.2.2.4.4.7.5zM297 366.2c-.3.1-.6.3-.8.6l.2-.2c.3-.2.5-.3.6-.4zM351.5 355.4c0-.3-.2-.3-.1.9 0-.1 0-.2.1-.3-.1-.1-.1-.3 0-.6zM345.8 366.2c-.3.1-.6.3-.8.6l.2-.2c.3-.2.5-.3.6-.4zM258.7 368.7c-.2-.2-.5-.3-.8-.4.2.1.5.2.6.3l.2.1zM250.2 360.5c0-.3-.1-.7-.3-1 .1.3.2.6.3 1z"
2919
/>
3020
<path
31-
className="st0"
32-
d="M393.1,160.7l0.4-0.2l0.1-0.1l0.1-0.1C393.5,160.4,393.3,160.6,393.1,160.7z"
33-
/>
34-
<path
35-
className="st0"
36-
d="M390.7,137.8l-0.4-0.4l-0.3-0.1C390.2,137.5,390.4,137.7,390.7,137.8z"
37-
/>
38-
<path
39-
className="st0"
40-
d="M297,366.2c-0.3,0.1-0.6,0.3-0.8,0.6l0.2-0.2C296.7,366.4,296.9,366.3,297,366.2z"
41-
/>
42-
<path
43-
className="st0"
44-
d="M351.5,355.4c0-0.3-0.2-0.3-0.1,0.9c0-0.1,0-0.2,0.1-0.3C351.4,355.9,351.4,355.7,351.5,355.4z"
45-
/>
46-
<path
47-
className="st0"
48-
d="M345.8,366.2c-0.3,0.1-0.6,0.3-0.8,0.6l0.2-0.2C345.5,366.4,345.7,366.3,345.8,366.2z"
21+
d="M308 212.8c-11.8 5.1-25.3 10.8-42.7 10.8-7.3 0-14.5-1-21.5-3l12 123.6c.4 5.2 2.8 10 6.6 13.5s8.8 5.5 14 5.5c0 0 17.1.9 22.8.9 6.1 0 24.5-.9 24.5-.9 5.2 0 10.2-1.9 14-5.5 3.8-3.5 6.2-8.3 6.6-13.5l12.9-136.5c-5.8-2-11.6-3.3-18.1-3.3-11.4 0-20.5 3.9-31.1 8.4z"
22+
fill="#ffdd06"
4923
/>
24+
<path className="st0" d="M206.5 160.2l.2.2.1.1c0-.2-.1-.3-.3-.3z" />
5025
<path
5126
className="st0"
52-
d="M258.7,368.7c-0.2-0.2-0.5-0.3-0.8-0.4c0.2,0.1,0.5,0.2,0.6,0.3L258.7,368.7z"
53-
/>
54-
<path
55-
className="st0"
56-
d="M250.2,360.5c0-0.3-0.1-0.7-0.3-1C250,359.8,250.1,360.1,250.2,360.5L250.2,360.5z"
57-
/>
58-
<path
59-
className="st1"
60-
d="M308,212.8c-11.8,5.1-25.3,10.8-42.7,10.8c-7.3,0-14.5-1-21.5-3l12,123.6c0.4,5.2,2.8,10,6.6,13.5 c3.8,3.5,8.8,5.5,14,5.5c0,0,17.1,0.9,22.8,0.9c6.1,0,24.5-0.9,24.5-0.9c5.2,0,10.2-1.9,14-5.5c3.8-3.5,6.2-8.3,6.6-13.5l12.9-136.5 c-5.8-2-11.6-3.3-18.1-3.3C327.7,204.4,318.6,208.3,308,212.8z"
61-
/>
62-
<path
63-
className="st0"
64-
d="M206.5,160.2l0.2,0.2l0.1,0.1C206.8,160.3,206.7,160.2,206.5,160.2z"
65-
/>
66-
<path
67-
className="st0"
68-
d="M412.8,148.7l-1.8-9.1c-1.6-8.2-5.3-16-13.7-18.9c-2.7-0.9-5.8-1.4-7.8-3.3c-2.1-2-2.7-5-3.2-7.8 c-0.9-5.2-1.7-10.4-2.6-15.6c-0.8-4.5-1.4-9.5-3.4-13.5c-2.7-5.5-8.2-8.7-13.7-10.8c-2.8-1-5.7-1.9-8.6-2.7 c-13.7-3.6-28.1-4.9-42.2-5.7c-16.9-0.9-33.9-0.7-50.8,0.8c-12.6,1.1-25.8,2.5-37.7,6.9c-4.4,1.6-8.9,3.5-12.2,6.9 c-4.1,4.1-5.4,10.6-2.4,15.7c2.1,3.7,5.7,6.3,9.5,8c4.9,2.2,10.1,3.9,15.4,5c14.8,3.3,30,4.5,45.1,5.1c16.7,0.7,33.4,0.1,50.1-1.6 c4.1-0.5,8.2-1,12.3-1.6c4.8-0.7,7.9-7.1,6.5-11.4c-1.7-5.3-6.3-7.3-11.4-6.5c-0.8,0.1-1.5,0.2-2.3,0.3l-0.5,0.1 c-1.8,0.2-3.5,0.4-5.3,0.6c-3.6,0.4-7.2,0.7-10.9,1c-8.1,0.6-16.3,0.8-24.5,0.8c-8,0-16-0.2-24-0.8c-3.7-0.2-7.3-0.5-10.9-0.9 c-1.7-0.2-3.3-0.4-4.9-0.6l-1.6-0.2l-0.3,0l-1.6-0.2c-3.3-0.5-6.6-1.1-9.9-1.8c-0.3-0.1-0.6-0.3-0.8-0.5s-0.3-0.6-0.3-0.9 c0-0.3,0.1-0.7,0.3-0.9s0.5-0.4,0.8-0.5h0.1c2.8-0.6,5.7-1.1,8.6-1.6c1-0.2,1.9-0.3,2.9-0.4h0c1.8-0.1,3.6-0.4,5.4-0.7 c15.6-1.6,31.3-2.2,47-1.7c7.6,0.2,15.2,0.7,22.8,1.4c1.6,0.2,3.3,0.3,4.9,0.5c0.6,0.1,1.2,0.2,1.9,0.2l1.3,0.2 c3.7,0.5,7.3,1.2,11,2c5.4,1.2,12.3,1.6,14.7,7.4c0.8,1.9,1.1,3.9,1.5,5.9l0.5,2.5c0,0,0,0.1,0,0.1c1.3,5.9,2.5,11.8,3.8,17.7 c0.1,0.4,0.1,0.9,0,1.3c-0.1,0.4-0.3,0.9-0.5,1.2c-0.3,0.4-0.6,0.7-1,0.9c-0.4,0.2-0.8,0.4-1.2,0.4h0l-0.8,0.1l-0.8,0.1 c-2.4,0.3-4.9,0.6-7.3,0.9c-4.8,0.5-9.6,1-14.4,1.4c-9.6,0.8-19.1,1.3-28.7,1.6c-4.9,0.1-9.8,0.2-14.7,0.2 c-19.5,0-38.9-1.1-58.2-3.4c-2.1-0.2-4.2-0.5-6.3-0.8c1.6,0.2-1.2-0.2-1.7-0.2c-1.3-0.2-2.7-0.4-4-0.6c-4.5-0.7-8.9-1.5-13.4-2.2 c-5.4-0.9-10.5-0.4-15.4,2.2c-4,2.2-7.2,5.5-9.3,9.6c-2.1,4.3-2.7,9.1-3.7,13.7c-0.9,4.7-2.4,9.7-1.8,14.5 c1.2,10.3,8.4,18.7,18.8,20.6c9.8,1.8,19.6,3.2,29.5,4.4c38.7,4.7,77.9,5.3,116.7,1.7c3.2-0.3,6.3-0.6,9.5-1c1-0.1,2,0,2.9,0.3 c0.9,0.3,1.8,0.9,2.5,1.6c0.7,0.7,1.2,1.5,1.6,2.5c0.3,0.9,0.5,1.9,0.4,2.9l-1,9.6c-2,19.3-4,38.6-5.9,58 c-2.1,20.3-4.1,40.6-6.2,60.9c-0.6,5.7-1.2,11.4-1.8,17.1c-0.6,5.6-0.6,11.4-1.7,17c-1.7,8.7-7.6,14.1-16.2,16.1 c-7.9,1.8-16,2.7-24.1,2.8c-9,0-18-0.3-27-0.3c-9.6,0.1-21.4-0.8-28.8-8c-6.5-6.3-7.4-16.1-8.3-24.6c-1.2-11.2-2.4-22.5-3.5-33.7 l-6.5-62.5l-4.2-40.5c-0.1-0.7-0.1-1.3-0.2-2c-0.5-4.8-3.9-9.5-9.3-9.3c-4.6,0.2-9.8,4.1-9.3,9.3l3.1,30l6.5,62 c1.8,17.6,3.7,35.2,5.5,52.9c0.4,3.4,0.7,6.8,1.1,10.1c2,18.5,16.1,28.4,33.6,31.2c10.2,1.6,20.6,2,31,2.1 c13.3,0.2,26.7,0.7,39.7-1.7c19.3-3.5,33.8-16.4,35.9-36.5c0.6-5.8,1.2-11.6,1.8-17.3c2-19.1,3.9-38.2,5.9-57.4l6.4-62.5l2.9-28.6 c0.1-1.4,0.7-2.8,1.7-3.8s2.2-1.8,3.6-2c5.5-1.1,10.8-2.9,14.7-7.1C413.8,166.2,415,157.5,412.8,148.7z M205,154.9 c0.1,0-0.1,0.7-0.1,1C204.8,155.4,204.8,154.9,205,154.9z M205.5,159c0,0,0.2,0.1,0.3,0.4C205.6,159.2,205.5,159,205.5,159 L205.5,159z M206,159.7C206.2,160.1,206.3,160.3,206,159.7L206,159.7z M207.1,160.6L207.1,160.6 C207.1,160.6,207.2,160.6,207.1,160.6C207.1,160.6,207.1,160.6,207.1,160.6L207.1,160.6z M392.5,159.3c-2,1.9-5,2.8-7.9,3.2 c-33.1,4.9-66.8,7.4-100.3,6.3c-24-0.8-47.7-3.5-71.5-6.8c-2.3-0.3-4.8-0.8-6.4-2.5c-3-3.2-1.5-9.7-0.7-13.7 c0.7-3.6,2.1-8.4,6.4-8.9c6.6-0.8,14.4,2,20.9,3c7.9,1.2,15.9,2.2,23.8,2.9c34,3.1,68.7,2.6,102.5-1.9c6.2-0.8,12.3-1.8,18.5-2.9 c5.5-1,11.5-2.8,14.8,2.8c2.3,3.9,2.6,9,2.2,13.4C394.8,156.2,393.9,158,392.5,159.3L392.5,159.3z"
27+
d="M412.8 148.7l-1.8-9.1c-1.6-8.2-5.3-16-13.7-18.9-2.7-.9-5.8-1.4-7.8-3.3-2.1-2-2.7-5-3.2-7.8-.9-5.2-1.7-10.4-2.6-15.6-.8-4.5-1.4-9.5-3.4-13.5-2.7-5.5-8.2-8.7-13.7-10.8-2.8-1-5.7-1.9-8.6-2.7-13.7-3.6-28.1-4.9-42.2-5.7-16.9-.9-33.9-.7-50.8.8-12.6 1.1-25.8 2.5-37.7 6.9-4.4 1.6-8.9 3.5-12.2 6.9-4.1 4.1-5.4 10.6-2.4 15.7 2.1 3.7 5.7 6.3 9.5 8 4.9 2.2 10.1 3.9 15.4 5 14.8 3.3 30 4.5 45.1 5.1 16.7.7 33.4.1 50.1-1.6 4.1-.5 8.2-1 12.3-1.6 4.8-.7 7.9-7.1 6.5-11.4-1.7-5.3-6.3-7.3-11.4-6.5-.8.1-1.5.2-2.3.3l-.5.1c-1.8.2-3.5.4-5.3.6-3.6.4-7.2.7-10.9 1-8.1.6-16.3.8-24.5.8-8 0-16-.2-24-.8-3.7-.2-7.3-.5-10.9-.9-1.7-.2-3.3-.4-4.9-.6l-1.6-.2h-.3l-1.6-.2c-3.3-.5-6.6-1.1-9.9-1.8-.3-.1-.6-.3-.8-.5s-.3-.6-.3-.9c0-.3.1-.7.3-.9s.5-.4.8-.5h.1c2.8-.6 5.7-1.1 8.6-1.6 1-.2 1.9-.3 2.9-.4 1.8-.1 3.6-.4 5.4-.7 15.6-1.6 31.3-2.2 47-1.7 7.6.2 15.2.7 22.8 1.4 1.6.2 3.3.3 4.9.5.6.1 1.2.2 1.9.2l1.3.2c3.7.5 7.3 1.2 11 2 5.4 1.2 12.3 1.6 14.7 7.4.8 1.9 1.1 3.9 1.5 5.9l.5 2.5v.1c1.3 5.9 2.5 11.8 3.8 17.7.1.4.1.9 0 1.3s-.3.9-.5 1.2c-.3.4-.6.7-1 .9-.4.2-.8.4-1.2.4l-.8.1-.8.1c-2.4.3-4.9.6-7.3.9-4.8.5-9.6 1-14.4 1.4-9.6.8-19.1 1.3-28.7 1.6-4.9.1-9.8.2-14.7.2-19.5 0-38.9-1.1-58.2-3.4-2.1-.2-4.2-.5-6.3-.8 1.6.2-1.2-.2-1.7-.2-1.3-.2-2.7-.4-4-.6-4.5-.7-8.9-1.5-13.4-2.2-5.4-.9-10.5-.4-15.4 2.2-4 2.2-7.2 5.5-9.3 9.6-2.1 4.3-2.7 9.1-3.7 13.7-.9 4.7-2.4 9.7-1.8 14.5 1.2 10.3 8.4 18.7 18.8 20.6 9.8 1.8 19.6 3.2 29.5 4.4 38.7 4.7 77.9 5.3 116.7 1.7 3.2-.3 6.3-.6 9.5-1 1-.1 2 0 2.9.3.9.3 1.8.9 2.5 1.6.7.7 1.2 1.5 1.6 2.5.3.9.5 1.9.4 2.9l-1 9.6c-2 19.3-4 38.6-5.9 58-2.1 20.3-4.1 40.6-6.2 60.9l-1.8 17.1c-.6 5.6-.6 11.4-1.7 17-1.7 8.7-7.6 14.1-16.2 16.1-7.9 1.8-16 2.7-24.1 2.8-9 0-18-.3-27-.3-9.6.1-21.4-.8-28.8-8-6.5-6.3-7.4-16.1-8.3-24.6-1.2-11.2-2.4-22.5-3.5-33.7l-6.5-62.5-4.2-40.5c-.1-.7-.1-1.3-.2-2-.5-4.8-3.9-9.5-9.3-9.3-4.6.2-9.8 4.1-9.3 9.3l3.1 30 6.5 62c1.8 17.6 3.7 35.2 5.5 52.9.4 3.4.7 6.8 1.1 10.1 2 18.5 16.1 28.4 33.6 31.2 10.2 1.6 20.6 2 31 2.1 13.3.2 26.7.7 39.7-1.7 19.3-3.5 33.8-16.4 35.9-36.5.6-5.8 1.2-11.6 1.8-17.3 2-19.1 3.9-38.2 5.9-57.4l6.4-62.5 2.9-28.6c.1-1.4.7-2.8 1.7-3.8s2.2-1.8 3.6-2c5.5-1.1 10.8-2.9 14.7-7.1 5.8-6.6 7-15.3 4.8-24.1zM205 154.9c.1 0-.1.7-.1 1-.1-.5-.1-1 .1-1zm.5 4.1s.2.1.3.4c-.2-.2-.3-.4-.3-.4zm.5.7c.2.4.3.6 0 0zm1.1.9s.1 0 0 0zm185.4-1.3c-2 1.9-5 2.8-7.9 3.2-33.1 4.9-66.8 7.4-100.3 6.3-24-.8-47.7-3.5-71.5-6.8-2.3-.3-4.8-.8-6.4-2.5-3-3.2-1.5-9.7-.7-13.7.7-3.6 2.1-8.4 6.4-8.9 6.6-.8 14.4 2 20.9 3 7.9 1.2 15.9 2.2 23.8 2.9 34 3.1 68.7 2.6 102.5-1.9 6.2-.8 12.3-1.8 18.5-2.9 5.5-1 11.5-2.8 14.8 2.8 2.3 3.9 2.6 9 2.2 13.4 0 2-.9 3.8-2.3 5.1z"
6928
/>
7029
</svg>
7130
);
31+
7232
export default memo(BuyCoffeeIcon);

0 commit comments

Comments
 (0)