463261 - endcap of the buttons & shadows of buttons on the bookmark toolbar are not properly aligned

Status: VERIFIED FIXED

(Firefox :: Theme, defect)

Description

[Chris Blore]

When you mouse over the "Most Visited" button on the bookmark toolbar, it is noticeable that the left endcap is not properly aligned. It looks to be a few pixels below where it should be. This is not the case on the right-hand side.

I shall try to post a screenshot to show what I mean a bit later on.

Comment 1

[Markus Stange [:mstange]]

This is similar to bug 457491. I think we should just rework these buttons with border-image or just do it with border-radius and border-colors.

Comment 2

[Chris Blore]

Yes, I should have said that this is visible on all bookmark toolbar buttons, not just "Most Visited".

Comment 3

[Mike Beltzner [:beltzner, not reading bugmail]]

Good theme cleanup to get.

Comment 5

[Chris Blore]

Attachment: Screenshot showing the issue, courtesy of Jennifer Boriss in bug 464561

Comment 6

[Dão Gottwald [:dao]]

(In reply to comment #1)
> This is similar to bug 457491.

In fact, this is a regression from bug 457491.

Comment 7

[Dão Gottwald [:dao]]

Attachment: patch

Comment 8

[Dão Gottwald [:dao]]

I also noticed that the images for the hover state are messed up. There are two shades of gray, both visible in this image: http://mxr.mozilla.org/mozilla/source/toolkit/themes/pinstripe/global/toolbar/toolbarbutton-customhover-right.png

Comment 9

[:Gavin Sharp [email: [e-mail]]]

Comment on attachment 349609 [details] [diff] [review]
patch

>diff --git a/browser/themes/pinstripe/browser/browser.css b/browser/themes/pinstripe/browser/browser.css

>-toolbarbutton.bookmark-item .toolbarbutton-text {
>-  font-size: 100% !important; 
>-  margin: 0px !important;

Why are you removing this?

Comment 10

[Dão Gottwald [:dao]]

There's already this:

toolbarbutton.bookmark-item > .toolbarbutton-text {
  margin: 0;
}

and I don't see anything else altering the font size.

Comment 11

[Dão Gottwald [:dao]]

http://hg.mozilla.org/mozilla-central/rev/5fcc930b0518

Comment 12

[John Locke]

hey, why don't use -moz-border-image instead of background-image here.

here's mine, I've removed those left, middle, right codes.


toolbarbutton.bookmark-item:hover {
	-moz-border-image: url("chrome://browser/skin/hover.png") 0 7 / 0px 7px repeat;
}

toolbarbutton.bookmark-item:hover:active, 
toolbarbutton.bookmark-item[open="true"] {
	-moz-border-image: url("chrome://browser/skin/open.png") 0 7 / 0px 7px repeat;
}

Comment 13

[Dão Gottwald [:dao]]

(In reply to comment #12)
> hey, why don't use -moz-border-image instead of background-image here.

Because fixing the existing method was easier.

Feel free to file a new bug.

Comment 16

[Marcia Knous [:marcia]]

Verified fixed on the trunk using Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.2a1pre) Gecko/20090413 Minefield/3.6a1pre and

Verified fixed on the 1.9.1 branch using Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b4pre) Gecko/20090413 Shiretoko/3.5b4pre