ionic-team / ionic-team/ionic-framework

feat: Expose token generating function for Material Design

Đang mở
#29,849 0 bình luận 0 reaction 0 người được giao Xem trên GitHub
type: feature request
Ngôn ngữ chính
TypeScript
Star
52.7k
Fork
13.3k
Merge trung bình
1 ngày 15 giờ
Pull request đã merge (30 ngày)
51

Mô tả

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already include this feature request, without success.

### Describe the Feature Request

Currently it is very tedious to theme ionic dynamically at runtime using for example a seed color. The functions required to do so are already there and used in the docs.

### Describe the Use Case

This is very common use-case as material design 3 (material you) has taken over android design system. Still ionic lacks behind for many years now, https://github.com/ionic-team/ionic-framework/issues/24282 was opened almost 3 years ago.

### Describe Preferred Solution

_No response_

### Describe Alternatives

For a while a have been using a hacky custom made lib - https://github.com/tanishqmanuja/ionic-color-injector. But an official alternative would allow for wider use cases.

Also then bridging the remaining gap using https://www.npmjs.com/package/@material/material-color-utilities would be awesome for users.

### Related Code

_No response_

### Additional Information

3 Categories of color token in ionic:
- Theme Colors (54 Tokens, 9 Colors with 6 Tokens each)
https://ionicframework.com/docs/theming/colors
Generator: https://ionicframework.com/docs/theming/themes#stepped-color-generator

- Application Colors (26 Tokens)
https://ionicframework.com/docs/theming/themes#application-colors
Generator: N/A

- Stepped Colors (38 Tokens, 19 for each background and text)
Ref: https://ionicframework.com/docs/theming/themes#stepped-colors
Generator: https://ionicframework.com/docs/theming/themes#stepped-color-generator

Source: https://github.com/ionic-team/ionic-docs/tree/main/src/components/page/theming
Core Functionality: https://github.com/ionic-team/ionic-docs/tree/main/src/components/page/theming/_utils

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.