Conditional targeting elements in theme?

TaskPaper
1

Hello. Perhaps there is something I missing here but I would like achieve something like this.
I have one tag priority with three possible values (1) (2) and (3) and I want different colors for them. Not for the values but also for tags so it would be priority(1) eg. red priority(2) yellow etc.

I’ve tried different nesting, un-nesting, combining selectors and still no luck. Any help, because I am lack of ideas? :frowning:

2

I think this will do what you want.

First here’s a test document:

one @p(1)
two @p(2)
three @p(3)

And then these rules will color each of those tags separately, depending on the associated value.

item[data-p="1"] {
  > run[tag="data-p"] {
    color: red;
  }
}

item[data-p="2"] {
  > run[tag="data-p"] {
    color: green;
  }
}

item[data-p="3"] {
  > run[tag="data-p"] {
    color: blue;
  }
}

Here are a few more related style rules for the example document:

// Just color tag name part of tag.
run[tagname="data-p"] {
  color: green;
}

// Just color tag value part of tag.
run[tagvalue="1"] {
  color: yellow;
}
3

Brilliant. It works.
This would be nice to update documentation for next release,
for me it was not obvious that tag value belongs to tag the same way task belongs to project.

And there is also undocumented option for targeting specific depth e.g. item[depth=2] targets item indented once.

4

Is it also possible to make a comparison for conditional formatting of dates?

Something like the following:

item[data-start<=today] {
color: green;
}

This could be cool for dimming tasks that are unavailable.

5

You can use greater/less than conditions, but you need to write out the full date, “today” won’t get automatically expanded as you would hope. Eventually I’d like to solve this use case with a script, but not there yet.

6

I can’t seem to get the greater/less than conditions to work. Can you give an example?

7

Sorry about that I wasn’t remembering how it worked.

The supported operations are:

  • = – Equal
  • ^= – Begins with
  • *= – Contains
  • $= – Ends with
8

So it only works with strings and can’t make numerical comparisons. Any plans to add that possibility?

9

I don’t have any immediate plans. I’m trying to stick with how CSS/LESS works, which to my knowledge right now is that it’s just strings. Generally I think that solving this sort of problem (highlight overdue items) is better done with a script. I don’t know when, but I expect this would eventually be built in.

I hope to look into this more in the next weeks as I add Reminders.app integration. Then I’ll have lots of due dates to experiment with.