Code blocks nested in lists render in editor as if at top-level

Steps to reproduce

In a note, enter the following:

* Here is a list item

  ```text
  Here is a code block within that list item
  ```

Expected result

I’d expect to see the code block rendered in the editor in a way that makes it clear the block is nested inside in the list, i.e. in a manner consistent with the preview view, which gets this right.

Actual result

The code block is rendered with a background that isn’t indented, making it appear that the code block is a top-level item which happens to contain code where every line is indented.

Screenshot:

Environment

  • Operating system: MacOS 10.14.6
  • Obsidian version: 0.6.4
  • Using custom CSS: no

Additional information

Here’s a screenshot of the preview view getting the rendering right:

Here’s a similar bug report: Syntax highlighting is broken for block quotes in bulleted lists — but I think it’s probably a different case.

5 Likes

2 posts were merged into an existing topic: Live Preview: Support code blocks in lists

I have this issue too, although in my case Obsidian fails to render indents altogether. I am on Windows 10 version 0.8.13.

@s-kyy, @gimboland would you mind checking whether you still have this issue in your builds?

editor mode works fine

preview mode eradicates indents

expected behaviour
preview and editor modes match.

I think in @flatline 's case you have to un-indent your lines like so:

**Title**
- Workflow
    - HTML
    - CSS
    - etc

Instead of indenting under the Title line like you did in your editor mode.

**Title**
    - Workflow
        - HTML
        - CSS
        - etc

The original post has a separate problem.

1 Like

Thanks @s-kyy, I’ll try that out.

Update yes, user error!

How about in numbers lists? When I use the following setup:

1. Step one, this is the fist step
2. Step 2, do some code
```bash
    curl -V google.com
```
  3. I would like this to continue automaticlly, I had to insert `3.` at the beginning to continue the list. If I would add a new step after step 2 then step 3 would not be upped to 4

This breaks the numbering and renders the blok as top level:

Screenshot 2020-10-13 at 22.24.38

What I would like to see happen is that if I use a code blok in list that it ‘respects’ the list and renders in the list level like:

Screenshot 2020-10-13 at 22.26.08

Using build v0.9.4 on macOS

2 Likes

Ill re ask this question in a different way:

How do I do code block is a numberd list without breaking te list?

If I do:

1. One
2. Two
\```yaml
Dit is code
\```
1. This breaks the list

(Also, the code block is wider then the list)

1. One
2. Two
	```yaml
	Dit is code
	```
3. This breaks the list
2 Likes

This issue still exists in version v0.15.9.

For example, the following markdown code:

- Test

	```lisp
	 (unless (server-running-p)
	   (server-start))
	```

The current obsidian shows in editing (live preview) mode:

image

Obviously, the code block is not indented

The current obsidian shows in reading mode:

image

The rendering behavior of reading mode is correct.

P.s. Typora is correct in its editing mode:

image