Questions about some variables in Theme

TaskPaper
1

@jessegrosjean, I started working in the tutorial. I thought it was going to be faster, but it turns that the days off I have because of the flu are turning not to be as productive because of the flu :slight_smile: Anyway, here are my first set of question and they are about the variable @ui-scale

I noticed that things like the size of the handle and tabs are modified when we change this variable, but I would like to know,

  1. What elements are affected by the variable ‘@ui-scale’?
  2. I also noticed that sometimes @ui-scale and @base-font-size are not part of some themes.
    a. What happens then?
    b. Do you have this ratio preset somewhere else in your code?
2

It falls back onto the base theme, which is listed in the user guide. It’s also at /Applications/TaskPaper.app/Contents/Resources/base.less on your machine.

3

I figured something like that happened. Thanks. Now, do you happen to know the answer to my first question?

4

Not off hand, no. Let’s see what @jessegrosjean says. :smile:

5

For 99% of the cases you just need to look in the base.less stylesheet discussed earlier in this thread. Over time I’ve been scaling more style elements. But the most up-to-date list of what’s being scaled can always be extracted from base.less. The goal is for all sizes to scale. So when you do View > Zoom In the entire UI scales proportionate to the font.

Of course there’s always an exception. The one place that I know of where I’m using ui-scale outside the stylesheet is when I draw the drag and drop indicator. (The long line with the circle on the end). In that case the circle size and line with is scaled using ui-scale.

They are always part of all themes. All user themes just overriding my base theme, they can override rules, but they can’t undefined variables such as @ui-scale. I guess a theme could do @ui-scale: null, probably bad things would happen :).

Or maybe you mean… in the base theme, for example, item-indent is setup to scale with @ui-scale. But it’s possible for a user theme to override that rule and set item-indent to an absolute value that doesn’t scale. That’s fine, the value just won’t scale in that case. But @ui-scale is still present in the stylesheet, just not being used for that particular rule.

Not sure if that’s what you mean… send again if I didn’t understand.

6

/Applications/TaskPaper.app/Contents/Resources/base.less on your machine.

Sorry. I was looking at the base.less provided in the documentation, and there was a disconnect between what I was seeing modifying that and what I was reading. I just opened the base.less in the app itself and everything is clearer now :slight_smile: Thanks!

1 Like
7

Ahh :smile:. I haven’t put the 3.1 base.less in the docs yet. Will wait until that version is out of Preview.

8

Okay, I notice in the new base.less that there is a new variable in the editor.
ui-scale: @ui-scale;
Why was that added? What is that doing internally?

9

That’s actually there for that one case where I use @ui-scale to scale the drop indicator. Doing it that way makes it easy for me to read out the value. I’m not likely to documental that property though as it’s rather on the implementation side of things.