added icons

inspector/src/components/actionTabs/actionTabs.scss

@@ -737,6 +737,9 @@ $line-padding-left: 2px;
                             align-items: center;
                             justify-items: center;
                             cursor: pointer;
+                            img {
+                                height: 100%;
+                            }
                         }
 
                         .expand {

inspector/src/components/actionTabs/lines/color3LineComponent.tsx

@@ -5,6 +5,8 @@ import { PropertyChangedEvent } from "../../propertyChangedEvent";
 import { NumericInputComponent } from "./numericInputComponent";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faMinus, faPlus, faCopy } from "@fortawesome/free-solid-svg-icons";
+import CopyIcon from "./copy.svg";
+
 
 export interface IColor3LineComponentProps {
     label: string;
@@ -135,7 +137,7 @@ export class Color3LineComponent extends React.Component<IColor3LineComponentPro
                         <input type="color" value={colorAsColor3.toHexString()} onChange={(evt) => this.onChange(evt.target.value)} />
                     </div>
                     <div className="copy hoverIcon" onClick={() => this.copyToClipboard()} title="Copy to clipboard">
-                        <FontAwesomeIcon icon={faCopy} />
+                        <img src={CopyIcon} alt=""/>
                     </div>
                     <div className="expand hoverIcon" onClick={() => this.switchExpandState()} title="Expand">
                         {chevron}

inspector/src/components/actionTabs/lines/color4LineComponent.tsx

@@ -5,6 +5,7 @@ import { NumericInputComponent } from "./numericInputComponent";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faMinus, faPlus, faCopy } from "@fortawesome/free-solid-svg-icons";
 import { PropertyChangedEvent } from '../../propertyChangedEvent';
+import CopyIcon from "./copy.svg";
 
 export interface IColor4LineComponentProps {
     label: string;
@@ -154,7 +155,7 @@ export class Color4LineComponent extends React.Component<IColor4LineComponentPro
                         <input type="color" value={colorAsColor3.toHexString()} onChange={(evt) => this.onChange(evt.target.value)} />
                     </div>
                     <div className="copy hoverIcon" onClick={() => this.copyToClipboard()} title="Copy to clipboard">
-                        <FontAwesomeIcon icon={faCopy} />
+                        <img src={CopyIcon} alt=""/>
                     </div>
                     <div className="expand hoverIcon" onClick={() => this.switchExpandState()} title="Expand">
                         {chevron}

inspector/src/components/actionTabs/lines/copy.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><defs><style>.cls-1{fill:#fff;}</style></defs><title>copy</title><g id="UI_Elements" data-name="UI Elements"><path class="cls-1" d="M24,14.89H22.76l-3-3H12.43V26.59h4.26v3h11.5V19Zm.3,1.71,2.14,2.13H24.34Zm-10.91,9V12.93h5.93l2,2H16.69v10.7Zm4.26,3V15.89h5.65v3.84h3.85v8.83Z"/></g></svg>

inspector/webpack.config.js

@@ -23,7 +23,19 @@ var config = babylonWebpackConfig({
         {
             test: /\.css$/,
             use: ['style-loader', 'css-loader']
-        }],
+        },
+        {
+            test: /\.svg$/,
+            use: [
+              {
+                loader: 'svg-url-loader',
+                options: {
+                  limit: 10000,
+                },
+              },
+            ],
+          }
+    ],
     plugins: [
         new MiniCssExtractPlugin({
             // Options similar to the same options in webpackOptions.output

nodeEditor/src/components/propertyTab/propertyTab.scss

@@ -524,6 +524,10 @@
                 align-items: center;
                 justify-items: center;
                 cursor: pointer;
+                
+                img {
+                    height: 100%;
+                }
             }
 
             .expand {

nodeEditor/src/sharedComponents/color3LineComponent.tsx

@@ -6,6 +6,7 @@ import { NumericInputComponent } from "./numericInputComponent";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faMinus, faPlus, faCopy } from "@fortawesome/free-solid-svg-icons";
 import { GlobalState } from '../globalState';
+import CopyIcon from "./copy.svg";
 
 export interface IColor3LineComponentProps {
     label: string;
@@ -149,7 +150,7 @@ export class Color3LineComponent extends React.Component<IColor3LineComponentPro
                         <input type="color" value={colorAsColor3.toHexString()} onChange={(evt) => this.onChange(evt.target.value)} />
                     </div>
                     <div className="copy hoverIcon" onClick={() => this.copyToClipboard()} title="Copy to clipboard">
-                        <FontAwesomeIcon icon={faCopy} />
+                        <img src={CopyIcon} alt=""/>
                     </div>
                     <div className="expand hoverIcon" onClick={() => this.switchExpandState()} title="Expand">
                         {chevron}

nodeEditor/src/sharedComponents/color4LineComponent.tsx

@@ -6,6 +6,8 @@ import { NumericInputComponent } from "./numericInputComponent";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faMinus, faPlus, faCopy } from "@fortawesome/free-solid-svg-icons";
 import { GlobalState } from '../globalState';
+import CopyIcon from "./copy.svg";
+
 
 export interface IColor4LineComponentProps {
     label: string;
@@ -160,7 +162,7 @@ export class Color4LineComponent extends React.Component<IColor4LineComponentPro
                         <input type="color" value={colorAsColor3.toHexString()} onChange={(evt) => this.onChange(evt.target.value)} />
                     </div>
                     <div className="copy hoverIcon" onClick={() => this.copyToClipboard()} title="Copy to clipboard">
-                        <FontAwesomeIcon icon={faCopy} />
+                        <img src={CopyIcon} alt=""/>
                     </div>
                     <div className="expand hoverIcon" onClick={() => this.switchExpandState()} title="Expand">
                         {chevron}

nodeEditor/src/sharedComponents/copy.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><defs><style>.cls-1{fill:#fff;}</style></defs><title>copy</title><g id="UI_Elements" data-name="UI Elements"><path class="cls-1" d="M24,14.89H22.76l-3-3H12.43V26.59h4.26v3h11.5V19Zm.3,1.71,2.14,2.13H24.34Zm-10.91,9V12.93h5.93l2,2H16.69v10.7Zm4.26,3V15.89h5.65v3.84h3.85v8.83Z"/></g></svg>