stargrey / obsidian-better-codeblock

Add title, line number to Obsidian code block
MIT License
109 stars 10 forks source link

Feature request: leading icons for filename-typed titles, and 2 bugs found #6

Open lethefrost opened 2 years ago

lethefrost commented 2 years ago

@lethefrost I'm a little confused about what you mean. Under what circumstances will there be a form like filename.extension? Could you describe it in detail?

This was actually a mistake on my part, but I didn't fix it because I thought these left blank spaces would indicate a collapsed section below the code block.

If you don't like it, you can put this code in style.css or your CSS snippets to close this effect

pre[class*=language-].code-block-pre__has-linenum {
  padding-bottom: 0px;
}

Originally posted by @stargrey in https://github.com/stargrey/obsidian-better-codeblock/issues/4#issuecomment-1144895080

Hi, Thank you for giving this css selector!

I am sorry that I might have not explained it clearly and caused you confusion. I made a screenshot to better describe a use case.

image

By the way, I just found two more bugs:

  1. Any title we add after the language indicator language:title will disable the code block language syntax highlighting in preview mode.
    • In live preview editor mode, the syntax highlighting is not affected by a :title following the language indicator (As in the attached screenshot below, in editor mode, the two kinds of title are both highlighted) image image
    • However, when we switch to preview mode, it is broken by having a title. image image
  2. If a line in the code block is very long to occupy the full width and triggers line wrap, the line number feature has a bug of alignment. Please see below. image
stargrey commented 2 years ago

That's a good idea, and I'll try to do it, but the icon might be a little hard to find. The first bug was fixed in 1.0.5. The second bug I have no idea for the moment, but you can use some themes that do not automatically line feed, like Blue Topaz.

lethefrost commented 2 years ago

That's a good idea, and I'll try to do it, but the icon might be a little hard to find. The first bug was fixed in 1.0.5. The second bug I have no idea for the moment, but you can use some themes that do not automatically line feed, like Blue Topaz.

Hi, thank you @stargrey for your work!

I found this great website to quickly look up the icons (supported by any nerd fonts) https://www.nerdfonts.com/cheat-sheet .

I am wondering for the second bug, if we could just refer to the way how the original editor line number of Obsidian.md work? I believe they handled the line-wrap problem very well.

lethefrost commented 2 years ago

That's a good idea, and I'll try to do it, but the icon might be a little hard to find. The first bug was fixed in 1.0.5. The second bug I have no idea for the moment, but you can use some themes that do not automatically line feed, like Blue Topaz.

Hi @stargrey , I found that the first bug is not fixed (I have v1.0.6 installed). Instead of bringing the syntax highlighting back in a titled code block, it turns to use the whole line as the language name, without parsing or extracting the :title section which should be shown in the top left corner.

stargrey commented 2 years ago

@lethefrost

Hi @stargrey , I found that the first bug is not fixed (I have v1.0.6 installed). Instead of bringing the syntax highlighting back in a titled code block, it turns to use the whole line as the language name, without parsing or extracting the :title section which should be shown in the top left corner.

To solve this problem, I modified the syntax used by the plugin. Check out readme.md and use the new syntax to add title, in addition to that, you can now add highlighted lines.

lethefrost commented 2 years ago

@lethefrost

Hi @stargrey , I found that the first bug is not fixed (I have v1.0.6 installed). Instead of bringing the syntax highlighting back in a titled code block, it turns to use the whole line as the language name, without parsing or extracting the :title section which should be shown in the top left corner.

To solve this problem, I modified the syntax used by the plugin. Check out readme.md and use the new syntax to add title, in addition to that, you can now add highlighted lines.

Hi, thank you for the explanation. Sorry for the late reply. It's very cool to have a new feature to highlight some lines of the code block!! I definitely love it. Thanks for the update!