Este tópico descreve como modificar elementos da página de login do console administrativo.

Logotipo da página de login

Para modificar o logotipo, edite o arquivo stylesForCustomBranding.css em ambos os dispositivos de tenant na organização:
$> /usr/local/desktone/release/dt-platform-20_2_0/deploy/dt-tenant-node-20.2.0-bin/horizonadmin/static/css/production/ stylesForCustomBranding.css 
Edite a seção adequada do código para que ele fique semelhante ao exemplo a seguir.
  • Exclua o comentário /*! Remove this when the logo is required. */.
  • Descomente as outras linhas comentadas.
  • Altere a URL para o arquivo de imagem.
/*! App Logo with text */
.login-wrapper .login .brand-logo {
      display: none;
      /*! Remove this when the logo is required. */
      background: url('../../static/images//EUC_HorizonLogin_bg.png') no-repeat;     
      width: 100px;
      height: 100px;
      margin: 0 auto 1rem auto;  }

As imagens a seguir mostram um exemplo da aparência da página após o código ter sido editado, como mostrado acima.

ANTES DEPOIS

Plano de fundo da página de login

Para modificar o plano de fundo, edite o arquivo stylesForCustomBranding.css em ambos os dispositivos de tenant na organização:
$> /usr/local/desktone/release/dt-platform-20_2_0/deploy/dt-tenant-node-20.2.0-bin/horizonadmin/static/css/production/ stylesForCustomBranding.css 
Edite a seção apropriada do código para que seja semelhante ao exemplo a seguir, descomentando o texto comentado e alterando a URL para o arquivo de imagem.
/*! Login Page Background changes */
.login-wrapper {
   background: url('../../images/FBG.jpg') no-repeat; };
}

As imagens a seguir mostram um exemplo da aparência da página após o código ter sido editado, como mostrado acima.

ANTES DEPOIS

Botão Login

Para modificar o botão, edite o arquivo stylesForCustomBranding.css em ambos os dispositivos de tenant na organização:
$> /usr/local/desktone/release/dt-platform-20_2_0/deploy/dt-tenant-node-20.2.0-bin/horizonadmin/static/css/production/ stylesForCustomBranding.css 
Edite a seção apropriada do código para que seja semelhante ao exemplo a seguir, descomentando as duas linhas de código comentado e alterando as cores para border-color e background-color.
/*! login button */
.login-wrapper .login .login-group .btn {
       border-color: #00b315;
       background-color: #ff5733;

As imagens a seguir mostram um exemplo da aparência da página após o código ter sido editado, como mostrado acima.

ANTES DEPOIS