Add margin above and below codeblocks when they're a child of a list element.

[johnnymatthews]

Problem

Here is some common GitHub flavored markdown:

2. Once you have downloaded the binary file, extract the contents to a directory of your choice. For example, if you are using Linux, you can extract the contents to the `/usr/local/bin directory` by running the command:

    ```sh
    sudo tar -C /usr/local/bin -xzf lotus-X.X.X-linux-amd64.tar.gz
    ```

3. Replace `X.X.X` with the version number of the release you downloaded.
4. After extracting the contents, navigate to the `lotus` directory in your terminal. For example, if you extracted the contents to `/usr/local/bin`, you can navigate to the lotus directory by running the command:

    ```sh
    cd /usr/local/bin/lotus-X.X.X
    ```

5. Again, replace `X.X.X` with the version number of the release you downloaded.

This is what it looks like in GitBook:

The list becomes very cramped. A work around for this is to add escape characters and additional blank lines into the markdown, but then you end up with something like this:

2. Once you have downloaded the binary file, extract the contents to a directory of your choice. For example, if you are using Linux, you can extract the contents to the `/usr/local/bin directory` by running the command: \


    ```sh
    sudo tar -C /usr/local/bin -xzf lotus-X.X.X-linux-amd64.tar.gz
    ```


3. Replace `X.X.X` with the version number of the release you downloaded.

Note the escape \ character at the end of the first line. This is not common markdown, and will bork parsers like GitHub's markdown preview, or VSCode's markdown preview.

Solution

Add a margin before and after codeblock when they're a child of a <ul> or <ol> item. Something like this should work:

ol > li > pre code,
ul > li > pre code {
  margin-top: 10px;
  margin-bottom: 10px;
}

[addisonschultz]

Hey @johnnymatthews - thanks for the suggestion! Glad you have a workaround for now, but I agree, and think we should be consistent with the markdown we're displaying