material-components / material-components/material-components-android
[Time picker] Presumably wrong time input field separator size
Nobody has claimed this yet.
- Dominant language
- Java
- Stars
- 17.4k
- Forks
- 3.2k
- PR merge metrics
- No merged PRs in 30d
Description
**Description:** Full description of issue here
The separator of the time input for the time picker is slightly too big. This results in a non centered oversized colon. For comparison in [time picker specs](https://m3.material.io/components/time-pickers/specs):
Time picker:
- Time picker time selector label text size: 57
- Time picker time selector separator size: 57
Time input:
- Time input time input field label text size: 45
- Time input time input field separator size: **57** but should be **45** (see number 2 in image)
**Expected behavior:** Screenshots and/or description of expected behavior
The colon / separator should have the same font size as the label text, so that it is shown vertically centered.
**Source code:** https://github.com/material-components/material-components-android/blob/0d265b7ca54f9aedd3d3a1709dbee8a44c261384/lib/java/com/google/android/material/timepicker/res/values/tokens.xml#L51-L60
https://github.com/material-components/material-components-android/blob/0d265b7ca54f9aedd3d3a1709dbee8a44c261384/lib/java/com/google/android/material/timepicker/res/values/styles.xml#L130
https://github.com/material-components/material-components-android/blob/0d265b7ca54f9aedd3d3a1709dbee8a44c261384/lib/java/com/google/android/material/timepicker/res/values/themes.xml#L35-L36
There should be a value for `@style/Widget.Material3.MaterialTimePicker.Button.Divider`.
**Minimal sample app repro:** Every sample of time picker will do it.
**Android API version:** This concerns the Material Spec and not Android specifically.
**Material Library version:** 1.12.0
**Device:** Every
To help us triage faster, please check to make sure you are using the [latest version](https://github.com/material-components/material-components-android/releases) of the library.
We also happily accept [pull requests](https://github.com/material-components/material-components-android/pulls).
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the referenced tokens.xml, styles.xml, and themes.xml files, then compare the time input separator styling with the Material time picker specifications. Verify the separator uses the same size as the time input label and visually check a sample time picker on completion.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- android
- Domain
- design, mobile
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 55/100