Skip to content
This repository has been archived by the owner on Dec 1, 2019. It is now read-only.

Search icon + text better fitting with menu line. #487

Closed
paaljoachim opened this issue Sep 24, 2019 · 1 comment
Closed

Search icon + text better fitting with menu line. #487

paaljoachim opened this issue Sep 24, 2019 · 1 comment
Labels

Comments

@paaljoachim
Copy link

paaljoachim commented Sep 24, 2019

Hey

The Search icon and Search text could fit better in with the menu line.
Right now it feels like it takes up too much space automatically making it more important then the menu links.

Screen Shot 2019-09-24 at 08 11 55

Adding different options. Working on having it harmonize better with the menu text links.

Moving the Search icon and text a little further up.
Twenty-Twenty-search-up

Removing the Search text.
Twenty-Twenty-Search-no-text

A smaller Search icon.
Twenty-Twenty-Search-icon-smaller

@andersnoren
Copy link
Contributor

Hi @paaljoachim,

The icon labels were added for accessibility reasons, after a discussion in #93, so those need to remain.

Alignment of the icons gets tricky, since it's not just the search icon that needs to be aligned, but also the Expandable Menu icon, which is displayed when the "Expandable Menu" menu location has a menu set. Since the icons have different height, you can't center both the icon and the text of both buttons without either button feeling misaligned:

image

Because of that, I think aligning the header toggles so the icons are centered with the menu, and allowing the toggle text to be positioned beneath, is the better option.

image

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

No branches or pull requests

4 participants