From 61593fad039b35a68b299e80c1f112aace86ee35 Mon Sep 17 00:00:00 2001
From: Brian Peiris <brianpeiris@gmail.com>
Date: Thu, 29 Mar 2018 17:40:11 -0700
Subject: [PATCH] replace material icons with fontawesome
---
package.json | 3 +++
src/assets/stylesheets/avatar-selector.scss | 10 ++++----
src/react-components/avatar-selector.js | 7 ++++--
yarn.lock | 26 +++++++++++++++++++++
4 files changed, 38 insertions(+), 8 deletions(-)
diff --git a/package.json b/package.json
index a86b58dbe..123aaec21 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,9 @@
"prettier": "prettier --write src/**/*.js"
},
"dependencies": {
+ "@fortawesome/fontawesome": "^1.1.5",
+ "@fortawesome/fontawesome-free-solid": "^5.0.9",
+ "@fortawesome/react-fontawesome": "^0.0.18",
"aframe-billboard-component": "^1.0.0",
"aframe-extras": "^3.12.4",
"aframe-input-mapping-component": "https://github.com/johnshaughnessy/aframe-input-mapping-component#feature/map-to-array",
diff --git a/src/assets/stylesheets/avatar-selector.scss b/src/assets/stylesheets/avatar-selector.scss
index 573ff7386..1663ec5b6 100644
--- a/src/assets/stylesheets/avatar-selector.scss
+++ b/src/assets/stylesheets/avatar-selector.scss
@@ -19,22 +19,20 @@
&__previous-button, &__next-button {
position: absolute;
top: 50%;
- margin-top: -4em;
+ margin-top: -0.5em;
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
background: transparent;
color: white;
border: none;
+ font-size: 64pt;
}
&__previous-button {
- left: -2em;
+ left: 0.2em;
}
&__next-button {
- right: -2em;
- }
- &__button-icon {
- font-size: 84pt;
+ right: 0.2em;
}
&__loading {
@extend %default-font;
diff --git a/src/react-components/avatar-selector.js b/src/react-components/avatar-selector.js
index 5d49ad3a8..b6f17c66e 100644
--- a/src/react-components/avatar-selector.js
+++ b/src/react-components/avatar-selector.js
@@ -1,6 +1,9 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { injectIntl, FormattedMessage } from 'react-intl';
+import FontAwesomeIcon from '@fortawesome/react-fontawesome';
+import faAngleLeft from '@fortawesome/fontawesome-free-solid/faAngleLeft';
+import faAngleRight from '@fortawesome/fontawesome-free-solid/faAngleRight';
class AvatarSelector extends Component {
static propTypes = {
@@ -108,10 +111,10 @@ class AvatarSelector extends Component {
></a-gltf-entity>
</a-scene>
<button className="avatar-selector__previous-button" onClick={this.emitChangeToPrevious}>
- <i className="avatar-selector__button-icon material-icons">keyboard_arrow_left</i>
+ <FontAwesomeIcon icon={faAngleLeft} />
</button>
<button className="avatar-selector__next-button" onClick={this.emitChangeToNext}>
- <i className="avatar-selector__button-icon material-icons">keyboard_arrow_right</i>
+ <FontAwesomeIcon icon={faAngleRight} />
</button>
</div>
);
diff --git a/yarn.lock b/yarn.lock
index b2fc3a25d..71b37b2f5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -71,6 +71,28 @@
lodash "^4.2.0"
to-fast-properties "^2.0.0"
+"@fortawesome/fontawesome-common-types@^0.1.3":
+ version "0.1.3"
+ resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.1.3.tgz#8475e0f2d1ad1f858c4ec2e76ed9a2456a09ad83"
+
+"@fortawesome/fontawesome-free-solid@^5.0.9":
+ version "5.0.9"
+ resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free-solid/-/fontawesome-free-solid-5.0.9.tgz#456155a1cd82a0342ffe6a869d5a54fdadd78548"
+ dependencies:
+ "@fortawesome/fontawesome-common-types" "^0.1.3"
+
+"@fortawesome/fontawesome@^1.1.5":
+ version "1.1.5"
+ resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome/-/fontawesome-1.1.5.tgz#c7cfafdd3364245626293cc670357f9fb8487170"
+ dependencies:
+ "@fortawesome/fontawesome-common-types" "^0.1.3"
+
+"@fortawesome/react-fontawesome@^0.0.18":
+ version "0.0.18"
+ resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.0.18.tgz#4e0eb1cf9797715a67bb7705ae084fa0a410f185"
+ dependencies:
+ humps "^2.0.1"
+
JSONStream@^1.0.3:
version "1.3.2"
resolved "https://registry.yarnpkg.com/JSONStream/-/JSONStream-1.3.2.tgz#c102371b6ec3a7cf3b847ca00c20bb0fce4c6dea"
@@ -3911,6 +3933,10 @@ https-browserify@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-1.0.0.tgz#ec06c10e0a34c0f2faf199f7fd7fc78fffd03c73"
+humps@^2.0.1:
+ version "2.0.1"
+ resolved "https://registry.yarnpkg.com/humps/-/humps-2.0.1.tgz#dd02ea6081bd0568dc5d073184463957ba9ef9aa"
+
iconv-lite@0.4.19, iconv-lite@^0.4.17, iconv-lite@~0.4.13:
version "0.4.19"
resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.19.tgz#f7468f60135f5e5dad3399c0a81be9a1603a082b"
--
GitLab