Branding of Universal Login

Get Help
5

Hi @lihua.zhang,

Thanks for your response! Here’s the custom template we’re using:

<html>
  <head>
    <link
      rel="shortcut icon"
      href="https://.../favicon.ico"
    />
    {%- auth0:head -%}
    <title>Log in</title>
    <style>
      @font-face {
        ...
      }
      body {
        font-family: 'IBM Plex Sans', sans-serif;
        box-sizing: border-box;
      }
      .footer {
        background-color: rgb(120, 120, 120);
        position: absolute;
        bottom: 0;
        left: 0;
        padding: 16px 0;
        width: 100%;
        color: white;
        /* Use a high z-index for future-proofing */
        z-index: 10;
      }
      .footer ul {
        text-align: center;
      }
      .footer ul li {
        display: inline-block;
        margin: 0 4px;
      }
      .footer ul li:not(:first-of-type) {
        margin-left: 0;
      }
      .footer ul li:not(:first-of-type)::before {
        content: '';
        display: inline-block;
        vertical-align: middle;
        width: 4px;
        height: 4px;
        margin-right: 4px;
        background-color: white;
        border-radius: 50%;
      }
      .footer a {
        color: white;
      }
    </style>
  </head>
  <body class="_widget-auto-layout">
    {%- auth0:widget -%}
    <footer class="footer">
      <ul>
        <li><a href="...">Privacy Policy</a></li>
        <li>
          <a href="...">Terms of Service</a>
        </li>
        <li><a href="...">Signup</a></li>
      </ul>
    </footer>
  </body>
</html>

It’s basically just a custom Font and an additional footer. The CLI preview looks correct, but using the regular Login Page is not behaving like the preview (at least for us).

Any idea what could be wrong?

Adam