Need help with Material Design

Manohar Yeluri — Thu, 15 Oct 2020 00:48:36 +0000

Hi...
I am trying to learn Material Design & ReactJS. I could just use Material-UI React component library and get going. But, wanted to understand more by reading docs at material.io, where content is organized into 4 categories like web, android, flutter & ios. I started out with Web.

Now, here's the PROBLEM I AM FACING: In the button component documentation styles part, it is mentioned...

@use @material/button"; @include button.core-styles;

To understand this, I started following the first Material Design Web Google Codelab (there are 5 of'em, go here--> "https://codelabs.developers.google.com/?cat=Web" and type MDC in search box) to see how the styles are actually used. There are 5 steps in total, in fourth step where styles for text-field/button component are imported like this

@import "@material/button/mdc-button;

which is different from what is mentioned in its documentation & I couldn't understand & relate to.

What am I missing while reading the component docs? Can someone please explain the differences between styles usage in a particular component docs vs its actual usage shown in codelab?

DEV Community: Manohar Yeluri

Need help with Material Design