From 28592ba44d2318a79d7bafc61fcb9bf89c382102 Mon Sep 17 00:00:00 2001 From: Borys_Levytskyi Date: Thu, 14 Jan 2021 22:43:23 +0200 Subject: [PATCH] Replace custom icons with font awesome --- package-lock.json | 42 ++++++++++++++++++++++++++++++ package.json | 5 ++++ src/img/feedback-dark.png | Bin 1108 -> 0 bytes src/img/feedback-light.png | Bin 1108 -> 0 bytes src/img/github-dark.png | Bin 470 -> 0 bytes src/img/github-light.png | Bin 605 -> 0 bytes src/img/twitter-dark.png | Bin 1108 -> 0 bytes src/img/twitter-light.png | Bin 1108 -> 0 bytes src/index.css | 18 ------------- src/shell/components/AppRoot.tsx | 14 +++------- src/shell/components/TopLinks.css | 5 ++++ src/shell/components/TopLinks.tsx | 21 +++++++++++++++ 12 files changed, 76 insertions(+), 29 deletions(-) delete mode 100644 src/img/feedback-dark.png delete mode 100644 src/img/feedback-light.png delete mode 100644 src/img/github-dark.png delete mode 100644 src/img/github-light.png delete mode 100644 src/img/twitter-dark.png delete mode 100644 src/img/twitter-light.png create mode 100644 src/shell/components/TopLinks.css create mode 100644 src/shell/components/TopLinks.tsx diff --git a/package-lock.json b/package-lock.json index d96ae01..383f9aa 100644 --- a/package-lock.json +++ b/package-lock.json @@ -911,6 +911,48 @@ "resolved": "https://registry.npmjs.org/@csstools/normalize.css/-/normalize.css-9.0.1.tgz", "integrity": "sha512-6It2EVfGskxZCQhuykrfnALg7oVeiI6KclWSmGDqB0AiInVrTGB9Jp9i4/Ad21u9Jde/voVQz6eFX/eSg/UsPA==" }, + "@fortawesome/fontawesome-common-types": { + "version": "0.2.34", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.34.tgz", + "integrity": "sha512-XcIn3iYbTEzGIxD0/dY5+4f019jIcEIWBiHc3KrmK/ROahwxmZ/s+tdj97p/5K0klz4zZUiMfUlYP0ajhSJjmA==" + }, + "@fortawesome/fontawesome-free": { + "version": "5.15.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-5.15.2.tgz", + "integrity": "sha512-7l/AX41m609L/EXI9EKH3Vs3v0iA8tKlIOGtw+kgcoanI7p+e4I4GYLqW3UXWiTnjSFymKSmTTPKYrivzbxxqA==" + }, + "@fortawesome/fontawesome-svg-core": { + "version": "1.2.34", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.34.tgz", + "integrity": "sha512-0KNN0nc5eIzaJxlv43QcDmTkDY1CqeN6J7OCGSs+fwGPdtv0yOQqRjieopBCmw+yd7uD3N2HeNL3Zm5isDleLg==", + "requires": { + "@fortawesome/fontawesome-common-types": "^0.2.34" + } + }, + "@fortawesome/free-brands-svg-icons": { + "version": "5.15.2", + "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.15.2.tgz", + "integrity": "sha512-YPlVjE1cEO+OJ9I9ay3TQ3I88+XkxMTYwnnddqAboxLhPNGncsHV0DjWOVLCyuAY66yPfyndWwVn4v7vuqsO1g==", + "requires": { + "@fortawesome/fontawesome-common-types": "^0.2.34" + } + }, + "@fortawesome/free-solid-svg-icons": { + "version": "5.15.2", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.15.2.tgz", + "integrity": "sha512-ZfCU+QjaFsdNZmOGmfqEWhzI3JOe37x5dF4kz9GeXvKn/sTxhqMtZ7mh3lBf76SvcYY5/GKFuyG7p1r4iWMQqw==", + "requires": { + "@fortawesome/fontawesome-common-types": "^0.2.34" + } + }, + "@fortawesome/react-fontawesome": { + "version": "0.1.14", + "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.14.tgz", + "integrity": "sha512-4wqNb0gRLVaBm/h+lGe8UfPPivcbuJ6ecI4hIgW0LjI7kzpYB9FkN0L9apbVzg+lsBdcTf0AlBtODjcSX5mmKA==", + "requires": { + "prop-types": "^15.7.2" + } + }, "@hapi/address": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.0.0.tgz", diff --git a/package.json b/package.json index 1abd5e2..8f423b6 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,11 @@ "version": "0.1.0", "private": true, "dependencies": { + "@fortawesome/fontawesome-free": "^5.15.2", + "@fortawesome/fontawesome-svg-core": "^1.2.34", + "@fortawesome/free-brands-svg-icons": "^5.15.2", + "@fortawesome/free-solid-svg-icons": "^5.15.2", + "@fortawesome/react-fontawesome": "^0.1.14", "@types/enzyme": "^3.9.4", "@types/jest": "^24.0.15", "@types/node": "^12.0.10", diff --git a/src/img/feedback-dark.png b/src/img/feedback-dark.png deleted file mode 100644 index c693b65b7bcab34a92c9886b081ed1a5614b264c..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1108 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!61|;P_|4(FKV3GE8aSX8#WE5a|{~IVe7{Je; zKl}gu`E!#L4Aip{?Dii&e)xR*_KoZB-@p6+6A6H7FMs*+MGR<&4a2{G|Na6QNk9RR zA$tj#0aSDG^XJbZzkdC40qXtA0MY<6 zZjcxthBfw~045Rm4tU%v{$oDEV711JW71Yw2%y~6?2xE+X3rGNHP|r%R+XVy!d?Y0$xmZ|O_5%g}6N8zVnJNxtf&v%N8#oOCYCeyq8Kf8PY>*)-N=ix~ zLv|yHgS~}AGl~H)mtYtI(hT&o5R$XOhC(fYy8tE#a|s8~CEJ0TPvg;y;Q|yxjE#+% z%*@PKaM%n}i{S#81jr>Bz^L+qhBizboyKVZx>ApYG7 U*&lb8a)4an>FVdQ&MBb@0P&2tsQ>@~ diff --git a/src/img/github-dark.png b/src/img/github-dark.png deleted file mode 100644 index 07ecd24763f7c65802598086ab0743c407b615d6..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 470 zcmV;{0V)28P)TOS_S*Yj=ZB_HC)AR9u0F>(SJ%|> zW`4S{Q(adZ>XBMdm*Nxxds8cF$4|`%>Z3aM$B?<;?0*qaH=;18cKx&EP;kot8Fd0U z0TzJ^;1bvZwt)el4Y&m+ffZm1=mn}ko-pSqCXD!hOa`~67PG)?r~yp>>hfpIM6Lp} zS)dQN3UIjvfrN7n^k)HqOn^Nt2y{oz0A_)EAQ#|i3j$}6bHH6R%xk+eDEvjc>Xg$7HKkl50cT3U8&P_aB7XSbN M07*qoM6N<$g6Dg>-2eap diff --git a/src/img/github-light.png b/src/img/github-light.png deleted file mode 100644 index 8df17f1cc321a1b65b1323d3d223376b784aa8d1..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 605 zcmV-j0;2tiP)598NV$C6v<{>7YClbH0Wfs~5y$a{WIq2taRqJdrzA-(0Wbmp zx>2+$g;>&Bua^f0HwJ0C#X_89qFv`);(%bc-@jdsMt7z>@3a(RVcPdk75n?Ipp=@Q z?e*Mjuje|Q&g1cr0KiObXi%l?bUKeKzEWzQeJNLtqG|nXT zI2Vp<#}4=j0D`C;$MLmE>M#tK1ak|AlYg-QHmq~l>GzG*`ehUZ7yl)Wl)4~=cv@?{ z<5KHKqw)aGIg<^C!@MXyFms`lny*;C?_Xi&-Kj?7qhLN!^{urJInVPip6@-G?e(TY zDHof~=CTTc&&<42GuUgjTHSgYZSDOuO}`%fg*b}d6Z2VP?Kx}hFwgU>##h}q-WJR= z0AP%H-5(6DAKvH~Nt!N#XiYGG_oV!W>Uj^*ti)RDyOkIKL_Jnf6mO;*jeQVxJ>DjYqEa;NYpFd~%^XJdjfB*jd{q^hD;?JKy^P#H& z^MC*TUGVqs-^W13bzi=G5rHWJil_ZY0w6U%fBsa1$-`-&Gx>m;FM`wpZTk$=SoQMd zOE#c}`$+o1OrY3dxJDQQXe%GcbY#Uq{$*r7j19ElKhPB^-@ktkfawR*KmiA!rq3{i z_-LTI*T8_SK`{X2H=x8ppbbCqX$H9f7@#R%zkZcKF#yB?#)cG7!Eby904+g;!J9X4 zWYA3kx@0;o1AvBq2g)14^?*3Q5MK_Afkq&11)6>u4 zfeQZO(D)lDzZMv1nDGxY1Vn>UBhWP&K*bY*crFlk1Nm`S0}EN>fU?(HA2)c)I;|Vz N2v1i(mvv4FO#q_j*AxH% diff --git a/src/img/twitter-light.png b/src/img/twitter-light.png deleted file mode 100644 index ee35e405f7a35f2da73ef190f3a49db989cc0c37..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1108 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!61|;P_|4(FKV3GE8aSX8#WE5a|{~IVe6o7() z0+*1GP=u(cs9$VsEE85Yi;IgZSy))Gpi5d=SuwG)vTkK$Wc%>0<0oxM&%LP7+lh?A2u4aoiv!%R#}kNNre)nM{)T3K0{4`|axkV2qspMeHe znV6Wc0S&zm(+s0oSXd6jHNqIu($ah&7r+#OXrO_Yk@?7M9v+?)K|#R)pcn!G1ss5e zd
diff --git a/src/shell/components/TopLinks.css b/src/shell/components/TopLinks.css new file mode 100644 index 0000000..5e14e82 --- /dev/null +++ b/src/shell/components/TopLinks.css @@ -0,0 +1,5 @@ + +.top-links { position: absolute; right: 10px; top: 10px; list-style-type: none; margin: 0 } +.top-links li { float: left; } +.top-links a { display: inline-block; padding: 10px 15px} +.top-links .icon { margin-right: 5px; vertical-align: middle; } \ No newline at end of file diff --git a/src/shell/components/TopLinks.tsx b/src/shell/components/TopLinks.tsx new file mode 100644 index 0000000..93084f3 --- /dev/null +++ b/src/shell/components/TopLinks.tsx @@ -0,0 +1,21 @@ +import React from 'react'; +import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'; +import { faEnvelope } from "@fortawesome/free-solid-svg-icons"; +import { faTwitter, faGithub} from "@fortawesome/free-brands-svg-icons"; +import './TopLinks.css'; + +function TopLinks() { + return ; +} + +export default TopLinks; \ No newline at end of file