Formatting output of Obsidian Bases Core plugin (e.g. with CSS snippet)

Custom CSS & Theme Design
1

BTW: since “bases” is a generic name, research is difficult

What I’m trying to do

I want to slightly increase the font size in bases’ result table.

Things I have tried

Tried to export a note with Web HTML exporter to find out the CSS-classes for the result table. But Web HTML exporter does not export it (yet).

What I am looking for

How to determine the CSS-classes for bases’ result table so I can write a CSS-snippet to increase the font-size.
Or any other possibilty to achieve this goal.

2

I assume you mean the font-size displayed under the results of file name, file-path, created time, etc. Is that right?

3

Yes, plus the font-size of the column titles.

4

Got it, column header font-size as well. Just wanted to double check. Will have a look in a bit.

1 Like
5

In the default theme:

body {
    --bases-table-text-size: 1.1em;
}

will increase the Bases column header and results font-size a bit (adjust as desired).

If you want desktop and mobile (phone and tablet) to be slightly different, you could add in the second section here:

body {
    --bases-table-text-size: 1.1em;
}

body.is-mobile {
    --bases-table-text-size: 1.075em;
}

Lots of options, but hopefully that gets you headed in the direction you’d like. If there’s anything else, report back, and I or someone else can jump in.

UPDATE:

The variable changed to --bases-table-font-size: at some point.

1 Like
6

That’s exactly what I was looking for. Thanks for the quick response.

And BTW: I recently got permission to install Obsidian on my work PC, but without community plug-ins, which meant no Dataview. I dreamed of a suitable core plug-in, and just a few days later, there it was… :grinning_face:

2 Likes
7

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.