Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Find the "Material" way to display the breadcrumbs. #1

Open
samtimalsina opened this issue Jun 18, 2017 · 5 comments
Open

Find the "Material" way to display the breadcrumbs. #1

samtimalsina opened this issue Jun 18, 2017 · 5 comments

Comments

@samtimalsina
Copy link
Owner

The breadcrumbs in Drupal admin is useful in deep nested pages (eg. field settings on a node type) and I use it often. Breadcrumb, at least for me, is a power-tool-of-sorts.

screen shot 2017-06-17 at 7 40 43 pm

However, there's a few problems with the breadcrumb:

  • Doesn't fit the Material Design Language. I have yet to see an example that uses it.
  • Hard to tap on links on smaller devices.

The breadcrumb needs a rethink. This could be potential enhancement.

@samtimalsina samtimalsina added this to the Beta Release milestone Jun 18, 2017
@touficbatache
Copy link

touficbatache commented Jun 18, 2017

I think this is the material way! You just need a few changes, look at Google's search results: replace » with and make the links colored with grey using the mdc-theme--text-disabled-on-primary class from MDC-Web like with just the selected link in White. I'm not sure though, I just think it's the material way to do it 😃

@samtimalsina
Copy link
Owner Author

Thanks for the info @touficbatache!

I have been using the chevron_right icon :), but haven't tried using the primary color. Here's what it looks like now for reference.

screen shot 2017-06-18 at 12 19 02 pm

Scouring the interwebs, I don't see many examples of breadcrumbs in Material Design that is actually implemented. The closest is http://demo.geekslabs.com/materialize-v1.0/ui-breadcrumbs.html#!, but then Drupal is notorious for very deep links and I'm trying to find a sweet spot of Conforms to guidelines and works well on all devices

@touficbatache
Copy link

touficbatache commented Jun 18, 2017

If you want, you can send me a link to where you want to use it so I can style it and send it back to you 😃

@samtimalsina
Copy link
Owner Author

I guess styling is not the main problem here, and I'll definitely take you up on styling it when I have a reference! And to be honest I am not a big fan of how they do it at http://materializecss.com/breadcrumbs.html. Few reasons:

  • They have taken creative liberties that I don't agree with. I don't think breadcrumbs should be as prominent.
  • This does not take into account smaller devices

There are other things too, but I would love some guidelines from Material team on this. Now, if we are allowed to take creative liberties as well, I would love to get some feedback and/or help on this. Thanks again @touficbatache!

@touficbatache
Copy link

No problem @samtimalsina. I don't think that the Google Design Team has time to help you with this but if they do, congrats!

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

No branches or pull requests

2 participants