docs(date-picker): 收窄 align demo 输入框，清晰展示左中右对齐效果

[Georgyhongbo]

PR Checklist

Please check if your PR fulfills the following requirements:

• The commit message follows our Commit Message Guidelines
• Tests for the changes have been added (for bug fixes / features)
• Docs have been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

• Bugfix
• Feature
• Code style update (formatting, local variables)
• Refactoring (no functional changes, no api changes)
• Build related changes
• CI related changes
• Documentation content changes
• Other... Please describe:

What is the current behavior?

date-picker 的 align demo 展示了 left / center / right 三种对齐方式，但 demo 容器宽度为 360px，恰好等于日期面板的默认宽度（主题变量 --tv-DatePanel-width: 360px）。当面板与输入框等宽时，三种对齐的偏移校正结果在几何上完全相同（bottom-start、bottom、bottom-end 均等于 reference.left），用户无法观察到对齐差异，demo 失去展示意义。

Issue Number: N/A

What is the new behavior?

将 demo 输入框容器宽度从 360px 收窄到 240px，与面板默认宽度产生 120px 的宽度差，使三种对齐方式清晰可辨：

• align="left"：面板左边缘与输入框左边缘对齐
• align="center"：面板与输入框水平中线对齐
• align="right"：面板右边缘与输入框右边缘对齐

该改动仅影响 demo 展示（docs 站点），使用 scoped 样式，不影响组件库代码、主题样式及既有 E2E 测试（align.spec.ts 仅断言面板的 x-placement 属性，与宽度无关）。

Does this PR introduce a breaking change?

• Yes
• No

Other information

N/A

Summary by CodeRabbit

• Style
  • Adjusted the date-picker demo layout to use a narrower wrapper for improved presentation.
  • Added clarification to explain the updated layout sizing.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 06375fb2-3723-42df-acfd-a5a8663dd5c9

📥 Commits

Reviewing files that changed from the base of the PR and between b9004f0 and e9cb56b.

📒 Files selected for processing (1)

• examples/sites/demos/pc/app/date-picker/align.vue

---

Walkthrough

The date-picker demo wrapper width changes from 360px to 240px. A comment explains that the input is narrower than the panel.

Changes

Date-picker demo

Layer / File(s)	Summary
Narrow wrapper styling examples/sites/demos/pc/app/date-picker/align.vue	The wrapper width changes to 240px. A comment describes the narrower input relative to the panel width.

Estimated code review effort: 1 (Trivial) | ~2 minutes

Suggested reviewers: shenjunjian

Poem

A rabbit trims the wrapper wide,
From three-sixty down inside.
The panel keeps its roomy view,
While inputs stay neat and true.
Hop, hop—alignment shines anew!

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly describes narrowing the date-picker align demo input to show left, center, and right alignment effects.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}