[jakub-przepiora]

What

Checkboxes in the HR forms were not level with their labels, and some sat side by side at
different heights.

• In the worker form, Active and Logistics operator now stack on their own rows instead
  of sitting side by side at different heights.
• Every checkbox label in the app (not just HR) now sits level with its box; a label that
  wraps on a narrow screen keeps the box on its first line and stays left-aligned instead of
  centring under the box.
• Long skill names in the worker form and in the "Employee profile" section of the user
  account form now wrap instead of pushing the skill-level dropdown off narrow screens.

Why

The shared Checkbox component centred its box and label vertically and didn't give the
label a fixed line height, so a one-line label could sit slightly off from the box, and a
wrapped label re-centred itself under the box instead of staying aligned with it. The worker
form additionally laid two checkboxes out in a row, so they drifted apart whenever one label
wrapped before the other.

How it was verified

This is a CSS-only layout change with no new routes, inputs, or business logic, so no new
Laravel tests were added; the existing test suite covers these pages' other behavior
unchanged. Click-through demo recorded by an independent QA agent on a fresh instance — see
Demo below.

Review notes

• The Checkbox component change affects every checkbox in core (55 uses across 27 files,
  plus the data table's small variant) because the fix lives in the shared component. All
  existing labels are plain strings, so the new fixed line height cannot clip any markup.
• This branch also carries two unrelated, pre-existing housekeeping changes: raising the
  PHPUnit memory limit to 1G (backend/phpunit.xml) to match the pre-commit hook's suite run,
  and stopping tracking of committed Python bytecode under .claude/skills (.gitignore plus
  two cleanup commits). Both are harmless but outside the scope of this fix.
• No automated test guards the alignment itself (no unit/snapshot test on the component's
  layout classes); acceptable for a CSS-only change already covered by the click-through
  demo and manual review.

Demo

Recorded by an independent QA agent clicking through a fresh instance (login → menu → change). No API calls, deep links or injected data — enforced by demo-guard.mjs.

▶️ Full-quality video (MP4)

Screenshots, step by step

after login

workers list

desktop new worker unchecked

desktop new worker toggled

worker created

desktop edit worker

desktop new account

desktop worker profile

mobile new account

mobile new worker

mobile new worker toggled

Screenshots and all evidence files

[coderabbitai]

Important

Review skipped

Auto reviews are limited based on label configuration.

🏷️ Required labels (at least one): 1

• cla-signed

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

• Source mode: Auto
• Repository: Mes-Open/OpenMes
• Branch: develop
• File: .coderabbit.yaml
• Commit: a4668cb
• Layers: Repository YAML
• Review profile: CHILL
• Plan: Advanced
• Run ID: fe221eb2-3ba5-40dd-a818-e7f9cce43b96

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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.}