refactor(theme): use relative units for .dropdown-item

[spliffone]

See https://code.siemens.com/simpl/simpl-element/-/work_items/4

---

Documentation.
Examples.
Dashboards Demo.
Playwright report.

Coverage Reports:

• charts-ng
• dashboards-ng
• element-ng
• element-translate-ng
• maps-ng
• native-charts-ng

[gemini-code-assist]

Code Review

This pull request updates the dropdown item styling by changing block-size to min-block-size to ensure a minimum height while allowing for content expansion. Feedback was provided to use relative units (rem) instead of absolute pixels (px) for better accessibility and alignment with the project's goals.

[gemini-code-assist]

The pull request title specifies the use of relative units, but the implementation still uses an absolute pixel value (32px). To align with the PR's objective and improve accessibility (supporting browser font scaling), consider using rem units. 32px is equivalent to 2rem assuming a 16px base.

  min-block-size: 2rem;

[dr-itz]

block-size should either be natural (i.e. given by content) or a calc with font-size/line-height + padding

[spliffone]

@dr-itz Usually I do agree but this means we need to adjust various places:

• tabs
• select
• navbar
• menu
• typeahead
• application-header
• ...

Since the child elements sometimes contain text, text + icon, text + icon + badge, ... they all have different sizes. Before we simply set a fixed size so the padding was ignored and different combination resulted in the same size. Do you have an idea how to fix this issue efficiently?

[dr-itz]

see #1880