Less for links


#1

I am trying to adjust my links text in TaskPaper. Its about as clear as mud right now. I prefer using the color style statement as “mix(green, beige, 12%)” rather than - “rgb(70%,84%,99%)”. Not knocking anyone else preference, just stating my own.

I looked at an example from @macdrifter that used “@link-color: #3974cb;” which suggests that I should be able to do this also. But, I cannot. Usually in the less file in TaskPaper that would mean that another code is preceding this function.

With some trial and error I can see that the tint-color statement when altered does affect the links text. But, it is anything but a straightforward color change. Which is telling me that this tint is affecting or is affected by another parameter and by changing the color here - I am only changing it as a percentage of something else.

I would also like to make the linked text smaller and change it’s font. But, using this method even when successful is not going to allow me to write code similar to how I can do this using a tag. Or, have I missed something here?

Using @tint-color: rgb(111,111,111); gives me a nice light grey which is acceptable for my link text.

Using @link-color: rgb(111,111,111); does nothing at all.

Wanting to do something like this:

item[data-link] {
color: rgb(111,111,111);
font-style: italic;
font-size: 20;
}

Testing this near the end of the less file and it neither works or blows it up.
I think I have come across this accidentally so I am guessing it is possible to set up a custom value for my links text. But I can’t see how right now.

Thanks


#2

In an empty stylesheet this is how you can change the link color as I think you want:

run[link] {
  color: mix(green, beige, 12%);
}

run[link^="button"] {
  color: @text-color;
}

run[link^="filter"] {
  color: @text-color;
}