Création d'un nouveau skin [Résolu]

[TOM-Z]

Je cherche à changer la couleur de texte dans les tabcontrole, car celui qui est actif dans le skin créé est de couleur bleue. Noir sur bleu est donc illisible et je vousdrait mettre blanc. Je suis allé dans XSLC.css mais je n'arrive pas à trouver la classe qui affecte ce paramètre (à priori .clActiveTab mais ca ne marche pas...)

[Nicolas.Cogi]

Sur TabControl, la meilleure maniere de voir comment ca marche, c'est d'aller dans le fichier xslc.xsl qui contient la Template générant le html correspondant.

La mauvaise surprise, c'est que le fond du TabControl est une image en background et pas une class CSS. L'image en question est "main_background.gif".

La bonne surprise, c'est qu'on a plein de moyen à disposition pour arriver au résultat voulu :

Tu peux mettre ton contenu à afficher dans un <div> en assignant sa couleur à blanc par un attribut Style ou class (l'attribut class est à préférer bien sûr).

Tu peux aussi modifier les skins : la maniere recommandée est de créer sa propre skin en copiant-collant la skin la plus proche et en modifiant les images selon ses besoins. Pour ce genre de manipulation, ton application doit avoir son propre Portal et pas le Portal partagé.

Tu peux utiliser le paramètre XMLC_DisplayTabControl=0 dans l'url ou dans le xsl pour ne pas afficher du tout le TabControl.

clActiveTab est utilisée pour l'onglet actif, et pas pour le contenu du tabcontrol.

Voilà quelques techniques parmi d'autres que tu peux utiliser pour arriver à ton résultat.
Testes bien toutes les possibilités dans différentes skins pour voir si tout marche bien, si tu permets à tes utilisateurs de choisir leur skin.

[TOM-Z]

Mon skin est déjà créé... Il marche bien et a la les coins biseautés...
ce que je veux changer, c'est la couleur des caractères dans l'onglet actif uniquement (blanc au lieu de noir) pour respecter une charte imposée. Je ne vais pas rajouter un div dans XSLC.XSL. Si ?
C'est pourquoi je pensais à la classe .clActiveTab mais rien n'y fait...

Merci pour la première réponse en tout cas.

Pendant que j'y suis : Est-il possible d'inserer le skin créé dans la liste proposée à la création d'un appli ? (dans le sharedportal je pense)

[Nicolas.Cogi]

Hopla...
Pour commencer, la liste des skins est dans le répertoire XML\Adm, fichier Skins.xml. Il suffit de copier un élément et de remplacer. zou !

Pour le TabControl, bin c'est un probleme de CSS...
La class utilisée pour le Tab (l'onglet) actif est bien clActiveTab, mais on place à l'intérieur du Tab un elément <A href=""> avec notre lien. Si on regarde dans xslc.css, on a une class css qui match pour tous les axes <A>, ce qui ecrase la définition de la couleur de clActiveTab. Je sais pas si c'est bien claire, mais c'est le mécanisme standard de CSS...

Pour palier au problème, on peut surcharger la couleur localement avec un attribut style dans le <a> de l'onglet. Mais attention, cette couleur sera en dure dans le XSL et du coup, pas relatif à la skin choisie. Du blanc fonctionnera peut-être bien pour AnotherBlue mais peut-être pas pour msngraylightsquare par exemple.

Tu peux aussi essayer de mettre l'attribut CSS !important dans la class clActiveTab. Avec ca, la valeur marquée comme !Important surchagera normallement tout le reste.

voila un exemple :
.clActiveTab {...; color: #FFFFFF !important; ... }
Cet attribut color devrait etre plus important que les autres definitions et donc ton contenu devrait etre en blanc

Sinon, essaye de mettre des icones à la place des libellés dans les onglets. Ca tape tout de suite beaucoup beaucoup plus

[TOM-Z]

CA MARCHE PAS...

extrait du css modofié :
.clActiveTab {
cursor: default;
/* background-color: ThreedLightShadow; */
color: white !important;
font-color: white;
...

Bigre. Quant aux autres options que tu me suggères, on voit bien que tu ne connais pas notre servie communication ! des cerbères ! C'est une charte nationale et tous les développeur Java s'y sont pliés. Il faut donc que je m'y mette. Déjà qu'on utilise ce mouton à 5 pattes qu'est XMLRAD ! (mais 5 pattes ça court plus vite !)

Quant à modifier la balise A c'est une très mauvaise idée... Avoues-le !

Bon, je continue à chercher... Au fait, il faut vider le cache du client pour vider les CSS ? il m'arrive parfois d'avoir des persistances après certains changements.

Merci de toutes tes réponses.

[TOM-Z]

J'ai réussi en virant le A de l'onglet actif (c'est vrai qu'il ne sert à rien) et en mettant un div class=.clactivetab et ... CA MARCHE ! Ca oblige à revenir sur chaque xsl mais faute de grive...

[Nicolas.Cogi]

y'a des jours comme ca où on se bat avec CSS

Le moyen ultime de forcer le blanc directement dans le fichier CSS est le suivant :

.clActiveTab { color: white!important; font-weight: bold; padding-left: 3px; padding-right: 5px }
.clActiveTab a { color: white!important; font-weight: bold; padding-left: 3px; padding-right: 5px }

Ici, on force tous les éléments <A>, fils d'élements dont la class css est clActiveTab, a avoir la couleur blanche.

Là, pour le coup, ca doit marcher

Et oui, j'ai aussi parfois quelques problemes de rafraichissement quand je change le CSS. Dans ce cas, je vide le cache du navigateur, CTRL+F5 pour faire un refresh complet et zou.

[Julien C.]

Tu peux partager ton nouveau skin ?

[TOM-Z]

Non ! Skin propriétaire. Désolé.

De plus il est pas très beau mais nos applis intra ou inernet doivent respecter un charte graphique...

De plus je n'ai pas le temps de faire du joli : trop de taff ! sinon le principe est relativement simple. Mais je pense que ce n'est pas à un vieux singe comme toi que j'apprendrai à faire la grimace !