24
Views
3
Comments
Bottom Bar Circular Cut - Material Design
Question

Any idea on how to create such a cut notch inside a bottom bar, Material Design style? 

Rank: #110

Hi Benjoe,

Did you check below components?

Regards,

Swatantra

mvp_badge
MVP
Rank: #18

Hi Benjoe Vidal,

My bet would be on overriding the CSS for the Floating Actions pattern. The Bottom Bar wouldn't change, but if it has a lower z-index it would be behind the Floating Actions and as such could be "cutout".

Regarding Swatantra's links, the first one might prove useful to your case (haven't checked if the Materialize library implements what you need though), the second one probably not, the third one is unrelated.

Hope this helps!

Rank: #44687

Hello, I've follow this approach and it works!

https://jsfiddle.net/21xtL65s/