Épurez votre Gmail !

Bonjour à tous,
pour tous ceux qui sont sous Firefox (il y en a d'autres ?!), il se peut que vous connaissez Stylish : c'est une extension qui permet de rajouter du css sur des sites, ou carrément à Firefox ! Donc j'ai fais un style pour épurer Gmail, quelques chiffres :
- sur une boite de réception avec 50 messages, on gagne 229px de hauteur
- toujours dans la boite de réception, 47px de largeur utilisé pour afficher plus du contenu des mails
- dans la consultation du message (et donc dans la rédaction de message), 260px de large.
- et bien sûr une interface plus agréable.

Seulement voila :
- jusqu'à hier, j'utilisais hotmail comme compte mail principal, mais vu que Gmail offre beaucoup plus de possibilité et surtout ne rajoute pas de pub à chaque fin de mes messages, il se peut qu'il y ai quelques problèmes ou des choses à améliorer, donc si vous voyez des bugs ou des améliorations, n'hésitez pas !
- En parlant de bugs, j'en ai relevé deux que je n'arrive pas à corriger pour l'instant : impossible de rajouter une marge inférieur au body (pas trop grave), mais surtout vu que j'ai remonté le corps des messages, les alertes telle que "message envoyé" se retrouvait en dessous. J'ai donc mis en premier plan la table qui gérait ça, mais maintenant les menus qui apparaissent dynamiquement suite à une action (survol de l'expéditeur, menus "déplacer vers" & co) se retrouvent tout en arrière ! J'ai pu régler les menus lors de la création des messages (police, couleur, etc) car ils sont juste définis comme invisible, alors que les autres n'existent pas avant dans le code, donc le css ne s'applique pas dessus. Il faudrait donc trouver pourquoi mettre les alertes au premier plan pousse le reste en arrière-plan.
- j'ai utilisé deux manières pour appliquer le css :
- en utilisant les expressions régulières (je ne sais pas si c'est le bon terme pour ce genre de chose en css), qui permet d'être sûr de l'élément que l'on veut modifier, mais qu'il faudra refaire si Google change quelque chose dans le code source,
- en utilisant class="bidule", qui à l'inverse des avantages/inconvénients ci-dessus
-> vous en pensez donc quoi ?

Alors voilà enfin le code :

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("mail.google.com") {

[class="nH pp ps"],/*chat et invitation*/
[class="nH mq"],/*extrait du web*/
.u5,/*pub de droite*/
[class="nH u8"],/*À propos de ces liens*/
[class="AY D E"],/*répétition en bas des éléments dans la boite de réception*/
[class=" iE D E"],/*répétition en bas des éléments dans le message*/
.CoUvaf,/*répétition en bas des éléments dans la création de message*/
[class="Bs nH iY"] .Bu:nth-child(2),/*petite marge entre le mail et les icones d'outils du message*/
[class="Bs nH iY"] .Bu:last-child .hk u,/*texte des outils du message*/
[class="nH l2 ov"]/*footer*/
{
display:none !important;
}

/*body
{
margin-bottom:10px !important;
}*/

html > body > div > div:nth-child(2) > div > div > div > div:nth-child(3)/*réduire l'espace du logo Gmail*/
{
margin-left:-20px;
}

html > body > div > div:nth-child(2) > div > div:nth-child(2) > div > div:nth-child(2)/*réduire l'espace du menu de gauche, gagne 47px*/
{
width:150px !important;
margin-left:-17px;
}

[class="qj pk"]/*surlignage du dossier en cours dans le menu de gauche*/
{
left:0px !important;
}

html > body > div > div:nth-child(2) > div > div:nth-child(2) > div > div:nth-child(3)/*corps du message*/
{
margin-left:0px;/*sinon se base sur le menu de gauche, que l'on a déplacé*/
margin-top:-23px;/*le remonter*/
}

html > body > div > div:nth-child(2) > div > div:nth-child(2) > div > div:nth-child(3) > div/*corps du message*/
{
margin-right:-47px;/*récupérer l'espace gagné par le déplacement du menu de gauche*/
}

[class="Bs nH iY"] .Bu:last-child .nH/*outils pour le mail*/
{
width:20px !important;/*les compresser pour les aligner verticalement*/
}

[class="Bs nH iY"] .Bu:last-child .hk/*aligner les icones les unes à coté des autres*/
{
float:left;
}

[class="ph p"]/*remettre l'arrondi dans le coin supérieur gauche de nouveau message*/
{
-moz-border-radius-topleft:4px;
}

/*table.cf,/*placer l'alerte au premier plan, à cause du remontage du corps*/
[class="J-M J-M-BvBYQ fx"],/*police et taille police*/
[class="J-sbjX5c fv"],/*couleur police*/
[class="J-M J-M-BvBYQ ex"],/*surlignage du texte*/
.cf/*cadre d'options (4 en tout)*/
{
position:relative;
z-index:10;
}

/*auteur original :  http://userstyles.org/styles/4725*/
 
/*yO : lu, zE : non-lu, x7 : sélectionné*/
table.zt [class="zA yO"]:hover,/*message lu*/
table.zt [class="zA zE"]:hover,/*message non-lu*/
table.zt [class="zA yO x7"]:hover,/*message lu sélectionné*/
table.zt [class="zA zE x7"]:hover/*message non-lu sélectionné*/
{ background-color:transparent !important;}

}

Enjoy
Modifié par Dreamkey (05 Dec 2009 - 04:07)