Custom font in ionic not working in device

Ionic Framework ionic-v3
1

Hi,
I need to use a particular font family for my project.I did like this:

In variable.scss:

  @font-face {
        font-family: 'DroidSerif';
        src: url('../assets/fonts/DroidSerif.ttf') format('ttf'), url('../assets/fonts/DroidSerif.eot') format('eot');
        font-weight: 800;
       font-style: regular;
   }

   $font-family-base: "DroidSerif" , san-serif !default;

  *{
     font-family: "DroidSerif" !important;
  }

When I run it in android,no changes in font is observed. The font is not changed when the application is run in device but works in ionic serve.

cli packages:

@ionic/cli-utils  : 1.13.0
ionic (Ionic CLI) : 3.13.0

global packages:

cordova (Cordova CLI) : 7.1.0

local packages:

@ionic/app-scripts : 3.0.0
Cordova Platforms  : android 6.3.0 ios 4.5.3
Ionic Framework    : ionic-angular 3.7.1

Any suggestion is appreciable.
Thanks.

2

To be more efficient on devices try to replace…

$font-family-base: "DroidSerif" , san-serif !default;

with…

$font-family-ios-base: "DroidSerif";
$font-family-md-base:"DroidSerif";
$font-family-wp-base:"DroidSerif";

Keep me informed.

3

Got it working by adding all the font formats, ie,svg,woff2,woff, along with the above used.
Thanks.