Query Control CSS adjustments

[nhanjkl]

Because of the thread here Live preview in backlinks, improvements to how they are displayed - #21 by efemkay has been close I’m gonna ask you here. Are you still using this CSS snippet? It’s not working for me (maybe because of the recent Obsidian 1.0 overhaul?)
Thank you!

[ariehen]

The Query Control plugin is no longer working in the Search tab or embedded search, perhaps that’s the issue?

There’s been a partial fix made to bring back some functionality:

Release a fix for Obsidian 1.2.5 · zhao414/obsidian-query-control

[nhanjkl]

Thanks for your help! I was indeed aware of the bug and have downloaded the fix. I haven’t wanted to do anything fancy, just trying to have markdown links rendered in the Backlinks pane and maybe adjusting the font size to make it look better.

[ariehen]

Adjust em as needed or use px, but this works:

/* adjust rendered (query control) font in Backlinks pane */
.mod-right-split .search-result-container .markdown-preview-view {
  font-size: 0.9em;
}

/* adjust rendered (query control) LINK font in Backlinks pane */ 
.mod-right-split .search-result-container .markdown-preview-view .internal-link {
  font-size: 0.9em;
}

[nhanjkl]

That’s great! Thanks a lot! Just tinker a bit with the backlinks pane not in sidebar and came up with this (Just tried and couldn’t find out how to change font in the sidebar ha ha).

.markdown-preview-view { 
    font-size: 13px;
}

Btw, do you know how to reduce the padding around the result? It’s way too much and I’d like more compact look to show more results without having to scroll as much.

For example this is with the Query Control plugin

And this is the core Backlinks plugin

And with the Query Control plugin + Markdown rendered we lose the yellow highlight in the results right?

[ariehen]

Adjusts the padding for embedded queries:

.internal-query .search-result-file-match {
  padding: 2px 2px 2px 2px;
}

20px

2px

---

For the highlights, if you choose renderMarkdown: true in the query, the highlighting goes away in the rendered content. There may be a way to bring it back, but would take some digging.

[nhanjkl]

Great! That helps with the padding for the query code block in notes. What would be the selectors for the padding for “backlinks in document”, “backlinks in sidebar”, and in the core Search plugin in sidebar too if possible? (Thank you again! I’m hyper-aware that I’m bugging you quite too much).

[ariehen]

This will take care of the padding results in the Backlinks tab:

.mod-right-split .search-result-file-match {
     padding: 1px 1px 1px 1px;
}

…and for the rendered Backlinks in document:

.embedded-backlinks .search-result-file-matches {
  padding: 1px 1px 1px 1px;
}

If you haven’t yet, have a look at FireIsGood’s CSS guide: Obsidian CSS Quick Guide. A lot of these selectors can be found with a bit of poking around with the inspector.