Flush Inline embeds

[ishgunacar]

looks awesome! And hopefully if we get a way to distinguish between the embeds it will be even more useful. I put a feature request here: CSS classes for each embed type (page, heading, block)

[Klaas]

@1stprinciples: I don’t know if this is of interest:

/* eliminate scrollbars in transclusions */

.markdown-preview-view .markdown-embed-content, 
.markdown-preview-view .markdown-embed-content>.markdown-preview-view {
  max-height: unset;
}

[joeshirley]

So glad to have found this - thanks!

Do you have any solutions for also hiding the scrollbars in hover previews?

[Klaas]

@joeshirley: no, sorry, I don’t.

[joeshirley]

Ah well. Thanks for letting me know. If I figure out a solution I’ll add it here.

[Klaas]

@joeshirley: yes, please do because others may find it useful.

Yesterday I published my list of CSS snippets that you might find useful. It is nothing revolutionary, but you might pick up a thing or 2.

[joeshirley]

Posting a question in Discord to see if anyone has suggestions. BTW, this works great in Publish as well.

[matcoudert]

@joeshirley

iscord to see if anyone has suggestions. BTW, this works great in Publish as well.

hello,
Can I use this with a CSS snippet? Or should I change the css within my theme file please?
thanks for the help.

[welstand]

Is there a way to eliminate the title of block reference units? I guess I have read it somewhere (as a feature/css snippet request?), but I can’t figure out where. Help would be very much appreciated!

[Klaas]

@welstand: block references don’t have a title.

[welstand]

Right! So maybe it’s the title of the note in which the block reference is. I have to check it!

[Klaas]

Are you sure you mean block reference and not header reference?

[welstand]

@Klaas you were right! I’m sorry! I was referencing a section rather than a block. My bad!

[KaneDodgson]

Godsend this, thank you works a treat!!!

[Lulullia]

Hi! Do you still need a solution for this?

If yes, I’ve found that you can hide ALL scrollbars (including in hover previews) using a plugin called Hider.

It also allows to hide other stuff but you can choose what to hide (although, if you toggle “hide scrollbars” it will hide ALL of them throughout the whole app - I personally like it this way but it may be a con for some people).

Hope this helps!

[jubberwhacky]

Hey, thanks for the awesome css snippet, the overly large block references were a bit distracting!
I was also wondering if I can assign a different background color to the embed. That could give it a slightly better cue where the block starts and ends. Currently, it is a bit hard to notice where the block reference is by only looking at the link symbol.

[Moonbase59]

For all that read this late (the original post is a long time ago):

Meta Post - Common CSS Hacks

Clean Embeds: Create a nice-looking “Master Document” from its parts! Sometimes you want to construct a larger “master document” from its parts, say chapters. And it should look like it’s been made of one piece. None of the existing tips & tricks could fulfill this requirement, so I came up with my own. It is to be used with cssclass: clean-embeds in the frontmatter, so it won’t interfere with other pages that might use the “normal” type of embeds. A sample document could look like this (simpl…

Meta Post - Common CSS Hacks

Clean Embeds without cssclass @Klaas brought up the idea of having a Clean Embeds without requiring a cssclass because he wanted to use it for all his notes. Well, folks, here we go! Read about the original snippet, decide if you want it for all notes, and then use this code: Code: clean-embeds-all.css /* clean-embeds-all.css snippet Removes title, link, padding, margins from embeds, so they really look like the same note. This will not require a `cssclass` to be set but w…

[jubberwhacky]

Thanks very much, your posts were very helpful! (Also showing the link icon only on hover is neat). For everyone else wondering how it’s done, just add the following to the CSS snippet:

/* change background color, to exactly see what’s embedded */
.markdown-preview-view .markdown-embed,
.markdown-preview-view .file-embed {
  background-color: var(--background-secondary) !important;
}

Sorry for being late to the show (the last post was in April, tho), but why open up a new thread, if this one was right on topic

[Silvestris]

I’ve been trying this out, and of the flush inline options it seems to be the best. However, I’ve having an issue with newlines inside embeds being removed, as well as those between embeds. I’m not great with CSS, but I know the issue is under /* remove <br> between internal embeds */. Any ideas?

With that portion commented out:

With normal css:

Source for embed:

Edit: the same issues seems to apply to the preview on hovering.

[OttettO]

Hi I’m having a few problems, I don’t think this is really working for me. There is still a lot of space on the bottom of the block reference:

This is the referenced Note

Any ideas?