I use auth0 in combination with the Lock widget to create a login page with a simple username/password authentication page. The page is built in NodeJS, running on a Ubuntu server on port 3000. Everything works fine.
I want to customize the login page with some extra options, for example using my own logo, instead of the auth0 logo provided in the widget. However, when running this Node JS application, nothing changes...
My views/index.pug file looks as follows:
extends layout
block content
script(src="https://cdn.auth0.com/js/lock/10.7.2/lock.min.js")
h1= title
p Welcome to #{title}
br
script.
var lock = new Auth0Lock('#{env.AUTH0_CLIENT_ID}', '#{env.AUTH0_DOMAIN}', {
auth: {
redirectUrl: '#{env.AUTH0_CALLBACK_URL}',
responseType: 'code',
params: {
scope: 'openid profile' // Learn about scopes: https://auth0.com/docs/scopes
},
closable: false,
autofocus: true
},
theme: {
logo: 'http://www.example.com/content/logo.png'
}
});
lock.show();
Where stuff like #{env.AUTH0_CLIENT_ID}
is coming from a local file.
All files are also available in this Github repo.
You need to edit the views/login.pug file, rather than the views/index.pug file.