Tooltips, Typography, Data & Intentionality



We use tooltips for various things:

  • variant readings
  • dictionary lookup
  • notes in tabular pages
  • extra bibliographical info in tabular pages

The role of tooltips is fairly minor in MD, and they are not supposed to use styled text. Oh, well, let’s be rebels.

We can use MD tooltips in the variants and dictionary lookup, there seems no other way of doing this.

As for the use in tabular pages, we can probably improve this.

For the extra bibliographic detail, this applies to vol/page info, so only shows when that is selected. We recently implemented a … to indicate that the text can be expanded. Why not, rather than a tooltip, use “show details on click”, something like:

Vaidya 1958a: 260–263; Speyer 1970b: 197–206

VAIDYA, P. L. 1958a. Avadāna-śataka (Buddhist Sanskrit Texts No. 19). Darbhanga: Mithila Institute. / SPEYER, J. S. 1970ab (1906). Avadānaśataka: A Century of Edifying Tales Belonging to the Hīnayāna, vols 1 & 2 (Bibliotheca Buddhica III). Osnabrück: Biblio Verlag.

As far as the notes go, in fact they mostly include info for specifying the exact parallels. In other words, they belong in our parallels data. We should check this, add any needed data to the parallels, and see if we can eliminate this category altogether.


Typography is one area where I don’t like MD all that much. There is too much space around headers and the like; the default font size is too small; and the line height too large. Anyway, we can use their proportions for UI, but as far as the text goes, we keep what we have, more or less. Obviously we will make sure they harmonize.

  • While MD guidelines say to use 13sp as the base body size for Desktop, this is too small. Use the Device size of 14sp. (Currently we use system default, which is usually 16px.)

  • If using MD body text specs, choose the maximum font size with the minimum line-height, usually 14sp with 20sp line-height.

We should stick with Skolar rather than Roboto; both SC and MD use Noto as fallback. However, we should use the sans pretty much everywhere except for the text pages, where we use serif. Note that when we first built SC, the sans was not available.

MD has a rather eccentric use of font weights. Normally you’d have 400 (regular) and 800 (bold). A semi would be 600. But they use a 500 weight (Medium). This gives a subtle shift in certain cases. We can do this with Skolar if we like, though not with Noto where that is used. Probably it is not necessary.

Skolar serif is a little heavier than the sans, so it can be used to provide a subtle emphasis, similar to the Medium weight. However, the main use of the serif is to indicate the text, as opposed to the UI, data, etc.

In flat buttons, use all caps bold.

We should take care to implement the i18n guidelines.

Data and Intentionality

Data should be prefetched thoughtfully. We should not hit the user with large and unexpected downloads, however we can prefetch certain data when it:

  • is not too much
  • will help the user

The data for the nav drawer can be prefetched when arriving at the Home page, or on any other page.

  • Load all, or just the suttas?

When opening a division view, should we;

  • Load at the time?
  • Prefetch the descriptions, etc?
  • When do we fetch the parallels data?

Ideally we would prefetch all the data usable in the Tabular pages, leaving out only the text pages and static pages. But we have to see whether that is feasible.

Generally speaking, texts should not be prefetched. The data is too great, and the predictability too low, for this to be useful. But for full offline use, we give the user the choice to download all texts in languages of their choice. The dialogue for this should be:

  • Download texts to use offline →
  • Interface English 🞃
  • Texts English 🞃 (Approximately 100 MB)
  • Once selected, give option for other languages.
  • Include original texts? Y/N (Approximately 210 MB)
  • Time
    • Download now :ballot_box_with_check:
    • Download when connected to wi-fi :ballot_box_with_check: