Sur la route de la Geek I'll still be a geek after nobody thinks it's chic !

6août/102

Les ongle(t)s du Panda Roux, le retour

L'année dernière, j'avais traduit un hack de l'inégalable Kaze qui permettait d'améliorer l'affichage des onglets sous Firefox pour les eeePC et tout autre ordinateur à petit écran.

Dans Firefox 4 (actuellement disponible en version beta ou nightly pour les plus téméraires), le système d'onglet a toutefois été modifié au profit de l'UserChrome. Heureusement que Bugzilla est là ;)

Pour modifier vos onglets, il n'y a donc plus besoin d'aller modifier dans le about:config de votre Firefox, tout se passe dans le UserChrome.css:

.tabbrowser-tab:not([pinned]) {
  max-width: 52px !important;
  min-width: 32px !important;
}

.tabbrowser-tab:not([fadein]) {
 max-width: 1px !important;
 min-width: 1px !important;
 max-width: 1px;
 min-width: 1px;
}

.tabbrowser-tabs tab                  .tab-text { display: none; }
.tabbrowser-tabs tab[selected="true"] .tab-text { display: block; }
.tabbrowser-tabs tab[selected="true"]           { min-width: 250px; }

Finito ! Plus simple, non ?
NB: hack testé sous Firefox 4b4pre (nightly)

Taggé comme: , 2 Commentaires
5mai/093

Le Panda Roux aux ongle(t)s coupés

Quand on bosse sur un Netbook, on est assez avare de place. C'est sur que sur un écran de 10", la gestion de l'affichage est souvent relativement compliqué voire digne du casse-tête chinois. Notamment sous Firefox avec les onglets.

Heureusement que Kaze est là pour nous dévoiler le secret du petit onglet sous Firefox. En fait, rien de plus simple.

1) Dans la barre d'adresse de votre navigateur; tapez l'adresse about:config. Vous aurez alors accès à un grand nombre d'options avancée pour configurer votre Firefox. Modifier les valeurs suivantes:

browser.tabs.tabMinWidth => 36
browser.tabs.tabMaxWidth => 52
browser.tabs.closeButtons => 0

Ces options vont modifier la taille des onglets par défaut de manière à ce que seul le favicon soit visible dans l'onglet

2) Dans le fichier userChrome.css, copier le code suivant:

.tabbrowser-tabs tab .tab-text { display: none; }
.tabbrowser-tabs tab[selected="true"] .tab-text { display: block; }
.tabbrowser-tabs tab[selected="true"] { min-width: 250px; }

Grosso modo, ce code va modifier le rendu de l'onglet que vous êtes en train de lire pour vous permettre de voir le titre. Le rendu final:

tabs-firefox-mini

Taggé comme: , 3 Commentaires