Créer et personnaliser une page de connexion

Dans cette section :

En trois étapes, vous pouvez créer et personnaliser une page de connexion en fonctions des besoins spécifiques à votre société ou organisation. Ces trois étapes sont :

  1. Concevoir et activer une nouvelle page de connexion personnalisée
  2. Renseigner les étiquettes texte
  3. Modifier le fichier CSS pour positionner et mettre en forme les éléments de la page

Ces étapes sont détaillées au centre support technique. Pour plus d'informations sur la création d'une page de connexion personnalisée, consultez https://techsupport.informationbuilders.com

Haut de page
x
Concevoir et activer une nouvelle page de connexion personnalisée

Comment :

La page de connexion personnalisée, comme le montre l'image suivante, est constituée d'une image d'arrière-plan contenant une zone de saisie des informations de connexion.

L'image d'arrière-plan est centrée sur une classe div, fournissant de l'espace autour de l'image. Pour concevoir votre page, consultez Concevoir la Page.
x
Comment : Concevoir la Page
  1. Décidez si vous souhaitez utiliser une image d'arrière-plan, une couleur (unie ou en gradient), ou les deux.
  2. Créez une maquette avec un logiciel d'édition d'image acceptant des fichiers PNG multicalque ou PSD, tel que Adobe® Fireworks® ou Adobe® Photoshop®, respectivement. Le logiciel Open Source GIMP peut être utilisé pour modifier le fichier .psd.
    1. Ouvrez l'image multicalque par défaut fournie.
    2. Remplacez l'image d'arrière-plan dans le calque Arrière-plan personnalisé avec votre image ou des couleurs.
    3. Renseignez la transparence alpha avec le pourcentage souhaité.

      Remarque : toutes les images ne vont pas obligatoirement nécessiter une transparence alpha. En général, la valeur se situe dans la plage 50-75%.

    4. Si nécessaire, redimensionnez la zone de dessin pour ajuster avec l'image.
    5. Personnalisez le formulaire, tel que décrit dans Personnaliser le formulaire.
    6. Exportez votre image en tant que .gif ou .png pour préserver la transparence.
    7. Placez votre image dans \ibi\WebFOCUS81\config\web_resource\signin\images.
x
Comment : Personnaliser le formulaire
  1. Pour l'arrière-plan du formulaire :
    1. Changez la couleur d'arrière-plan de l'objet Arrière-plan de zone formulaire dans le calque Formulaire pour l'adapter à votre schéma.
    2. Positionnez l'arrière-plan du formulaire comme vous le souhaitez. Vous aurez peut-être à redimensionner cette boîte, en fonction du texte saisi à l'étape suivante.
  2. Pour les éléments du formulaire :
    1. Déterminez si la fonctionnalité Mémoriser est utilisée dans votre installation. Si oui, activez l'élément Mémoriser dans le calque Formulaire.
    2. Modifiez le texte comme vous le souhaitez dans le calque Formulaire.
    3. Mettez en forme et positionnez les divers éléments dans le calque Formulaire.
  3. Pour le message d'erreur :
    1. Activez le sous-calque message d'erreur.
    2. Mettez en forme et positionnez l'arrière plan et le texte du message d'erreur.
  4. Désactivez le calque Formulaire, ces éléments seront générés à l'exécution.
x
Comment : Activer la nouvelle page de Connexion personnalisée

La dernière étape consiste à activer nouvelle page créée. Suivez les étapes suivantes pour effectuer cette tâche.

  1. Connectez-vous à WebFOCUS avec un compte administrateur.
  2. Démarrez la Console d'administration WebFOCUS.
  3. Cliquez sur Configuration, puis sur Paramètres d'application.
  4. Cliquez sur Sécurité.
  5. Mettez IBI_Customized_Signin_Page sur true, comme le montre l'image suivante.

  6. Cliquez sur Enregistrer.
  7. Déconnectez-vous de WebFOCUS.
Haut de page
x
Renseigner les étiquettes texte

Comment :

WebFOCUS vous fournit des fonctionnalités pernmettant de changer le texte de toutes les étiquettes de la page Connexion. Vous avez aussi la possibilité d'inclure jusqu'à deux liens personnalisés dans la barre de menu.
x
Comment : Renseigner Texte et Liens
  1. Allez à \ibi\WebFOCUS81\config\web_resource\signing\.
  2. Dans un éditeur de texte, tel que Notepad++, éditez le fichier customsignin.xml.
  3. Changez le texte dans les éléments souhaités.

    Les tables suivantes vous fournissent l'élément, le nom de la balise XML, et la valeur par défaut (modifiable) de cet élément. La valeur que vous entrez n'inclut pas le wrapper XML CDATA.

    Remarque : si vous ne voyez pas vos changements appliqués dans cette section ou la section CSS, videz le cache de votre navigateur.

    Eléments Page principale

    Balise XML

    Valeur par défaut

    Titre de la page

    <signin_custom_page_title>

    Connexion Portail BI

    Elément Menu 1 Texte

    <signin_menu_button1>

    menu1

    Elément Menu 1 Lien

    <signin_menu_button1_link>

    http://www.informationbuilders.com/

    Elément Menu 2 Texte

    <signin_menu_button2>

    menu2

    Elément Menu 2 Lien

    <signin_menu_button2_link>

    http://www.informationbuilders.com/

    Titre Cadre (Zone Formulaire)

    <signin_custom_frame_title>

    Connectez-vous au Portail BI

    Etiquette Nom d'utilisateur

    <signin_user_name_label>

    Nom d'utilisateur:

    Etiquette Mot de passe

    <signin_password_label>

    Mot de passe:

    Texte Bouton Connexion

    <signin_button>

    Connectez-vous

    Option Mémoriser

    <remember_me_checkbox>

    Mémoriser sur cet ordinateur

    Eléments Dialogue Changer Mot de passe

    Balise XML

    Valeur par défaut

    Texte du titre

    <signin_custom_change_password_frame_title>

    Modifier le mot de passe

    Etiquette Nom d'utilisateur

    <signin_change_password_user_name_label>

    Nom d'utilisateur

    Etiquette Ancien mot de passe

    <signin_change_password_old_password_label>

    Ancien mot de passe

    Etiquette Nouveau mot de passe

    <signin_change_password_new_password_label>

    Nouveau mot de passe

    Etiquette Confirmer Mot de passe

    <signin_change_password_confirm_password_label>

    Confirmer le mot de passe

    Texte Bouton Connexion

    <signin_change_password_sigin_button>

    Connectez-vous

    Texte Bouton Annuler

    <signin_change_password_cancel_button>

    Annuler

    Eléments du dialogue Déjà connecté

    Balise XML

    Valeur par défaut

    Texte du titre

    <signin_custom_user-already-signin_frame_title>

    L'utilisateur est déjà connecté

    Message

    <signin_custom_user-already-signin_message>

    Une session active existe déjà pour cet utilisateur. Souhaitez-vous terminer l'autre session et effectuer une nouvelle connexion ?
x
Modifier le fichier CSS pour positionner et mettre en forme les éléments de la page

Comment :

Vous bénéficiez d'une grande flexibilité quand vous disposez les éléments de la page Connexion personnalisée. Le style et le positionnement sont effectués exclusivement via CSS.
x
Comment : Modifier le CSS
  1. Browse to \ibi\WebFOCUS81\config\web_resource\signin\
  2. Dans un éditeur de texte, tel que Notepad++, éditez le fichier customsignin.css.
  3. Modifier les éléments souhaités.

    Remarque :

    • Pour tester à tout moment, enregistrez et allez à 
      http://server:port/ibi_apps/
    • Assurez-vous que le zoom de votre navigateur est à 100%.
    • Les infornations de style et positionnement de tous les éléments peuvent être obtenus par sélection des éléments correspondants dans votre logiciel d'édition d'image. Il se peut que vous ayez à ajuster le positionnement.
    • Les URLs Image sont relatives au répertoire contenant le fichier CSS (\ibi\WebFOCUS81\config\web_resource\signin\). L'URL de ce répertoire est 
      http://server:port/ibi_apps/web_resource/signin.

    Le tableau suivant fournit les éléments que vous pouvez modifier, le nom de classe CSS, et des suggestions de modification des attributs.

    Eléments Page principale

    Classe CSS ou Balise HTML

    Modifications conseillées

    Couleur d'arrière-plan de la page

    body, html

    Soit Gradient soit Uni

    • Gradient
      • Remplacez toutes les instances de #064e96 avec votre couleur de début.
      • Remplacez toutes les instances de # ff7200 avec votre couleur de fin.
    • Solide
      • Supprimez les huit lignes de code du dessous dans body, html class, qui affiche :

      • background: -webkit-gradient(linear, 0 0, 0 100%, from(#064e96) to(#ff7200)); /*old webkit*/ background: -webkit-linear-gradient(#064e96, #ff7200); /*new webkit*/background: -moz-linear-gradient(#064e96, #ff7200); /*gecko*/

    Couleur d'arrière-plan de la page (poursuivre)

    body, html (poursuivre)

    • Solid (poursuivre)

      • background: -ms-linear-gradient(#064e96, #ff7200); /*IE10*/background: -o-linear-gradient(#064e96, #ff7200); /*opera 11.10+*/ background: linear-gradient(#064e96, #ff7200); /*future CSS3 browsers*/ -pie-background: linear-gradient(#064e96, #ff7200);behavior: url(web_resource/signin/PIE.htc);

      • Changer d'image

    Image d'arrière-plan Connexion

    .signin-background-image

    • Changer l'image
    • Renseignez la largeur sur la largeur de l'image
    • Renseigner la hauteur sur la hauteur de l'image

    .signin-box
    • Renseignez la largeur sur la largeur de l'image
    • Renseigner la hauteur sur la hauteur de l'image

    Remarque : Top et left peuvent servir pour placer l'image au centre relativement, ainsi que les autres contrôles, si nécessaire.

    Position Barre de menu

    .signin-custom-menu-bar-position
    • Renseigner top
    • Renseigner left

    Mise en forme Barre de menu

    .signin-custom-menu-bar
    • Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.

    Mise en forme Séparateur Barre de menu

    .signin-menu-bar-separator
    • Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.
    • Pour masquer le séparateur, mettez color sur transparent.

    Position Titre Cadre

    .signin-custom-frame-title
    • Renseigner top
    • Renseigner left

    Mise en forme Titre Cadre

    .signin-custom-frame-label
    • Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.

    Position Etiquette Nom d'utilisateur

    .signin-custom-username-label-position
    • Renseigner top
    • Renseigner left

    Mise en forme Etiquette Nom d'utilisateur

    .signin-custom-username-label
    • Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.

    Position Contrôle Saisie Nom d'utilisateur

    .signin-custom-username-editbox
    • Renseigner top
    • Renseigner left

    Mise en forme Contrôle Saisie Nom d'utilisateur

    .signin-custom-username-editbox-input
    • Ceci contrôle le style, vous devriez appliquez les couleurs d'arrière-plan ici.

    Position Etiquette Mot de passe

    .signin-custom-password-label-position
    • Renseigner top
    • Renseigner left

    Mise en forme Etiquette Mot de passe

    .signin-custom-password-label
    • Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.

    Position Contrôle Saisie Mot de passe

    .signin-custom-password-editbox
    • Renseigner top
    • Renseigner left

    Mise en forme Contrôle Saisie Mot de passe

    .signin-custom-password-editbox-input
    • Ceci contrôle le style, vous devriez appliquez les couleurs d'arrière-plan ici.

    Position Option Mémoriser

    .signin-custom-remember-me-position
    • Renseigner top
    • Renseigner left

    Mise en forme Option Mémoriser

    signin-custom-remember-me

    Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.

    Mise en forme Etiquette Bouton Connexion

    .signin-button-label

    Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.

    Position Bouton Connexion

    .signin-custom-button-signin-position
    • Renseigner top
    • Renseigner left

    Mise en forme Bouton Connexion

    .signin-custom-button-signin
    • Renseigner le rayon de la bordure, la taille, et la couleur
    • Renseigner la police

    .signin-button, .button

    		 

    Remarque : si vous avez besoin de redimensionner un objet, utilisez la même classe que celle pour la position.

    Eléments Message d'erreur

    Classe CSS ou Balise HTML

    Modifications conseillées

    Position Message d'erreur

    .signin-custom-error-position
    • Renseigner top
    • Renseigner left

    Mise en forme Message d'erreur

    .signin-custom-error-message
    • Renseignez le style de votre choix, par exemple le rayon de la bordure, la taille, la couleur, etc.

    Image Message d'erreur

    .signin-custom-error-image
    • Renseigner l'image
    • Retirez les commentaires autour de :visibility: hidden; line pour masquer l'image, mais gardez l'espace qu'il prend. Utilisez display: none; pour retirer l'image, y compris l'espace qu'il prend.

    La mise en forme des éléments dans les deux tables suivantes est héritée de celle des éléments de la page principale. Ceci implique que les boutons, les étiquettes, et les contrôles correspondent à la page principale.

    Eléments Dialogue Changer Mot de passe

    Classe CSS ou Balise HTML

    Modifications conseillées

    Mise en forme et position Dialogue

    .signin-custom-change-password-position
    • Renseigner top
    • Renseigner left
    • Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.

    Barre Titre Dialogue

    .signin-custom-change-password-title-position
    • Définir la couleur d'arrière-plan

    Etiquette Titre Dialogue

    .signin-custom-change-password-title-label

    Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.

    Icône Titre Dialogue

    .signin-custom-change-password-title-image

    Renseignez l'image.

    Position Etiquette Nom d'utilisateur

    .signin-custom-change-password_username-label-position
    • Renseigner top
    • Renseigner left

    Position Contrôle Saisie Nom d'utilisateur

    .signin-custom-change-password_username-editbox-position
    • Renseigner top
    • Renseigner left

    Position Etiquette Ancien mot de passe

    .signin-custom-change-password_old-password-label-position
    • Renseigner top
    • Renseigner left

    Position Contrôle Saisie Ancien mot de passe

    .signin-custom-change-password_old-password-editbox-position
    • Renseigner top
    • Renseigner left

    Position Etiquette Nouveau mot de passe

    .signin-custom-change-password_new-password-label-position
    • Renseigner top
    • Renseigner left

    Position Contrôle Saisie Nouveau mot de passe

    .signin-custom-change-password_new-password-editbox-position
    • Renseigner top
    • Renseigner left

    Position Etiquette Confirmer Nouveau mot de passe

    .signin-custom-change-password_confirm-password-label-position
    • Renseigner top
    • Renseigner left

    Position Contrôle Saisie Confirmer Nouveau mot de passe

    .signin-custom-change-password_confirm-password-editbox-position
    • Renseigner top
    • Renseigner left

    Position Contrôle Saisie Confirmer Nouveau mot de passe

    .signin-custom-change-password_confirm-password-editbox-position
    • Renseigner top
    • Renseigner left

    Position Bouton Connexion

    .signin-custom-change-password-button-signin-position
    • Renseigner top
    • Renseigner left

    Position Bouton Annuler

    .signin-custom-change-password-button-cancel-position
    • Renseigner top
    • Renseigner left

    Eléments du dialogue Utilisateur déjà connecté

    Classe CSS ou Balise HTML

    Modifications conseillées

    Mise en forme et position Dialogue

    .signin-custom-user-already-signin-position
    • Renseigner top
    • Renseigner left
    • Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.

    Etiquette Titre Dialogue

    .signin-custom-user-already-signin-label-position
    • Renseignez le style de votre choix, par exemple famille de police, taille, couleur, etc.
    • Vous pouvez l'ajuster à gauche si vous n'utilisez pas d'icône.

    Icône Titre Dialogue

    .signin-custom-user-already-signin-title-image
    • Renseigner l'image
    • Supprimez la ligne visibility: hidden; pour afficher l'image.

    Position Bouton Connexion

    .signin-custom-user-already-signin-button-signin-position
    • Renseigner top
    • Renseigner left

    Position Bouton Annuler

    .signin-custom-user-already-signin-button-cancel-position
    • Renseigner top
    • Renseigner left
x
Comment : Renseigner les étiquettes texte

Les instructions pour implémenter une page de connexion personnalisée sont décrites pas à pas ci-dessous, avec l'image par défaut. Nous supposons que les étapes de conception et d'activation sont complétées.

  1. Browse to \ibi\WebFOCUS81\config\web_resource\signin\.
  2. Dans un éditeur de texte, tel que Notepad++, éditez le fichier customsignin.xml.
  3. Changez le texte dans les éléments suivants.

    Remarque : le tableau suivant ne montre que les éléments qui ont changé dans l'exemple. Entrez la valeur affichée dans la colonne Valeur Exemple dans le fichier XML.

    Eléments Page principale

    Balise XML

    Valeur Exemple

    Titre de la page

    <signin_custom_page_title>

    Connexion Information Builders

    Elément Menu 1 Texte

    <signin_menu_button1>

    Sommet 2013

    Elément Menu 1 Lien

    <signin_menu_button1_link>

    http://www.informationbuilders.com/summit

    Elément Menu 2 Texte

    <signin_menu_button2>

    IBI

    Titre Cadre (Zone Formulaire)

    <signin_custom_frame_title>

    Connexion Information Builders

    Etiquette Nom d'utilisateur

    <signin_user_name_label>

    Nom du client

    Etiquette Mot de passe

    <signin_password_label>

    Mot de passe

    Option Mémoriser

    <remember_me_checkbox>

    Mémoriser mes informations

    Remarque : l'option Mémoriser n'est pas activée par défaut, mais elle est renseignée dans les fichiers d'exemple dans le cas où vous l'activez.

    Eléments Dialogue Changer

    Balise XML

    Valeur Exemple

    Etiquette Nom d'utilisateur

    <signin_change_password_user_name_label>

    Nom du client:
  4. Démarrer WebFOCUS dans un navigateur. L'image suivante apparaît:

x
Comment : Modifier le fichier CSS
  1. Browse to \ibi\WebFOCUS81\config\web_resource\signin\.
  2. Dans un éditeur de texte, tel que Notepad++, éditez le fichier customsignin.css.
  3. Modifiez les éléments souhaités.

    Remarque :

    • Pour tester à tout moment, enregistrez et allez à 
      http://server:port/ibi_apps/
    • Assurez-vous que le zoom de votre navigateur est à 100%.
    • Les infornations de style et positionnement de tous les éléments peuvent être obtenus par sélection des éléments correspondants dans votre logiciel d'édition d'image. Il se peut que vous ayez à ajuster le positionnement.
    • Les URLs Image sont relatives au répertoire contenant le fichier CSS (\ibi\WebFOCUS80\config\web_resource\signin\). L'URL de ce répertoire est 
      http://server:port/ibi_apps/web_resource/signin.

    Les tableaux suivants contiennent les modifications à appliquer pour mettre en forme la page Connexion et deux fenêtres de dialogue. Une capture d'écran est affichée devant chaque tableau pour vous montrez ce que vous verrez après avoir appliqué ces modifications.

    Eléments Page principale

    Classe CSS ou Balise HTML

    Valeurs à ajouter, modifier, ou supprimer

    Couleur d'arrière-plan de la page

    body, html

    background: #000000;

    Supprimez toutes les lignes de gradient.

    Image d'arrière-plan Connexion

    .signin-background-image

    background-image: url("images/customsignin.gif");

    width: 960px;

    height: 638px;

    .signin-box

    width: 960px;

    height: 638px;

    Position Barre de menu

    .signin-custom-menu-bar-position

    top: 220px;

    left: 475px;

    Mise en forme Barre de menu

    .signin-custom-menu-bar

    color: #ffffff;

    font: 11px Tahoma, Verdana, Arial, Sans-Serif;

    Mise en forme Séparateur Barre de menu

    .signin-menu-bar-separator

    color: #ffffff;

    Cette classe se trouve à la fin du fichier CSS.

    Position Titre Cadre

    .signin-custom-frame-title

    top: 245px;

    left: 370px;

    Mise en forme Titre Cadre

    .signin-custom-frame-label

    color: #ffffff;

    Position Etiquette Nom d'utilisateur

    .signin-custom-username-label-position

    text-align: left;

    top: 275px;

    left: 370px;

    User Name

    .signin-custom-

    color: #ffffff;

    Position Contrôle Saisie Nom d'utilisateur

    .signin-custom-username-editbox

    width: 221px;

    top: 295px;

    left: 370px;

    Remarque : pour afficher correctement tous les bords, cette largeur doit être au moins 5px.

    Mise en forme Contrôle Saisie Nom d'utilisateur

    .signin-custom-username-editbox-input

    width: 216px;

    Position Etiquette Mot de passe

    .signin-custom-password-label-position

    text-align: left;

    top: 330px;

    left: 370px;

    Password Label Styling

    .signin-custom-password-label

    color: #ffffff;

    Delete font-size:12px;

    Position Contrôle Saisie Mot de passe

    .signin-custom-password-editbox

    width: 221px;

    top: 350px;

    left: 370px;

    Remarque : Width fait 5px de plus que celle du contrôle d'affichage de tous les bords.

    Mise en forme Contrôle Saisie Mot de passe

    .signin-custom-password-editbox-input

    width: 216px;

    Position Option Mémoriser

    .signin-custom-remember-me-position

    width: 216px;

    top: 388px;

    left: 490px;

    Remarque : Top fait 2px de moins que la valeur dans l'ouvrage, à cause de l'affichage par HTML. Width et gauche correspondent aux contrôles d'entrée, avec aligement texte à droite (right) pour aligner le bord de droite.

    Mise en forme Option Mémoriser

    signin-custom-remember-me

    color: #ffffff;

    font-size:12px;

    Position Bouton Connexion

    .signin-custom-button-signin-position

    color: #ffffff;

    Mise en forme Bouton Connexion

    .signin-custom-button-signin

    color: #ffffff;

    border: 1px solid #223AA7;

    border-radius: 10px;

    Mise en forme Bouton Connexion

    a.signin-custom-button-signin

    background-color: #223AA7;

    width: 96px;

    Supprimez la ligne d'arrière-plan (background).

    Supprimez la ligne remplissage à droite (padding-right).

    a.signin-custom-button-signin span

    padding: 3px 0px 3px 0px;

    Supprimez la ligne hauteur de ligne (line-height).

x
Message d'erreur

The following image and table provide information on resolving error messages.

Eléments Message d'erreur

Classe CSS ou Balise HTML

Modifications conseillées

Position & Mise en forme Arrière-plan Message d'erreur

.signin-custom-error-position

width: 340px;

height: 27px;

top: 240px;

left: 310px;

background-color: #ff0000;

border: 1px solid #ff0000;

border-radius: 10px;

behavior: url(web_resource/signin/PIE.htc);

Position & Mise en forme Texte Message d'erreur

.signin-custom-error-message

color: #ffffff;

font-size: 11px;

top: 5px;

width: 340px;

text-align: center;

Delete left: 20;

Remarque : top représente la distance entre le haut de la boîte et le haut du texte dans logiciel d'édition d'image. Ici, Width doit obligatoirement correspondre à la largeur de la classe au-dessus.

Image Message d'erreur

.signin-custom-error-image

display: none;

Remarque : ceci a été effectué pour ne pas avoir d'image.

Remarque : si vous avez besoin de redimensionner un objet, utilisez la même classe que celle pour la position.
x
Fenêtre de dialogue Changer le mot de passe

La mise en forme de la fenêtre de dialogue Modifier le mot de passe et celle de la fenêtre de dialogue Déjà connecté sont héritées des éléments de la page principale. Ceci implique que les boutons, les étiquettes, et les contrôles correspondent à la page principale.

Le tableau et l'image suivants fournissent les informations pour changer les mots de passe.

Eléments Dialogue Changer Mot de passe

Classe CSS ou Balise HTML

Modifications conseillées

Mise en forme et position Dialogue

.signin-custom-change-password-position

top: 220px;

left: 353px;

background-color: #565352;

color: #ffffff;

border: 1px solid transparent;

border-radius:25px;

-webkit-box-shadow: 7px 7px 9px rgba(255, 255, 255, 0.75);

-moz-box-shadow: 7px 7px 9px rgba(255, 255, 255, 0.75);

box-shadow: 7px 7px 9px rgba(255, 255, 255, 0.75);

behavior: url(web_resource/signin/PIE.htc);

Remarque : la ligne visibility: hidden; devra soit être supprimée, soit ajoutée une nouvelle fois, soit placée sous commentaires pendant les tests.

Barre Titre Dialogue

.signin-custom-change-password-title-position

background-color: #223AA7;

Icône Titre Dialogue

.signin-custom-change-password-title-image

visibility","hidden;

Position Bouton Connexion

.signin-custom-change-password-button-signin-position

height: 25px;

top: 190px;

left: 100px;

Position Bouton Annuler

.signin-custom-change-password-button-cancel-position

height: 25px;

top: 190px;

left: 200px;
x
Fenêtre de dialogue Déjà connecté

Le tableau et l'image suivants fournissent les informations pour travailler avec la fenêtre de dialogue Déjà connecté.

Eléments du dialogue Déjà connecté

Classe CSS ou Balise HTML

Modifications conseillées

Mise en forme et position Dialogue

.signin-custom-user-already-signin-position

height: 130px;

top: 305px;

left: 332px;

background-color: #565352;

border: 1px solid transparent;

border-radius:25px;

-webkit-box-shadow: 7px 7px 9px rgba(255, 255, 255, 0.75);

-moz-box-shadow: 7px 7px 9px rgba(255, 255, 255, 0.75);

box-shadow: 7px 7px 9px rgba(255, 255, 255, 0.75);

behavior: url(web_resource/signin/PIE.htc);

Remarque : la ligne visibility: hidden; devra soit être supprimée, soit ajoutée une nouvelle fois, soit placée sous commentaires pendant les tests.

Etiquette Titre Dialogue

.signin-custom-user-already-signin-label-position

width: 270px;

color: #ffffff;

Icône Titre Dialogue

.signin-custom-user-already-signin-title-image

visibility: hidden;

Position Bouton Connexion

.signin-custom-user-already-signin-button-signin-position

height: 25px;

top: 100px;

left:100px;

Position Bouton Annuler

.signin-custom-user-already-signin-button-cancel-position

height: 25px;

top: 100px;

left: 200px;
WebFOCUS