Custom Setting to limit Query Table Block Width to XX number of characters

Feedback Feature Requests
1

In Table View, the first column (Block) shows the whole Block Title and, for Blocks where the Title is also the Body of the Block (there is no Soft-Break where the bulk ok the Block is in separate paragraphs) the Query Results Table is so wide you have to use the scrollbar a lot of distance to see other properties.

I would find it more useful if Logseq would allow the option to limit columns to a maximum number of characters, either a single number somewhere in config.edn or even on a per-property basis in the same overlay pop-up where you can toggle on and off the visibility of the properties in the table (from the settings properties cog of the results table).

Is there maybe any way to achieve this besides waiting for a feature request to be voted and devs to consider it important?

2

What about instead of limiting the long text, to wrap it with something like this?

.custom-query-results {
    white-space: pre-wrap;
}
3

Hmm, how is that limiting the width of the columns?
FYI the above doesn’t seem to make a difference, I still have the whole text in the Block Title in the Block Column and a scroll bar that I can take to the last column in the results table…

As far as I understand, the code above should make the columns word wrap and still show the whole block title text? So making the rows larger on the vertical side to accommodate the text…

4
  • Try adding the following in file custom.css :
    .custom-query-results td.whitespace-nowrap div {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 16ch;
}
  • Adjust max-width to the desired number of characters.

EDIT: Replace .inline.mr-1 with div

5

still not making a difference here :frowning:

6

It works to me. As a general comment, whenever people offer a solution, they imply that it works to them. If it doesn’t work to you, it doesn’t help to simply mention it. If you are interested in a follow-up, you should provide any information that may help.

7

ok, sorry… I have no idea where to look or how to troubleshoot.

When I save the custom.css with your code and switch fast to Logseq, i see the Query-Results gain a bit of height but they remain the same.

image
image1649×850 277 KB

8

Blindly playing around: (I removed .inline.mr-1)

image
image1292×612 153 KB
`

Maybe the blue (links) properties can be made to stick to the right, under their column headers?

… hmm… for larger max-widths the Page, Status, etc properties overflow on a second line …
Aslo when I open this in the right sidebar which is narrow, I get this overflow where headers are left where they are while the values are overflown on another row …

image
image1294×146 34.6 KB

9

Try replacing .inline.mr-1 with div .

  • i.e. .custom-query-results td.whitespace-nowrap div {
10

Much better. Can the width be made in percentages so it accommodates to wherever the query is opened into (right sidebar, center pane with T W off, Logseq App not in FullScreen mode etc)?

It doesn’t work for me in percentages but maybe there’s another way to achieve this …

Another question please: Can the “cell” of the Block text actually be made higher so the text can wrap just as it would in en Excel Table?

11

Could use a separate rule for each pane, by prefixing the pane’s id or class, e.g.:

#right-sidebar .custom-query-results td.whitespace-nowrap div {
  max-width: 8ch;
}
12

Add white-space: pre-wrap;

13

We’re getting somewhere :slight_smile: This is nice already. There doesn’t seem to be a max-height though … so I can limit a block that is 5 sentences long (I would like max 3 rows of text in that space).

Edit: my bad, I had a typo :see_no_evil:

The CSS code I ended up with is:

.custom-query-results td.whitespace-nowrap div{
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 50ch;
  white-space: pre-wrap;
  max-height: 7ch;
}

It’s not perfect in the sense that it doesn’t dynamically adjust with different widths but it’s way better than where I started at.

Thanks @mentaloid.

1 Like
14

I’d recommend the plugin Another Embed, it has the capability to adjust table column widths (both markdown tables and query tables).

1 Like