Search bar customization (essentially, allow other designs for the menu)

[heqro]

In this issue, I will be posting design concepts for the search bar. Posts for other concepts welcome as well.

[heqro]

First concept: simple line under the text that grows as the user texts

[Tuxman2]

Hello heqro,

I would like to see a search bar of the same style as that present in the image above (available in GNOME 40). Is this conceivable ?

https://i0.wp.com/fostips.com/wp-content/uploads/2021/05/gnome40-macostheme.jpg?w=1100&ssl=1

Otherwise, I tested your menu on a touchscreen. I must use the categories because if I display the applications icons only it is very difficult for me to display the list of other icons with the finger (as we can do with the 'Launchpad Plasma' menu).

Thanks.

[heqro]

Otherwise, I tested your menu on a touchscreen. I must use the categories because if I display the applications icons only it is very difficult for me to display the list of other icons with the finger (as we can do with the 'Launchpad Plasma' menu).

Could you open another issue for this? By the way, I don't really have a touchscreen to test with, is it a scrolling issue you are talking about? Does this happen with the categories sidebar as well?

[heqro]

I would like to see a search bar of the same style as that present in the image above (available in GNOME 40). Is this conceivable ?

Hello, what do you think about this one? It also resizes as you type (I think Gnome's searchbar doesn't do that and maybe it's a bit over the top on my end as well).

I'm eagerly waiting to hear your take on this one (perhaps we should have a background color? I'm not really sure about that). As always, it is consistent with your color scheme.

[Tuxman2]

Hello,

The design of your search bar looks very good. Allow the user to choose a background color for the search bar can be a good feature. What do you think about it ? Your menu is getting better and better after each version. ;-)

[heqro]

Greetings, I enclose two pictures with this comment.

The first picture features the menu but transparency is very low so as to see the contrast against a white background:

The second picture features the menu but this time around the search bar has the user's background color:

Bonus picture: it also looks a bit out of place when using a light color scheme for some reason:

In my opinion, the second & third ones look extremely out of place with respect to the rest of the menu. This immediately makes me question whether the search bar is out of place or the rest of stuff is 😁

I'm waiting to hear what you think about it. Personally, I'm not a big fan of feature creep when it comes to a sub-sub-subset of options, but if you really think the background color will work I can just keep trying up until it doesn't look weird :s

By the way, I changed the search icon for something else; I think it looks much better now, doesn't it?

[Tuxman2]

Very good for the second and the third (bonus) pictures. I think this is the best choice. ;-)

Regards.

[heqro]

Sorry, I didn't quite understand. Are you okay with the search background being transparent?

[Tuxman2]

In my case, I prefer to see a search bar like in the second and bonus pictures when it is used with a dark or light theme.

I don't known for other people.

[heqro]

Okay, it's done and pushed alongside an opacity slider because I'd rather have it with no opacity and you may understandably want to crank it up 😃

Should be updated by now in the KDE Store as well.

If you have other concepts or ideas that can further polish the search bar please do not hesitate to keep replying to this issue.

[Tuxman2]

Thanks.

I don't have other ideas to polish the search bar for now.

News: The new search bar design works well and it looks good. But, when I enabled opacity to 100% with a dark theme, I can't see the character displayed in the search bar., because this one is still in black. No problem without opacity or when opacity setting is low. I guess with a light theme, there is no problem too. So, is there a solution when we use a black theme with full opacity for the search bar that the cursor and the character(s) in the search bar become white or light grey ? Thanks.

[heqro]

New design inspired by Material design for text fields: