Hi!
I’ve found a post that helped me in obtaining a table for showing the remaining days for a deadline.
But how can I show that the deadline has passed? Maybe also using a different formatting than the other deadlines
Thanks a lot in advance
Hi!
I’ve found a post that helped me in obtaining a table for showing the remaining days for a deadline.
But how can I show that the deadline has passed? Maybe also using a different formatting than the other deadlines
Thanks a lot in advance
Could you share some of the code you’re currently working with so that folks can have an entry point to helping you out?
Without some idea of what you’re already doing, this question is too vague to get useful answers.
Sure!
This is the query, let me know if I can give further explainations
(scadenza mean deadline, tipo and Cosa are just for explaining what’s the deadline refer to)
```dataview
TABLE dateformat(scadenza, "yyyy.MM.dd") AS Scadenza, tipo AS Cosa, (scadenza - date(today)) as "Giorni rimanenti"
WHERE scadenza
SORT (scadenza - date(today)) ASC
The following is untested, but I think it should work. The idea is to instead of doing the deadline calculation in the sort and/or column view, we make it into a field by using FLATTEN
, and then we can also do WHERE
clauses on it.
```dataview
TABLE dateformat(scadenza, "yyyy.MM.dd") AS Scadenza, tipo AS Cosa, daysToDeadline as "Days past deadline"
FLATTEN (scadenza - date(today)) as daysToDeadline
WHERE scadenza AND daysToDeadline < 0
SORT daysToDeadline ASC
```
You might want to add better text and names to stuff (or change sorting), but you get the gist of the idea.
Thanks a lot: I’ll check your solution as soon as possible
It works and is nice to see (anyway I’ll try to make some modification for my tastes )
Is there any way to show (maybe even with a color) how many days past the deadline?
Here is a sample thingy, showing how to color based on a number:
```dataview
TABLE WITHOUT ID
tmp[0] as Thingy,
"<span style='color: " + color + "'>" + tmp[1] + "</span>" as Deadline
FLATTEN list(
[ "OK", 5 ],
[ "Today", 0 ],
[ "Yesterday", -1 ],
[ "Many days ago", -5 ]
) as tmp
FLATTEN
choice(tmp[1] > 0, "green",
choice(tmp[1] = 0, "yellow",
choice(tmp[1] = -1, "orange",
choice(tmp[1] < -1, "red", "blue")))) as color
WHERE file.name = this.file.name
```
Put that into a note of its own, and switch to live preview or reading view, and watch the magic unfold.
One could also try using background-color:
instead of color:
. Either of these will however only just color the deadline text. If you want to color the entire cell (or similar), you’ll need to get a little more creative and use CSS snippets, and tagging the cell according to your choices.
Some other comments related to my test query:
FLATTEN list ...
(and WHERE ...
clause), with something which make sense in your case. And that also goes for using tmp[1]
, where you would rather use `daysToDeadline``choice()
is choice(test, true, false)
, which I’ve daisy chained, so if you want to add or remove options, there are two things you need to watch out for:
)
at the end to match the number of choices.To achieve this one should change the query to something like:
```dataview
TABLE WITHOUT ID
tmp[0] as Thingy,
"<span class='" + cellClass + "'>" + tmp[1] + "</span>" as Deadline
FLATTEN list(
[ "OK", 5 ],
[ "Today", 0 ],
[ "Yesterday", -1 ],
[ "Many days ago", -5 ]
) as tmp
FLATTEN
choice(tmp[1] > 0, "cellOK",
choice(tmp[1] = 0, "cellWARN",
choice(tmp[1] = -1, "cellLATE",
choice(tmp[1] < -1, "cellVERYLATE", "")))) as cellClass
WHERE file.name = this.file.name
```
And then install some CSS-snippet like the following into vault/.obsidian/snippets/cellColors.css
, and then go to Settings > Appearance > CSS Snippets and enable the “cellColors.css”:
.markdown-rendered .dataview td:has(.cellOK) {
background-color: var(--color-green);
color: black;
}
.markdown-rendered .dataview td:has( .cellWARN ) {
background-color: var(--color-yellow);
color: black;
}
.markdown-rendered .dataview td:has( .cellLATE ) {
background-color: var(--color-orange);
color: black;
}
.markdown-rendered .dataview td:has( .cellVERYLATE ) {
background-color: var(--color-red);
color: black;
}
I’m not the best in color stuff, but using the Minimal theme, and the code above, my list now shows up as:
Note that this trick of doing td:has(.className)
is a universal trick where we now can target a higher level element, whilst using a lower element to select the former. Thusly, we can change table rows and/or cells, using some marker within the cell. This does require for a recent installer version above 1.0.0…