Modifier skin sunrise pour opale

bonjour,
Je souhaite modifier quelques détails sur le skin sunrise.
J’ai importé l’atelier OpaleSunriseStyler_4.0.3_sources.scwsp dans scenariChain-desktop, mais je ne vois pas comment effectuer des modifications :

Je n’ai que des ressources binaires.
Que dois-je faire ?

Bonjour,

Vous avez récupérer là les sources de l’extension de stylage, c’est pour SCENARIbuilder.

Il faut installer cette extension sur votre entrepot
Ensuite, vous pouvez créer un atelier Styler en sélectionnant dans les options « Styler Opale Sunrise 4 » (cette option n’est visible que si vous avez installé l’extension)
Dans cet atelier vous allez pouvoir créer un habillage par formulaire ou guidée pour Sunrise.

(edit) Je vois que l’extension est déjà installé, vous n’avez donc rien d’autre à importer/installer.

Mickaël

Comme sur mon screen précédent, je l’ai cette extension :

Juste comme ça ?

image

Oui voilà, suivant ce que vous voulez faire, choisissez l’approche par formulaire ou guidé.
En mode formulaire, vous pouvez jouer avec toutes les options.
En mode guidée, vous pouvez éditer l’encart « Styles CSS »

Merci, je commence à comprendre le fonctionnement.
Y-a-t-il possibilité (je ne vois pas où) de modifier la taille des icônes :

image

J’ai regardé dans le fichier OpaleSunriseStyler_4.0.3_sources.scwsp, mais je ne trouve pas les icônes

image et image

Modifier la taille ou supprimer une icône

Pour modifier la taille ou supprimé une icône, il faut tout d’abord être dans un mode d’habillage graphique guidé.
Ensuite dans l’encart « Styles CSS » vous pouvez rajouter des règles pour faire ce que vous voulez. Cela nécessite des connaissances en CSS.

Pour vous aider, je vous invite à ouvrir une publication sur votre navigateur internet et utiliser l’inspecteur d’élément afin de savoir quelle propriété CSS modifier.

Par exemple :

  • Pour la taille, il faut jouer avec la propriété font-size (car ces icones proviennent d’une police d’icone) sur le sélecteur .default #tools .item
  • Pour la supprimer, vous pouvez-ajouter la règle display:none

Mickaël

Merci de votre réponse.
Comment procéder pour indiquer qu’on parle de la police d’icône et non de la taille de la police de caractère qui est déjà précisée. J’ai testé un truc comme ça, mais ça ne marche pas :

Je suis peut-être complètement à côté de la plaque…

Avec mon inspecteur d’élément, j’ai trouvé ça, mais je ne sais pas quoi en faire :

image

--fontStyle est une variable, elle est déclaré dans :root, plus la peine d’y retoucher.

Ajouter la règle font-size par défaut, les icones sont déjà à 2em, baissez donc cette valeur si vous voulez plus petit.

L’inspecteur vous montre la structure HTML de la publication, vous pouvez maintenant posez vos règles CSS en fonction. Pour masquer l’icone de module, vous pouvez ajouter :

.default #tools li.home .item {
display: none;
}
1 « J'aime »

Pour fontsize, c’était une mauvaise copie d’écran.
Je progresse, j’ai bien diminué les icônes, mais en fait, c’est le cadre qu’il faut aussi réduire :

Je vous invite à utiliser l’inspecteur d’élément, d’un côté vous avez la structure HTML et de l’autre, les règles CSS associés, vous pouvez modifier ces règles directement dans le navigateur, quand vous avez trouvé votre bonheur, recopier dans votre atelier styler.

Je vous invite également à consulter des aides sur le web sur le CSS, ça ne manque pas.

Mickaël