iOS text overlap on the pdf generated

Hi, We are using the plugin and we have two issues:

Issue 1: On iOS, when we apply the font-weight:bold in css; the PDF is generated and the text is overlapped(zoom the pdf to see). With the same code on Android it works fine.

Please find the attached snippet.js, test.css, test.pdf for issue1. Font family: Lato-Regular.ttf Platform: iOS 12.4 Device: iPhone 6s, 6s plus Version: 2.0.8

Issue 2: In both Android and iOS, the Font family is not being applied when we directly load the fonts and use in the css file after the creation of a PDF. Are there any font restrictions on the plugin?

Could you check the the issues and provide solution?

Please find the pdf for issue 1: https://filebin.net/q1cg3wqof27m9mjn/test.pdf?t=sktnrlv9

var windowWidth = window.screen.availWidth;
            var blockWidthPer = 115; // 80% container width
            var blockWidth = (windowWidth / 100) * blockWidthPer;
            var windowHeight = window.screen.availHeight;
            var blockHeightPer = 100; // 70% container height
            var blockHeight = (windowHeight / 100) * blockHeightPer;
            var options = {
                documentSize: 'A4',
                type: 'base64'
            };

            var data = '<div class="test-normal-cls-pdf">' +
                'Test Normal font' +
                '<div class="test-bold-cls-pdf">' + 'Test Bold font 123456789' + '</div>' +
                '</div>',
                htmlHeader = '<head><base href="www/">',
                loadFontHtml = '<style type="text/css">@font-face {font-family: Lato-Regular; src: url("resources/fonts/Lato-Regular.ttf")} body{font-family:Lato-Regular;}</style>';

            var htmlData = htmlHeader + loadFontHtml +
                '<link rel="stylesheet" href="resources/css/pdfstyles.css">' +
                '</head><body><div style="width: ' + blockWidth + 'px !important;height:' + blockHeight + 'px !important;margin-left: 20% !important;>' + data + '</div></body>';

                pdf.fromData(htmlData, options)
                .then(function (base64) {
                    //code
                });

.test-normal-cls-pdf {
  border-top: 1px solid #fff;
  border-bottom: 1px solid #d7d7d7;
  background: #FFFFFF;
  min-height: 50px;
  font-family: Lato-Regular;
  font-size: 16px;
  color: #7d7d7d;
  padding: 15px 20px;
}

.test-bold-cls-pdf {
  font-family: Lato-Regular;
  font-size: 15px;
  margin: 5px 0px;
  font-weight: bold;
  color: black !important;
  font-weight: bold;
}

Thanks,  Srinivas

cesarvr / pdf-generator

iOS text overlap on the pdf generated #106