Skip to content

Conversation

@raimund-schluessler
Copy link
Contributor

@raimund-schluessler raimund-schluessler commented Jul 28, 2025

☑️ Resolves

  • Adjusts the inline end padding for the NcDateTimePicker input field, so that less space is wasted if no clearable button is present.

🖼️ Screenshots

🏚️ Before 🏡 After
grafik grafik
grafik grafik

🏁 Checklist

  • ⛑️ Tests are included or are not applicable
  • 📘 Component documentation has been extended, updated or is not applicable
  • 2️⃣ Backport to stable8 for maintained Vue 2 version or not applicable

Signed-off-by: Raimund Schlüßler <raimund.schluessler+nextcloud@mailbox.org>
Signed-off-by: Raimund Schlüßler <raimund.schluessler+nextcloud@mailbox.org>
@raimund-schluessler raimund-schluessler added enhancement New feature or request 3. to review Waiting for reviews feature: datepicker Related to the date/time picker component design Design, UX, interface and interaction design labels Jul 28, 2025
@raimund-schluessler raimund-schluessler added this to the 9.0.0-rc.6 milestone Jul 28, 2025
@raimund-schluessler raimund-schluessler marked this pull request as ready for review July 28, 2025 09:16
Copy link
Contributor

@Antreesy Antreesy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good. Please squash commits and add a clearable prop in any example

}
.vue-date-time-picker--clearable :deep(.dp__input) {
padding-inline-end: var(--default-clickable-area);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should be not just update the --dp-input-padding variable here?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You mean like this?

Suggested change
padding-inline-end: var(--default-clickable-area);
--dp-input-padding: 6px var(--default-clickable-area) 6px 12px;

This should also work, I don't have a preference here, honestly.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

but also if 6px/12px will change, we have to update in in both places. -inline-end is limiting changes

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My reasoning was just that the variables are public API but the class names could break someday.

@susnux susnux merged commit 3d7b22c into main Jul 28, 2025
27 checks passed
@susnux susnux deleted the fix/noid/datetimepicker-input-padding branch July 28, 2025 13:01
@Antreesy Antreesy mentioned this pull request Aug 19, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

3. to review Waiting for reviews design Design, UX, interface and interaction design enhancement New feature or request feature: datepicker Related to the date/time picker component

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants