Disable highlight of "cm-preview-code-block" (code block ```tx.) when hovered over

What I’m trying to do

I am trying to disable this border which appears when I hover over the code block ```tx.

Things I have tried

I have retrieved a class name of this element via ctrl shift s, tried to apply a transparent border via css snippets, however it does not change anything. I also tried messing with margin and padding but no awhail

I also tried using !important, but it did not help
изображение

I believe box-shadow: none; is what you need to set instead of border.

(I’m not at a PC right now to be able to confirm though)

I also think box-shadow is the culprit here. Is the ```tx code block being rendered by a community plugin?

You could try

body {
    --embed-block-shadow-hover: 0; /* default: --embed-block-shadow-hover: 0 0 0 1px var(--background-modifier-border) */
}

For Dataview blocks in my vault, this works as well in removing the shadow. If the above doesn’t work, you could try this one.

.markdown-source-view.mod-cm6 .cm-embed-block:not(.cm-table-widget):hover {
    box-shadow: unset;
}

Moved to custom CSS.

1 Like

I appreciate your assistance. This code worked flawlessly. Also I managed to make it work only for ‘’'tx containers by writing down.

.cm-preview-code-block{
–embed-block-shadow-hover: 0;
}

By the way, if you are a moderator, could you please fix some silly spelling / factual mistakes in the original question, I should have writeen “Ctrl + Shift + I” instead of the “ctrl shift s” line. The time in the following sentence should also be changed. And avail instead of awhail :skull_and_crossbones:

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