Code block styling issue within a list item for apple theme

[hongrich]

There appears to be a styling issue when code blocks are used within a list item in the default apple theme. Here is a screenshot that demonstrates this problem (I added two code blocks to the Realm documentation which uses the apple theme):

The first code block here is within a list item. The second code block is not within a list item. The second code block is styled properly, but there are some issues with the first code block. The first line is slightly more indented than the rest (class Dog doesn't line up with the closing curly brace) and many characters have their descenders clipped (you can see this in characters like g, j, p).

---

(Here is the same example in Github in case it's useful for reproducing the issue)

• Building Realm documentation requires jazzy

  class Dog: Object {
      @objc dynamic var name: String = ""
      @objc dynamic var adopted: Bool = false
      let siblings = List<Dog>()
  }

class Dog: Object {
    @objc dynamic var name: String = ""
    @objc dynamic var adopted: Bool = false
    let siblings = List<Dog>()
}

---

One fix is to add the following styles:

pre > code {
  padding: 0;
}

I believe the problem is that the style intended for inline code blocks is too broad and unintentionally adds padding to code blocks within a list item as well.

jazzy/lib/jazzy/themes/apple/assets/css/jazzy.css.scss

Lines 102 to 106 in afa3161

	p code, li code {
	background-color: $code_bg_color;
	padding: 2px 4px;
	border-radius: 4px;
	}

I did not test this in the other two themes but they also style code blocks differently, so it may not be an issue for those.

[johnfairh]

Thanks for opening this.

Tough to judge what the original intention was here: I agree the pre > code change is least likely to break something else.

The other themes look OK.