Feature Request

Ionic version: [x] 5.x (5.4.3)

Describe the Feature Request It's a great idea to provide these css utilities. Every great UI framework should have it. But some essential css utilities are missing. For example a class for display: flex and flex: 1 etc. Nothing special, only the very common flex attributes.

Describe Preferred Solution A good example is Vuetify (and here). I thinking about classes like:

.ion-flex-container {
  display: flex;
}

.ion-flex-column {
  flex-direction: column;
}

.ion-flex {
  flex: 1;
}

/* And utilities for display attr. like: (or .ion-d-block) */
.ion-display-block {
  display: block;
}

.ion-display-flex {
  display: flex;
}

Describe Alternatives I could create my own global classes. But it would be more consistent when these is provided by the UI framework itself. And it's about avoiding global styles.

Related Code See the Ionic source code and docs.

Additional Context I understand that the current flex classnames are only for modification of alignment in a flex container (e.g. from an Ionic element.) But it would be great if Ionic provides such CSS utilities (like Vuetify) to allow e.g. flex layouts with no need of custom CSS. It's not a question what the developer can or should create. In this case, I could create the whole UI framework like Ionic. It's more a philosophical question about what can a UI framework provide for UI stuff to make the life of developers easier. A build-in solution with no need to add more dependencies or custom css. Providing the power to make something awesome. See it as an idea and decide whether to close it or do it. ... I don't want to compare UI frameworks. So sorry that I notice Vuetify again. But I like the way to break imaginary blockages of the strict material design. In my opinion we should not follow incomprehensible restrictions when it's restricts our creativity and freedom. But maybe another topic. Back to this css request... :)

ionic-team / ionic-framework

feat: Complete CSS flex utilities by display and flex properties. #22469

Feature Request