Yaru: Change hover on stackswitcher / pathbar

Created on 2 Mar 2018  路  21Comments  路  Source: ubuntu/yaru

Use the same kind of background hover for stackswitcher / pathbar as we do for other buttons in the headerbar.

peek 2018-03-02 09-29

Enhancement help wanted

Most helpful comment

Personally, I like the current behavior (gray line on hover > orange line when active)
It feels very natural to me. Is it possible to have both at the same time? Like in firefox:
fox

All 21 comments

Maybe with a soft transition too?

At first I thought @madsrh's mockup looks good. But when I actually tested it, I felt it doesn't look so good than I expected. What do you think? (See also the referenced issue above.)

0 without-anime

EDIT: Please bear in mind that the corners of middle buttons in stackswitcher / pathbar cannot be rounded because the buttons are connected.

Here it looks a bit "softer". I think because of the transition/fade in.
stackswitcher
(Your Material-Ubuntu-Theme)
EDIT: Okay, maybe because of the gif you cant see the fade in good enough... :(
But i like the material-ubuntu-version way more.

@nana-4 would you double check stackswitcher on an open file window? It uses the same style of headerbar, but in a light version

maybe because of the gif you cant see the fade in good enough... :(

Exactly. My GIF doesn't show real (enough) transition. :(

I think that my strange feeling is due to the square corners of the buttons (that cannot be rounded).

@clobrano Are you talking about the invisible background of .path-bar? If so, I'll fix that to make the background color visible again. :)
image

if so, I'll fix that to make the background color visible again

I'd like to see whether the background highlight on hover would affect also that pathbar. The now-invisible background is probably a side effect of my button restyle :dagger:

I'd like to see whether the background highlight on hover would affect also that pathbar.

We can choose whether to affect or not to the pathbar, but if we adapt the highlight, it should be like this:
out3

Awesome!

Personally, I like the current behavior (gray line on hover > orange line when active)
It feels very natural to me. Is it possible to have both at the same time? Like in firefox:
fox

I agree that this one might be the best fit 馃憤
Should the animation then be the exact same as in Firefox? To me it looks like a overline from center and on click everything changes instantly (without any animation).

Sorry, but whats wrong with the current style?

Judging from the mockups/gifs I tend to prefer how things are. Status is indicated by the the underline: orange if selected/active, grey on hover. This seems logical to me and is consistent with other elements. Why change the background on hover (鈥nd than change it back if selected and add an underline instead)?

There's only the animation left, current style it's good for me

Is this still up-to-date?
@madsrh @clobrano

It is, I just haven't found a way to implement it :(

What I don't understand is why would we change this for the white underline? The underline makes perfect sense since when you press it it becomes an orange underline. :/

I believe the underline will still be orange

I would prefer the current hover with only a grey line instead of the whole background.
@madsrh don't you agree? I know it has been some months but why should we exchange the cool
no line / white line / orange line ? I think that fits perfectly with the shell's top panel.
The stackswitcher is something more than just an array of buttons since you change the whole stack/layer in the main window.

@Feichtmeier it's been FIVE months (I need to get our more LOL) so, +1 for keeping the current.

Does the gray line have a subtle/fast fadein on hover? Like we did for the buttons. I don't remember and I'm on the road atm

@madsrh I try to look how @nana-4 does it with his materia and all the many forks of it (canta, pop)

Edit: Hm the stackswitchers don't have that animation. Only the buttons. :man_shrugging:

There's a quick fadein/out (in Yaru) and I think that's fine, so I'll close this issue for now.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

sicklylife-jp picture sicklylife-jp  路  3Comments

chrisjbillington picture chrisjbillington  路  3Comments

madsrh picture madsrh  路  3Comments

Feichtmeier picture Feichtmeier  路  3Comments

madsrh picture madsrh  路  3Comments