From 53623fad76274e39206b8e073e371775ea96946b Mon Sep 17 00:00:00 2001
From: Fabian Mastenbroek <mail.fabianm@gmail.com>
Date: Mon, 17 May 2021 12:16:10 +0200
Subject: ui: Migrate to FontAwesome 5 React library

This change updates the frontend to use the FontAwesome 5 React library
that renders SVG icons as opposed to CSS icon fonts. This migration
resolves a couple of issues we had with server-side rendering of the
previous FontAwesome icons.
---
 .../src/components/app/map/controls/ZoomControlComponent.js         | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

(limited to 'opendc-web/opendc-web-ui/src/components/app/map/controls/ZoomControlComponent.js')

diff --git a/opendc-web/opendc-web-ui/src/components/app/map/controls/ZoomControlComponent.js b/opendc-web/opendc-web-ui/src/components/app/map/controls/ZoomControlComponent.js
index 65944bea..6bae792c 100644
--- a/opendc-web/opendc-web-ui/src/components/app/map/controls/ZoomControlComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/map/controls/ZoomControlComponent.js
@@ -1,4 +1,6 @@
 import React from 'react'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faPlus, faMinus } from '@fortawesome/free-solid-svg-icons'
 
 const ZoomControlComponent = ({ zoomInOnCenter }) => {
     return (
@@ -8,14 +10,14 @@ const ZoomControlComponent = ({ zoomInOnCenter }) => {
                 title="Zoom in"
                 onClick={() => zoomInOnCenter(true)}
             >
-                <span className="fa fa-plus" />
+                <FontAwesomeIcon icon={faPlus} />
             </button>
             <button
                 className="btn btn-default btn-circle btn-sm mr-1"
                 title="Zoom out"
                 onClick={() => zoomInOnCenter(false)}
             >
-                <span className="fa fa-minus" />
+                <FontAwesomeIcon icon={faMinus} />
             </button>
         </span>
     )
-- 
cgit v1.2.3