liferay / clay

A web implementation of the Lexicon Experience Language
http://clayui.com
Other
208 stars 483 forks source link

@clayui/css Remove unused components with fallback to add back in #4205

Open pat270 opened 3 years ago

pat270 commented 3 years ago

Related to https://github.com/liferay/clay/issues/1104.

We have a lot of components in Clay CSS that are specifically created for DXP's admin ui. These may be of use to site creators, but most likely not. We should try and remove them to reduce the CSS size. We also have a lot of Bootstrap components that aren't used. I've compiled a list of components that could easily be removed without regressions in DXP.

Clay CSS Components:

Bootstrap Components:

We could get even more specific by providing different sets of components to Classic and Admin Theme. Classic Theme would have the minimum, whatever that is.

matuzalemsteles commented 3 years ago

It makes sense to remove stuff from Bootstrap but I'm not sure about Clay CSS components, as we're adopting a cadmin specific component strategy I'm a little worried about how we're going to keep this documented, or should we separate the documentation at the session level, it might look like a little confusing for some, although these components are specific to cadmin.

javiergamarra commented 3 years ago

Bootstrap looks safe. Clay CSS I'm also worried about feature parity and documentation. We can analyze how much we can win (or if it's where we can get most bang for our buck) for removing those and decide.

pat270 commented 3 years ago

I was thinking we could add a disclaimer that it's not provided by default and document a way to add it if they need it. Application Bar == Control Menu in DXP, but doesn't use the markup and CSS. We could comment out the import and write up how to bring it back (uncomment it).

For our docs, we would supply Clay CSS everything so our docs won't look broken. I know this is confusing, but I don't see how we can provide an upgrade path for those who might have developed something based on a component we or Bootstrap provided.

matuzalemsteles commented 3 years ago

@pat270 it might make sense for some components, for example cadmin components we should export somewhere and document them, management bar component is used a lot in both taglib and React components, so ignore it from clayui.com documentation might be a little weird, although we think some of these components are DXP specific I still think that because they are in the Lexicon they are part of the Design System experience and could be used anywhere.

I think a safe way of what to remove from Clay CSS and what to keep only in cadmin would be to follow what Lexicon proposes, for example, I would keep:

pat270 commented 3 years ago

Do we have cases where we are using those breakpoints either by GS or in DXP? I have only seen the md use case. I can start working on the Bootstrap components and decide what to do with Clay CSS when we get there. I was hoping to be able to reduce it by a lot.

matuzalemsteles commented 3 years ago

Hmm yes, I also don't see the use of breakpoints for these components, I also only see the md size so it might be safe to remove the breakpoints.

matuzalemsteles commented 1 year ago

LPS Ticket https://liferay.atlassian.net/browse/LPS-190662