Icons not displayed in Gluon Desktop - javafx

Question

I'm new to Gluon mobile and desktop. I started a new project and built it successfully for android and desktop. It ran well without a hitch on the android device. However when I ran it on desktop, the Icons did not appear instead I got a rectangle where they should be. Below is the code for the fxml document.
<?import com.gluonhq.charm.glisten.control.Icon?>
<?import com.gluonhq.charm.glisten.mvc.View?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.effect.DropShadow?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.VBox?>
<View fx:id="start" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="600.0" prefWidth="350.0" xmlns="http://javafx.com/javafx/8.0.141" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.id3editor.views.StartPresenter">
<center>
<VBox alignment="CENTER" prefHeight="200.0" prefWidth="100.0" spacing="15.0" BorderPane.alignment="CENTER">
<children>
<Label fx:id="label" text="Hello JavaFX World!" />
<Button mnemonicParsing="false" onAction="#buttonClick" stylesheets="#start.css" text="Change the World!">
<graphic>
<Icon content="LANGUAGE">
<effect>
<DropShadow />
</effect></Icon>
</graphic>
</Button>
</children>
</VBox>
</center>
</View>
And this is what it looks like on my desktop:
Please I really hope this questions can be answered. I checked and made sure there was no question like it. My apologies if this ends up being a duplicate. Thanks.
Here is the build.gradle file
buildscript {
repositories {
jcenter()
}
dependencies {
classpath 'org.javafxports:jfxmobile-plugin:1.3.10'
}
}
apply plugin: 'org.javafxports.jfxmobile'
repositories {
jcenter()
maven {
url 'http://nexus.gluonhq.com/nexus/content/repositories/releases'
}
}
mainClassName = 'com.id3editor.Id3editor'
dependencies {
compile 'com.gluonhq:charm:4.4.1'
compile 'com.airhacks:afterburner.mfx:1.6.3'
}
jfxmobile {
downConfig {
version = '3.6.0'
// Do not edit the line below. Use Gluon Mobile Settings in your project context menu instead
plugins 'display', 'lifecycle', 'statusbar', 'storage'
}
android {
manifest = 'src/android/AndroidManifest.xml'
}
ios {
infoPList = file('src/ios/Default-Info.plist')
forceLinkClasses = [
'com.id3editor.**.*',
'com.gluonhq.**.*',
'javax.annotations.**.*',
'javax.inject.**.*',
'javax.json.**.*',
'org.glassfish.json.**.*'
]
}
}
And I get these warnings when running
Gtk-Message: Failed to load module "unity-gtk-module"
Jan 17, 2018 12:40:13 PM com.gluonhq.charm.down.Platform <clinit>
SEVERE: javafx.platform is not defined. Desktop will be assumed by default.
Jan 17, 2018 12:40:14 PM com.sun.javafx.css.StyleManager loadStylesheetUnPrivileged
INFO: Could not load #font-face font [gls:file:/root/.gradle/caches/modules-2/files-2.1/com.gluonhq/charm-glisten/4.4.1/7bdb2fab385f250b2821c206ea669ff65a1c9ad6/charm-glisten-4.4.1.jar!/com/gluonhq/charm/glisten/control/MaterialIcons-Regular.ttf]
Jan 17, 2018 12:40:14 PM com.sun.javafx.css.StyleManager loadStylesheetUnPrivileged
INFO: Could not load #font-face font [gls:file:/root/.gradle/caches/modules-2/files-2.1/com.gluonhq/charm-glisten/4.4.1/7bdb2fab385f250b2821c206ea669ff65a1c9ad6/charm-glisten-4.4.1.jar!/com/gluonhq/charm/glisten/control/Roboto-Regular.ttf]
Jan 17, 2018 12:40:14 PM com.sun.javafx.css.StyleManager loadStylesheetUnPrivileged
INFO: Could not load #font-face font [gls:file:/root/.gradle/caches/modules-2/files-2.1/com.gluonhq/charm-glisten/4.4.1/7bdb2fab385f250b2821c206ea669ff65a1c9ad6/charm-glisten-4.4.1.jar!/com/gluonhq/charm/glisten/control/Roboto-Bold.ttf]
Jan 17, 2018 12:40:15 PM com.sun.javafx.css.StyleManager loadStylesheetUnPrivileged
INFO: Could not load #font-face font [gls:file:/root/.gradle/caches/modules-2/files-2.1/com.gluonhq/charm-glisten/4.4.1/7bdb2fab385f250b2821c206ea669ff65a1c9ad6/charm-glisten-4.4.1.jar!/com/gluonhq/charm/glisten/control/Roboto-Medium.ttf]
I am building and running with a 32-bit Linux.