feat: add color property to cards and implement color selection feature

[luka-nextcloud]

• Resolves: Set individual background color of card #3592
• Target version: main

Summary

• Added a new color column to the deck_cards table.
• Updated the Card entity and service logic to handle the new color property.

Checklist

• Code is properly formatted
• Sign-off message is added to all commits
• Tests (unit, integration, api and/or acceptance) are included
• Documentation (manuals or wiki) has been updated or is not required

[github-actions]

🐢 Performance warning.
It looks like the query count of the integration tests increased with this PR.
Database query count is now 94744 was 93102 (+1.76%)
Please check your code again. If you added a new test this can be expected and the base value in tests/integration/base-query-count.txt can be increased.

[grnd-alt]

code changed is valid, great work!

I don't really like the layout though, I don't think the color picker should take up an entire row while being so small in width. Maybe we could put it in line with the due date selector or move into the three dot menu? maybe @marcoambrosini has a great idea?

just leaving some screenshots here that look weird because of themes:

text gets invisible if the card is the text color for the theme, might be hard to solve but as we support both light and dark mode it should always be readable for everyone.

the default color for the picker also makes it hard to see in light mode:

[luka-nextcloud]

@marcoambrosini @grnd-alt Please check this video:
demo.webm

[marcoambrosini]

Nice @luka-nextcloud, thanks for the screencast

A couple of changes I would make:

• move the button to the left of the card action menu

• Make the button square, size: var(--default-clickable-area)
• Add a tooltip to the button: "Choose card color"

[luka-nextcloud]

@marcoambrosini @grnd-alt We are using component NcAppSidebar to display card. And this component does not provide slot to show the button on the left of actions menu. However, there is a slot tertiary-actions which can display custom html on the left of card title. What do you think?

[marcoambrosini]

I would then add this as an action within the action menu itself, what do you think @luka-nextcloud ?

[luka-nextcloud]

@marcoambrosini Do you mean like this? It looks ok to me

[marcoambrosini]

Very nice, yes!