ionic-team / ionic-team/ionic-framework

bug: Can't set the active wheel item text color for ion-datetime

Abierto
#30,837 0 comentarios 0 reacciones 0 asignados Ver en GitHub
package: angular package: core type: bug
Lenguaje dominante
TypeScript
Estrellas
52.7k
Forks
13.3k
Merge medio
1 d 15 h
PR fusionados (30 d)
51

Descripción

### 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 report this problem, without success.

### Ionic Framework Version

v8.x

### Current Behavior

I am trying to set the text color of the ion-datetime current time item,

Looking at the documentation, I should be able to use the `::part(wheel-item active)` to do this. In the linked example, I have set this to red, whoever, it is not being applied.

I have the following in `global.scss`

```
ion-datetime::part(wheel-item active) {
color: red !important;
}
```

Image

### Expected Behavior

I would like to be able set the highlight color of the selected time item

### Steps to Reproduce

1. Get the sample at https://github.com/pjc2007/date-time-issue
2. Click SHOW DATE TIME PICKER

Image

3. Click on the time

Image

4. Click in the time picker

Image

The red as set in `global.sccs` is not being applied.

### Code Reproduction URL

https://github.com/pjc2007/date-time-issue

### Ionic Info

$ ionic info
[WARN] Error loading @capacitor/ios package.json: Error: Cannot find module
'@capacitor/ios/package.json'

Require stack:
- C:\Users\Peter\AppData\Roaming\npm\node_modules\@ionic\cli\lib\project\index.js
- C:\Users\Peter\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js
- C:\Users\Peter\AppData\Roaming\npm\node_modules\@ionic\cli\index.js
- C:\Users\Peter\AppData\Roaming\npm\node_modules\@ionic\cli\bin\ionic
[WARN] Error loading @capacitor/android package.json: Error: Cannot find module
'@capacitor/android/package.json'

Require stack:
- C:\Users\Peter\AppData\Roaming\npm\node_modules\@ionic\cli\lib\project\index.js
- C:\Users\Peter\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js
- C:\Users\Peter\AppData\Roaming\npm\node_modules\@ionic\cli\index.js
- C:\Users\Peter\AppData\Roaming\npm\node_modules\@ionic\cli\bin\ionic

Ionic:

Ionic CLI : 7.2.1 (C:\Users\Peter\AppData\Roaming\npm\node_modules\@ionic\cli)
Ionic Framework : @ionic/angular 8.7.5
@angular-devkit/build-angular : 20.3.4
@angular-devkit/schematics : 20.3.4
@angular/cli : 20.3.4
@ionic/angular-toolkit : 12.3.0

Capacitor:

Capacitor CLI : 7.4.3
@capacitor/android : not installed
@capacitor/core : 7.4.3
@capacitor/ios : not installed

Utility:

cordova-res : not installed globally
native-run : 2.0.1

System:

NodeJS : v22.17.1 (C:\Program Files\nodejs\node.exe)
npm : 10.9.2
OS : Windows 10

### Additional Information

Not sure if this is affected due to being inside a modal?

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.