Andreas/wekan
1
0
Fork 0
mirror of https://github.com/wekan/wekan.git synced 2025-12-17 07:50:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Fix Due dates to be color coded and have icons. Part 2.

Browse source 
Thanks to xet7 !

Fixes #5950
This commit is contained in:
Lauri Ojansivu 2025-10-19 18:55:44 +03:00
parent dc78e3b7a0
commit 101048339b
2 changed files with 20 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

19
client/components/cards/cardDate.css
View file

@ -45,39 +45,42 @@
/* Date type specific colors */ /* Date type specific colors */
.card-date.received-date { .card-date.received-date {
background-color: #0079bf; /* Blue for received */ background-color: #dbdbdb; /* Light grey for received */
} }
.card-date.received-date:hover, .card-date.received-date:hover,
.card-date.received-date.is-active { .card-date.received-date.is-active {
background-color: #005a8b; background-color: #b3b3b3;
} }
.card-date.start-date { .card-date.start-date {
background-color: #3cb500; /* Green for start */ background-color: #90ee90; /* Light green for start */
color: #000; /* Black text for start */
} }
.card-date.start-date:hover, .card-date.start-date:hover,
.card-date.start-date.is-active { .card-date.start-date.is-active {
background-color: #2d8f00; background-color: #7dd87d;
} }
.card-date.due-date { .card-date.due-date {
background-color: #ff9f19; /* Orange for due */ background-color: #ffd700; /* Yellow for due */
color: #000; /* Black text for due */
} }
.card-date.due-date:hover, .card-date.due-date:hover,
.card-date.due-date.is-active { .card-date.due-date.is-active {
background-color: #e68a00; background-color: #e6c200;
} }
.card-date.end-date { .card-date.end-date {
background-color: #a632db; /* Purple for end */ background-color: #ffb3b3; /* Light red for end */
color: #000; /* Black text for end */
} }
.card-date.end-date:hover, .card-date.end-date:hover,
.card-date.end-date.is-active { .card-date.end-date.is-active {
background-color: #8a2bb8; background-color: #ff9999;
} }
.card-date.end-date time::before { .card-date.end-date time::before {
content: "🏁"; /* Finish flag - represents end/completion */ content: "🏁"; /* Finish flag - represents end/completion */

15
client/components/cards/minicard.css
View file

@ -200,30 +200,33 @@
} }
.minicard .card-date.start-date { .minicard .card-date.start-date {
background-color: #3cb500; /* Green for start */ background-color: #90ee90; /* Light green for start */
color: #000; /* Black text for start */
} }
.minicard .card-date.start-date:hover, .minicard .card-date.start-date:hover,
.minicard .card-date.start-date.is-active { .minicard .card-date.start-date.is-active {
background-color: #2d8f00; background-color: #7dd87d;
} }
.minicard .card-date.due-date { .minicard .card-date.due-date {
background-color: #ff9f19; /* Orange for due */ background-color: #ffd700; /* Yellow for due */
color: #000; /* Black text for due */
} }
.minicard .card-date.due-date:hover, .minicard .card-date.due-date:hover,
.minicard .card-date.due-date.is-active { .minicard .card-date.due-date.is-active {
background-color: #e68a00; background-color: #e6c200;
} }
.minicard .card-date.end-date { .minicard .card-date.end-date {
background-color: #a632db; /* Purple for end */ background-color: #ffb3b3; /* Light red for end */
color: #000; /* Black text for end */
} }
.minicard .card-date.end-date:hover, .minicard .card-date.end-date:hover,
.minicard .card-date.end-date.is-active { .minicard .card-date.end-date.is-active {
background-color: #8a2bb8; background-color: #ff9999;
} }
/* Font Awesome icons in minicard dates */ /* Font Awesome icons in minicard dates */