Okta Custom Login Widget loads empty

Questions
1

I am using okta-signin-widget for custom login page and followed instructions found here. The sample application works fine but same code is not working in my application.

okta-signing-widget-issue
okta-signing-widget-issue.JPG752×183 19.6 KB

2

Hi @sgattu6,

Best guess is the Widget’s assets were not included in your project. Can you verify that the stylesheets are referenced correctly?

In the samples-js-angular project, you’ll see them included inside of the styles array in .angular-cli.json:

"styles": [
    "../node_modules/@okta/okta-signin-widget/dist/css/okta-sign-in.min.css",
    "../node_modules/@okta/okta-signin-widget/dist/css/okta-theme.css"
],
3

Yes I have added the css in angular.cli.json, here is the part …

"styles": [
        "styles.css",
        "../node_modules/primeng/resources/themes/omega/theme.css",
        "../node_modules/primeng/resources/primeng.min.css",
        "../node_modules/@okta/okta-signin-widget/dist/css/okta-sign-in.min.css",
        "../node_modules/@okta/okta-signin-widget/dist/css/okta-theme.css"
    ],
4

Did you ever find a solution for this issue?