diff --git a/src/icons/ArrowLeft.js b/src/icons/ArrowLeft.js index c956cad0f..ea60a5b09 100644 --- a/src/icons/ArrowLeft.js +++ b/src/icons/ArrowLeft.js @@ -1,8 +1,22 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faArrowLeft } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faArrowLeft })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/Ban.js b/src/icons/Ban.js index 0d81ceb3c..a0012131e 100644 --- a/src/icons/Ban.js +++ b/src/icons/Ban.js @@ -1,9 +1,24 @@ +import React from 'react'; import styled from 'styled-components'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faBan } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FaIcon).attrs({ icon: faBan })` - color: ${({ theme }) => theme.palette.base.shade3}; - font-size: ${({ height = 'inherit' }) => height}; +export default styled(Svg)` + fill: ${({ theme }) => theme.palette.base.shade3}; `; diff --git a/src/icons/Camera.js b/src/icons/Camera.js index 1ddfb20f6..e82dbda93 100644 --- a/src/icons/Camera.js +++ b/src/icons/Camera.js @@ -1,7 +1,21 @@ -import styled from 'styled-components'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faCamera } from '@fortawesome/pro-regular-svg-icons'; +import React from 'react'; -export default styled(FaIcon).attrs({ icon: faCamera })` - font-size: '${({ height = 'inherit' }) => height}'; -`; +const Svg = (props) => ( + + + +); + +export default Svg; diff --git a/src/icons/Check.js b/src/icons/Check.js index 711fceed6..5ee8b795b 100644 --- a/src/icons/Check.js +++ b/src/icons/Check.js @@ -1,8 +1,20 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faCheck } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faCheck })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/CheckCircle.js b/src/icons/CheckCircle.js index fe2efa6dd..4207a5a07 100644 --- a/src/icons/CheckCircle.js +++ b/src/icons/CheckCircle.js @@ -1,8 +1,24 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faCheckCircle } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faCheckCircle })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/ChevronDown.js b/src/icons/ChevronDown.js index ac8908c9a..436c97c46 100644 --- a/src/icons/ChevronDown.js +++ b/src/icons/ChevronDown.js @@ -1,8 +1,20 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faChevronDown } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faChevronDown })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/ChevronLeft.js b/src/icons/ChevronLeft.js index 9050fb049..e1f83d4c9 100644 --- a/src/icons/ChevronLeft.js +++ b/src/icons/ChevronLeft.js @@ -1,10 +1,21 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faChevronLeft } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faChevronLeft })` - && { - font-size: ${({ height = 'inherit' }) => height}; - } -`; +export default Svg; diff --git a/src/icons/ChevronRight.js b/src/icons/ChevronRight.js index 7fa3d7d5e..10514e47d 100644 --- a/src/icons/ChevronRight.js +++ b/src/icons/ChevronRight.js @@ -1,10 +1,21 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faChevronRight } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faChevronRight })` - && { - font-size: ${({ height = 'inherit' }) => height}; - } -`; +export default Svg; diff --git a/src/icons/Comment.js b/src/icons/Comment.js index 4ee43b774..557fa0253 100644 --- a/src/icons/Comment.js +++ b/src/icons/Comment.js @@ -1,8 +1,21 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faCommentAlt } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faCommentAlt })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/CreateChat.js b/src/icons/CreateChat.js index 3918641dc..bed913d70 100644 --- a/src/icons/CreateChat.js +++ b/src/icons/CreateChat.js @@ -1,8 +1,23 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faCommentAltPlus } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faCommentAltPlus })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/EllipsisH.js b/src/icons/EllipsisH.js index 0db5c4a9d..275aaf167 100644 --- a/src/icons/EllipsisH.js +++ b/src/icons/EllipsisH.js @@ -1,7 +1,20 @@ -import styled from 'styled-components'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faEllipsisH } from '@fortawesome/pro-regular-svg-icons'; +import React from 'react'; -export default styled(FaIcon).attrs({ icon: faEllipsisH })` - font-size: ${({ height = 'inherit' }) => height}; -`; +const Svg = (props) => ( + + + +); + +export default Svg; diff --git a/src/icons/EllipsisV.js b/src/icons/EllipsisV.js index 3031524ca..0bb1a4796 100644 --- a/src/icons/EllipsisV.js +++ b/src/icons/EllipsisV.js @@ -1,7 +1,19 @@ -import styled from 'styled-components'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faEllipsisV } from '@fortawesome/pro-solid-svg-icons'; +import React from 'react'; -export default styled(FaIcon).attrs({ icon: faEllipsisV })` - font-size: ${({ height = 'inherit' }) => height}; -`; +const Svg = (props) => ( + + + +); + +export default Svg; diff --git a/src/icons/ExclamationCircle.js b/src/icons/ExclamationCircle.js index 965278fe6..a31de50b4 100644 --- a/src/icons/ExclamationCircle.js +++ b/src/icons/ExclamationCircle.js @@ -1,8 +1,24 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faExclamationCircle } from '@fortawesome/pro-solid-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faExclamationCircle })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/FileAttachment.js b/src/icons/FileAttachment.js index cb0ff046d..daf1fdfcd 100644 --- a/src/icons/FileAttachment.js +++ b/src/icons/FileAttachment.js @@ -1,7 +1,28 @@ -import styled from 'styled-components'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faPaperclip } from '@fortawesome/pro-light-svg-icons'; +import React from 'react'; -export default styled(FaIcon).attrs({ icon: faPaperclip })` - font-size: ${({ height = 'inherit' }) => height}; -`; +const Svg = (props) => ( + + + +); + +export default Svg; diff --git a/src/icons/Globe.js b/src/icons/Globe.js index a3e33cfc8..58ba9d741 100644 --- a/src/icons/Globe.js +++ b/src/icons/Globe.js @@ -1,8 +1,33 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faGlobeAfrica } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faGlobeAfrica })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/ImageAttachment.js b/src/icons/ImageAttachment.js index b3458df29..b09209af9 100644 --- a/src/icons/ImageAttachment.js +++ b/src/icons/ImageAttachment.js @@ -1,7 +1,22 @@ -import styled from 'styled-components'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faImage } from '@fortawesome/pro-light-svg-icons'; +import React from 'react'; -export default styled(FaIcon).attrs({ icon: faImage })` - font-size: ${({ height = 'inherit' }) => height}; -`; +const Svg = (props) => ( + + + +); + +export default Svg; diff --git a/src/icons/Lock.js b/src/icons/Lock.js index 36271d78d..30b02ba3c 100644 --- a/src/icons/Lock.js +++ b/src/icons/Lock.js @@ -1,7 +1,21 @@ -import styled from 'styled-components'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faLockAlt } from '@fortawesome/pro-regular-svg-icons'; +import React from 'react'; -export default styled(FaIcon).attrs({ icon: faLockAlt })` - font-size: ${({ height = 'inherit' }) => height}; -`; +const Svg = (props) => ( + + + +); + +export default Svg; diff --git a/src/icons/Message.js b/src/icons/Message.js index 0b4f2d7ea..7abb7a92e 100644 --- a/src/icons/Message.js +++ b/src/icons/Message.js @@ -1,8 +1,24 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faCommentsAlt } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faCommentsAlt })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/MinusCircle.js b/src/icons/MinusCircle.js index 505692080..638d2b923 100644 --- a/src/icons/MinusCircle.js +++ b/src/icons/MinusCircle.js @@ -1,8 +1,20 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faMinusCircle } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faMinusCircle })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/Newspaper.js b/src/icons/Newspaper.js index a62dd7898..2ee5dc006 100644 --- a/src/icons/Newspaper.js +++ b/src/icons/Newspaper.js @@ -1,8 +1,28 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faNewspaper } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faNewspaper })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/NewspaperLight.js b/src/icons/NewspaperLight.js index 3c5b89f5b..65cb719b6 100644 --- a/src/icons/NewspaperLight.js +++ b/src/icons/NewspaperLight.js @@ -1,8 +1,28 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faNewspaper } from '@fortawesome/pro-light-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faNewspaper })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/Pencil.js b/src/icons/Pencil.js index f9720da95..cc3dcd4d6 100644 --- a/src/icons/Pencil.js +++ b/src/icons/Pencil.js @@ -1,8 +1,25 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faPencil } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FaIcon).attrs({ icon: faPencil })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/PlayCircle.js b/src/icons/PlayCircle.js index 06cd53aae..212ebbdba 100644 --- a/src/icons/PlayCircle.js +++ b/src/icons/PlayCircle.js @@ -1,7 +1,22 @@ -import styled from 'styled-components'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faPlayCircle } from '@fortawesome/pro-light-svg-icons'; +import React from 'react'; -export default styled(FaIcon).attrs({ icon: faPlayCircle })` - font-size: ${({ height = 'inherit' }) => height}; -`; +const Svg = (props) => ( + + + +); + +export default Svg; diff --git a/src/icons/Plus.js b/src/icons/Plus.js index 653bbbe09..d957505f5 100644 --- a/src/icons/Plus.js +++ b/src/icons/Plus.js @@ -1,8 +1,20 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faPlus } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FaIcon).attrs({ icon: faPlus })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/Remove.js b/src/icons/Remove.js index 5305e1da2..264cb3bbb 100644 --- a/src/icons/Remove.js +++ b/src/icons/Remove.js @@ -1,10 +1,23 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faTimes } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FaIcon).attrs({ icon: faTimes })` - && { - font-size: ${({ height = 'inherit' }) => height}; - } -`; +export default Svg; diff --git a/src/icons/Reply.js b/src/icons/Reply.js index 7bd1d3521..52171dc13 100644 --- a/src/icons/Reply.js +++ b/src/icons/Reply.js @@ -1,8 +1,23 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faShare } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FaIcon).attrs({ icon: faShare })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/Save.js b/src/icons/Save.js index 58dad76fe..75929d786 100644 --- a/src/icons/Save.js +++ b/src/icons/Save.js @@ -1,8 +1,23 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faSave } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faSave })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/Search.js b/src/icons/Search.js index ed12e6c40..39af65ff6 100644 --- a/src/icons/Search.js +++ b/src/icons/Search.js @@ -1,8 +1,21 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faSearch } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FaIcon).attrs({ icon: faSearch })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/SendMessage.js b/src/icons/SendMessage.js index 6865963c6..f03aeb8b5 100644 --- a/src/icons/SendMessage.js +++ b/src/icons/SendMessage.js @@ -1,8 +1,21 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faArrowCircleUp } from '@fortawesome/pro-solid-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FaIcon).attrs({ icon: faArrowCircleUp })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/Shield.js b/src/icons/Shield.js index a981e09f2..43f1e686f 100644 --- a/src/icons/Shield.js +++ b/src/icons/Shield.js @@ -1,8 +1,21 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon as FaIcon } from '@fortawesome/react-fontawesome'; -import { faShieldAlt } from '@fortawesome/pro-solid-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FaIcon).attrs({ icon: faShieldAlt })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/SolarSystem.js b/src/icons/SolarSystem.js index b7ef67bce..951ef1b86 100644 --- a/src/icons/SolarSystem.js +++ b/src/icons/SolarSystem.js @@ -1,8 +1,16 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faSolarSystem } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faSolarSystem })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/SortDown.js b/src/icons/SortDown.js index 994e24d11..caf6bf442 100644 --- a/src/icons/SortDown.js +++ b/src/icons/SortDown.js @@ -1,8 +1,19 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faSortDown } from '@fortawesome/pro-solid-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faSortDown })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/ThumbsUp.js b/src/icons/ThumbsUp.js index 384e8ca45..a71d8c09d 100644 --- a/src/icons/ThumbsUp.js +++ b/src/icons/ThumbsUp.js @@ -1,8 +1,29 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faThumbsUp } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faThumbsUp })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/Trash.js b/src/icons/Trash.js index 2cff0f574..6a015c7c9 100644 --- a/src/icons/Trash.js +++ b/src/icons/Trash.js @@ -1,8 +1,23 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faTrashAlt } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faTrashAlt })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/UserPlus.js b/src/icons/UserPlus.js index e7deef22e..c17406f4e 100644 --- a/src/icons/UserPlus.js +++ b/src/icons/UserPlus.js @@ -1,8 +1,25 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faUserPlus } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faUserPlus })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/UserRegular.js b/src/icons/UserRegular.js index e136c0a0d..cd63c0942 100644 --- a/src/icons/UserRegular.js +++ b/src/icons/UserRegular.js @@ -1,8 +1,23 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faUser } from '@fortawesome/pro-regular-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faUser })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/Verified.js b/src/icons/Verified.js index fb394c76d..e0c2dcbe1 100644 --- a/src/icons/Verified.js +++ b/src/icons/Verified.js @@ -1,8 +1,26 @@ -import styled from 'styled-components'; +import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faBadgeCheck } from '@fortawesome/pro-solid-svg-icons'; +const Svg = (props) => ( + + + +); -export default styled(FontAwesomeIcon).attrs({ icon: faBadgeCheck })` - font-size: ${({ height = 'inherit' }) => height}; -`; +export default Svg; diff --git a/src/icons/index.js b/src/icons/index.js index 2a9159b1f..279c6a429 100644 --- a/src/icons/index.js +++ b/src/icons/index.js @@ -21,6 +21,7 @@ export { default as CommunityCoverPicture } from './CommunityCoverPicture'; export { default as Minus } from './Minus'; export { default as Poll } from './Poll'; export { default as CircleRemove } from './CircleRemove'; +export { default as Bars } from './Bars'; // files export { default as AudioFile } from './files/Audio';