Firefox search and location boxes have black borders when unselected

[APolihron]

[Impact]

As seen in the attached screen shot the borders around Firefox location and search entry boxes are black when unselected, but they should be grey.

The black borders are inconsistent with the rest of the Ubuntu theming and it looks jarring.

The issue is resolved by styling the 'frame' selector, which Firefox uses to style the Search and Location entry boxes. Some overrides are then applied to prevent frames incorrectly rendering borders in other applications.

[Test Case]

To observe the issue simply open Firefox and look at the Search or Location entry boxes while they are unselected, the borders will be black.

After installing the patched theme doing to same will result in the borders being rendered using an appropriate shade of grey.

[Regression Potential]

It is possible that some GTK3+ applications may now render frames with a border where they previously did not. That said, the default applications in Ubuntu have been checked for this regression and the appropriate overrides have been added.

The default installed applications in Ubuntu have been tested to ensure they do not regress in the manner described above.

[Other Info]

Should Firefox style the Search and Location entry boxes with a discrete selector in the future then the styling added to work around the black border could be removed/updated.

[Martin Wimpress  (flexiondotorg)]

Looks fine to me, what are you reporting exactly?

[APolihron (apolitech)]

The search box(the line its black) diferent from the left one that have green lines and there its a black line under the top header of the app ( under the search box, www box and so on) see the second pic to make the difference between them)

[Martin Wimpress  (flexiondotorg)]

The bg of the Firefox entry is styled by this selector, which feel like this might possibly be a Firefox bug:

https://github.com/flexiondotorg/ubuntu-mate-themes/blob/master/usr/share/themes/Ambiant-MATE/gtk-3.0/gtk-widgets.css#L824

[Martin Wimpress  (flexiondotorg)]

The border colour can be set with:

frame {
    border-width: 1px;
    border-style: solid;
    border-color: shade (@bg_color, 0.82);
}

But 'frame' is used widely in many applications which results in borders being rendered where you really don't want them. The following will style Firefox and then override that styling where it is not required. I've tested most default applications in Ubuntu and the following appears to work well, more testing would be good.

/* Style frame for firefox to set the search/location entry box borders*/
frame {
    border-width: 1px;
    border-style: solid;
    border-color: shade (@bg_color, 0.82);
}

/* Override frame styling set for firefox to prevent erroneous frames being rendered */
box > frame, /* common in settings panels */
statusbar > frame, /* common in application status bars, etc. */
statusbar > widget > frame, /* common in application status bars, etc. */
GvcMixerDialog frame { /* some audio mixers */
    border-width: 0px;
    border-style: none;
}

[Martin Wimpress  (flexiondotorg)]

The following merge proposal has been filed for ubuntu-themes:

  * https://code.launchpad.net/~flexiondotorg/ubuntu-themes/lp1624738/+merge/308032

[Launchpad Janitor (janitor)]

This bug was fixed in the package ubuntu-mate-artwork - 16.10.9

---------------
ubuntu-mate-artwork (16.10.9) yakkety; urgency=medium

  * Fix Firefox download progress bars. (LP: #1630224)
  * Fix Unlock button for Time and Date Settings. (LP: #1630910)
  * Fix Back/Forward navigation buttons in Yelp. (LP: #1624574)
  * Fix Firefox Search/Location entry box borders. (LP: #1624738)
  * Fix Firefox menu items.

 -- Martin Wimpress <email address hidden> Sun, 09 Oct 2016 20:42:40 +0100

[eyelash (eyelash)]

this seems to be a Firefox bug that should be fixed in Firefox 50:
https://bugzilla.mozilla.org/show_bug.cgi?id=1266914

[Ophir LOJKINE (pere-jobs)]

I just upgraded and I am affected by this bug. What should I do ?