feat: add dark mode for OcDatePicker

[AlexAndBear]

Description

Enables the dark mode for the date picker. Note this works with Chrome-Like browsers and Safari but not with Firefox

Related Issue

• Fixes Datepicker does not follow dark mode styling #1224

How Has This Been Tested?

• test environment:
• test case 1:
• test case 2:
• ...

Types of changes

• Bugfix
• Enhancement (a change that doesn't break existing code or deployments)
• Breaking change (a modification that affects current functionality)
• Technical debt (addressing code that needs refactoring or improvements)
• Tests (adding or improving tests)
• Documentation (updates or additions to documentation)
• Maintenance (like dependency updates or tooling adjustments)

[Copilot]

Pull Request Overview

This PR adds dark mode support to the OcDatePicker component, enabling the date picker to adapt its appearance based on the current theme. The implementation uses the color-scheme: dark CSS property to activate browser-native dark styling for date inputs.

• Added isDark prop to OcDatePicker component
• Integrated theme store across components using OcDatePicker
• Added CSS styling for dark mode date picker appearance

Reviewed Changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
packages/design-system/src/components/OcDatepicker/OcDatepicker.vue	Added isDark prop and dark mode CSS styling
packages/web-runtime/src/components/Modals/AppTokenModal.vue	Added theme store integration and isDark prop binding
packages/web-pkg/src/components/Modals/DatePickerModal.vue	Added theme store integration and isDark prop binding
packages/web-pkg/src/components/Filters/DateFilter.vue	Added theme store integration and isDark prop binding
packages/web-pkg/src/components/CreateLinkModal.vue	Added theme store integration and isDark prop binding
packages/design-system/src/components/OcDatepicker/OcDatepicker.spec.ts	Updated tests to include required isDark prop
packages/design-system/docs/components/OcDatepicker/handler.vue	Added isDark prop to documentation example
packages/design-system/docs/components/OcDatepicker/default.vue	Added isDark prop to documentation example

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[Copilot]

The filter: invert(0) rule appears to be a no-op since it doesn't change the appearance. Consider removing this rule or clarifying its purpose with a comment if it's intentionally preventing other filter applications.

Suggested change

filter: invert(0);

[AlexAndBear]

It does 😠

[AlexAndBear]

@JammingBen should I move the css to the tailwind component, even if there are no matching utility classes to apply ?

[JammingBen]

@JammingBen should I move the css to the tailwind component, even if there are no matching utility classes to apply ?

I'd say yes, or at least to the already existing style block to avoid having 2 style blocks.

[AlexAndBear]

@JammingBen should I move the css to the tailwind component, even if there are no matching utility classes to apply ?

I'd say yes, or at least to the already existing style block to avoid having 2 style blocks.

👍 adjusted