Replace floating menu icons with text (canada-ca#2376)

* Replace floating menu icons with text

Icons don't convey enough meaning to users.
Users would have to guess till they end up on the page they want.

* remove unused import

Author: EveningStarlight

frontend/src/FloatingMenu.js

@@ -17,13 +17,10 @@ import {
   Image,
   useToast,
   Heading,
-  Icon,
 } from '@chakra-ui/core'
 import { TrackerButton } from './TrackerButton'
 import { Trans, t } from '@lingui/macro'
 import wordmark from './images/canada-wordmark.svg'
-import reportIcon from './images/report-icon.svg'
-import buildingIcon from './images/building-icon.svg'
 import { useLingui } from '@lingui/react'
 import { useUserState } from './UserState'
 
@@ -51,10 +48,12 @@ export const FloatingMenu = () => {
       p="4px"
       display={{ base: 'static', md: 'none' }}
     >
-      <Stack isInline width="100%" rounded="md" spacing={0}>
+      <Stack isInline width="100%" rounded="md" spacing={0}
+        fontSize={{base:'60%', sm:'100%'}}
+      >
         <Link as={RouteLink} to="/organizations" flex="1 1 0">
           <TrackerButton variant="primary" rounded={0} w="100%" h="100%">
-            <Image src={buildingIcon} size="16px" />
+            <Trans>Organizations</Trans>
           </TrackerButton>
         </Link>
         <Divider
@@ -65,7 +64,7 @@ export const FloatingMenu = () => {
         />
         <Link as={RouteLink} to="/domains" flex="1 1 0">
           <TrackerButton variant="primary" rounded={0} w="100%" h="100%">
-            <Icon name="https" height="16px" width="100%" />
+            <Trans>Domains</Trans>
           </TrackerButton>
         </Link>
         <Divider
@@ -76,7 +75,7 @@ export const FloatingMenu = () => {
         />
         <Link as={RouteLink} to="/dmarc-summaries" flex="1 1 0">
           <TrackerButton variant="primary" rounded={0} w="100%" h="100%">
-            <Image src={reportIcon} size="16px" />
+            <Trans>DMARC Report</Trans>
           </TrackerButton>
         </Link>
         <Divider