From c8e42eebd4c68b08756d8e87a41abee8c3e45d56 Mon Sep 17 00:00:00 2001 From: Philip Molares Date: Sun, 31 May 2020 22:21:32 +0200 Subject: [PATCH] Replace font awesome with fork awesome (#114) * added fork-awesome-icon * removed fontAwesome * changed FontAwesomeIcon to ForkAwesomeIcon Signed-off-by: Philip Molares --- package.json | 27 ++++---- .../application-loader/loading-screen.tsx | 4 +- .../editor/task-bar/connection-indicator.tsx | 4 +- .../editor/task-bar/dark-mode-button.tsx | 6 +- .../editor/task-bar/editor-menu.tsx | 24 ++++---- .../editor/task-bar/editor-view-mode.tsx | 10 +-- .../editor/task-bar/help-button.tsx | 12 ++-- src/components/editor/task-bar/task-bar.tsx | 8 +-- src/components/icon-button/icon-button.tsx | 7 +-- .../landing/layout/footer/social-links.tsx | 6 +- .../navigation/new-guest-note-button.tsx | 4 +- .../navigation/new-user-note-button.tsx | 4 +- .../user-dropdown/user-dropdown.tsx | 8 +-- .../version-info/version-input-field.tsx | 6 +- .../pages/history/common/close-button.tsx | 4 +- .../pages/history/common/pin-button.tsx | 6 +- .../history/history-card/history-card.tsx | 4 +- .../history-toolbar/clear-history-button.tsx | 6 +- .../history-toolbar/history-toolbar.tsx | 8 +-- .../landing/pages/intro/feature-links.tsx | 8 +-- src/components/landing/pages/intro/intro.tsx | 6 +- .../social-link-button/social-link-button.tsx | 7 +-- .../pages/login/auth/via-one-click.tsx | 16 ++--- .../settings/profile-account-management.tsx | 6 +- src/components/links/external-link.tsx | 4 +- src/components/links/internal-link.tsx | 4 +- src/components/links/types.ts | 4 +- src/components/sort-button/sort-button.tsx | 8 +-- src/fork-awesome/fork-awesome-icon.tsx | 21 +++++++ src/index.tsx | 3 - src/initializers/fontAwesome.ts | 61 ------------------- src/utils/iconProp.ts | 4 -- yarn.lock | 38 ++---------- 33 files changed, 134 insertions(+), 214 deletions(-) create mode 100644 src/fork-awesome/fork-awesome-icon.tsx delete mode 100644 src/initializers/fontAwesome.ts delete mode 100644 src/utils/iconProp.ts diff --git a/package.json b/package.json index 380316125..e78311607 100644 --- a/package.json +++ b/package.json @@ -3,10 +3,6 @@ "license": "AGPL-3.0", "version": "0.1.0", "dependencies": { - "@fortawesome/fontawesome-svg-core": "^1.2.28", - "@fortawesome/free-brands-svg-icons": "^5.13.0", - "@fortawesome/free-solid-svg-icons": "^5.13.0", - "@fortawesome/react-fontawesome": "^0.1.9", "@testing-library/jest-dom": "^4.2.4", "@testing-library/react": "^9.3.2", "@testing-library/user-event": "^7.1.2", @@ -21,7 +17,18 @@ "@types/react-router": "^5.1.7", "@types/react-router-bootstrap": "^0.24.5", "@types/react-router-dom": "^5.1.5", + "@typescript-eslint/eslint-plugin": "^3.0.0", + "@typescript-eslint/parser": "^3.0.0", "bootstrap": "^4.4.1", + "eslint-config-react-app": "^5.2.1", + "eslint-config-standard": "^14.1.1", + "eslint-plugin-flowtype": "^5.1.0", + "eslint-plugin-import": "^2.20.2", + "eslint-plugin-jsx-a11y": "^6.2.3", + "eslint-plugin-node": "^11.1.0", + "eslint-plugin-promise": "^4.2.1", + "eslint-plugin-standard": "^4.0.1", + "fork-awesome": "^1.1.7", "i18next": "^19.4.4", "i18next-browser-languagedetector": "^4.1.1", "i18next-http-backend": "^1.0.8", @@ -38,17 +45,7 @@ "react-router-dom": "^5.1.2", "react-scripts": "3.4.1", "redux": "^4.0.5", - "typescript": "~3.7.2", - "@typescript-eslint/eslint-plugin": "^3.0.0", - "@typescript-eslint/parser": "^3.0.0", - "eslint-config-react-app": "^5.2.1", - "eslint-config-standard": "^14.1.1", - "eslint-plugin-flowtype": "^5.1.0", - "eslint-plugin-import": "^2.20.2", - "eslint-plugin-jsx-a11y": "^6.2.3", - "eslint-plugin-node": "^11.1.0", - "eslint-plugin-promise": "^4.2.1", - "eslint-plugin-standard": "^4.0.1" + "typescript": "~3.7.2" }, "scripts": { "start": "react-scripts start", diff --git a/src/components/application-loader/loading-screen.tsx b/src/components/application-loader/loading-screen.tsx index 0477c375f..f157b7985 100644 --- a/src/components/application-loader/loading-screen.tsx +++ b/src/components/application-loader/loading-screen.tsx @@ -1,6 +1,6 @@ -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import React from 'react' import { Alert } from 'react-bootstrap' +import { ForkAwesomeIcon } from '../../fork-awesome/fork-awesome-icon' export interface LoadingScreenProps { failedTitle: string @@ -10,7 +10,7 @@ export const LoadingScreen: React.FC = ({ failedTitle }) => return (
-
{ diff --git a/src/components/editor/task-bar/connection-indicator.tsx b/src/components/editor/task-bar/connection-indicator.tsx index 9115ba2b4..4e4f9eaca 100644 --- a/src/components/editor/task-bar/connection-indicator.tsx +++ b/src/components/editor/task-bar/connection-indicator.tsx @@ -1,6 +1,6 @@ -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import React from 'react' import { Dropdown } from 'react-bootstrap' +import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon' import { ActiveIndicatorStatus } from './active-indicator' import './connection-indicator.scss' import { UserLine } from './user-line' @@ -10,7 +10,7 @@ const ConnectionIndicator: React.FC = () => { return ( - {userOnline} Online + {userOnline} Online diff --git a/src/components/editor/task-bar/dark-mode-button.tsx b/src/components/editor/task-bar/dark-mode-button.tsx index 61ba5e7be..4faf5cc55 100644 --- a/src/components/editor/task-bar/dark-mode-button.tsx +++ b/src/components/editor/task-bar/dark-mode-button.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { ToggleButton, ToggleButtonGroup } from 'react-bootstrap' import { useTranslation } from 'react-i18next' +import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon' const DarkModeButton: React.FC = () => { const { t } = useTranslation() @@ -19,8 +19,8 @@ const DarkModeButton: React.FC = () => { onChange={buttonToggle} value={'dark'} > {buttonState - ? - : + ? + : } diff --git a/src/components/editor/task-bar/editor-menu.tsx b/src/components/editor/task-bar/editor-menu.tsx index 169ccf8b8..a8a9b479d 100644 --- a/src/components/editor/task-bar/editor-menu.tsx +++ b/src/components/editor/task-bar/editor-menu.tsx @@ -1,7 +1,7 @@ import React from 'react' import { Dropdown } from 'react-bootstrap' import { Trans, useTranslation } from 'react-i18next' -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' +import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon' const EditorMenu: React.FC = () => { useTranslation() @@ -16,13 +16,13 @@ const EditorMenu: React.FC = () => { - + - + - + @@ -31,10 +31,10 @@ const EditorMenu: React.FC = () => { - Dropbox + Dropbox - Gist + Gist @@ -43,13 +43,13 @@ const EditorMenu: React.FC = () => { - Dropbox + Dropbox - Gist + Gist - + @@ -58,13 +58,13 @@ const EditorMenu: React.FC = () => { - Markdown + Markdown - HTML + HTML - + diff --git a/src/components/editor/task-bar/editor-view-mode.tsx b/src/components/editor/task-bar/editor-view-mode.tsx index 92ac12919..e1f587273 100644 --- a/src/components/editor/task-bar/editor-view-mode.tsx +++ b/src/components/editor/task-bar/editor-view-mode.tsx @@ -1,14 +1,14 @@ import { ToggleButton, ToggleButtonGroup } from 'react-bootstrap' -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import React from 'react' import { useSelector } from 'react-redux' +import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon' import { ApplicationState } from '../../../redux' import { EditorMode } from '../../../redux/editor/types' import { setEditorModeConfig } from '../../../redux/editor/methods' import { useTranslation } from 'react-i18next' const EditorViewMode: React.FC = () => { - const { t } = useTranslation(); + const { t } = useTranslation() const editorConfig = useSelector((state: ApplicationState) => state.editorConfig) return ( { defaultValue={editorConfig.editorMode} onChange={(value: EditorMode) => { setEditorModeConfig(value) }}> - + - + - + ) diff --git a/src/components/editor/task-bar/help-button.tsx b/src/components/editor/task-bar/help-button.tsx index 8d7b83800..2c982ac13 100644 --- a/src/components/editor/task-bar/help-button.tsx +++ b/src/components/editor/task-bar/help-button.tsx @@ -1,7 +1,7 @@ -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import React, { Fragment, useState } from 'react' import { Button, Card, Col, Modal, Row, Table } from 'react-bootstrap' import { Trans, useTranslation } from 'react-i18next' +import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon' import { TranslatedExternalLink } from '../../links/translated-external-link' export const HelpButton: React.FC = () => { @@ -14,12 +14,12 @@ export const HelpButton: React.FC = () => { - + @@ -76,7 +76,7 @@ export const HelpButton: React.FC = () => { @@ -84,7 +84,7 @@ export const HelpButton: React.FC = () => { @@ -92,7 +92,7 @@ export const HelpButton: React.FC = () => { diff --git a/src/components/editor/task-bar/task-bar.tsx b/src/components/editor/task-bar/task-bar.tsx index 48b9ae58a..057749ad5 100644 --- a/src/components/editor/task-bar/task-bar.tsx +++ b/src/components/editor/task-bar/task-bar.tsx @@ -1,7 +1,7 @@ import React from 'react' -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { Link } from 'react-router-dom' import { Button, Nav, Navbar } from 'react-bootstrap' +import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon' import { DarkModeButton } from './dark-mode-button' import { EditorViewMode } from './editor-view-mode' import { Trans, useTranslation } from 'react-i18next' @@ -16,7 +16,7 @@ const TaskBar: React.FC = () => {