material-components / material-components-web

Modular and customizable Material Design UI components for the web
https://material.io/develop/web
MIT License
17.14k stars 2.15k forks source link

[mdc-chip] css not applied to mdc-evolution-chip elements #8117

Open ciukstar opened 1 year ago

ciukstar commented 1 year ago

Bug report

No CSS gets applied to the elements of of class mdc-evolution-chip-set and mdc-evolution-chip.

Steps to reproduce

  1. Go to https://codepen.io/Sergiu-Starciuc/pen/bGQdgXY
  2. See that the chips are not displayed properly

Actual behavior

Chips look like simple buttons.

Expected behavior

The elements of the chips should be displayed properly, and not as simple buttons.

Screenshots

Screenshot from 2023-06-11 02-39-05

Your Environment:

Software Version(s)
MDC Web v14.0.0
Browser Chrome 114
Operating System Ubuntu 22.04.2 LTS (Linux 5.15.0-74-generic)

Additional context

I've noticed that elements with a class starting with the mdc-evolution-chip... prefix do not have the appropriate CSS applied. Also, there aren't any ...-evolution-... entries in the CSS provided at <link rel="stylesheet" href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css">.

Possible solution

Include the relevant CSS for "evolution chips" in <link rel="stylesheet" href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css">.

confused-Techie commented 1 year ago

Same issue here, although what's interesting, is while the mdc-evolution-chip CSS isn't totally present, parts of it are, or are otherwise now changed.

Specifically classes such as:

All exist. Although, not all of the classes from the example here (which link back to this repo) are available under this new naming scheme.

Otherwise, what I've done, and what may be applicable to you as well is utilizing the CSS viewable on the example site here.

mindaugasvcs commented 5 months ago

Any updates on this?

mindaugasvcs commented 5 months ago

It was intentional, see this commit: https://github.com/material-components/material-components-web/commit/9c5662c27f644acee1e5f61f430a928b28572049