Space for hierarchy

Space in the text direction, so show the hierarchy of the content

• Indentation of list items (li)
• Indentation of definition items (dd)
• Indentation of code blocks (pre)
• Indentation of sections such as:
  • quotes (blockquote) and other "borrowed content". The space creates a sense of distance between the original and the included content. Therefore it should probably a larger space than the indentation of lists.
  • call-out sections
• Indentation of tree views

Considerations:

• Sometimes the space before the content is used to display an icon, such a list item bullet, a file icon in a tree view, or an exand/collapse icon.

• Frequently the space is "square" in relation to the line height, to be able to center an icon.

• The indentation might not be compatible with a columns grid.

Experiment

:root {
  --nih-space-hierarchy-indent: 1.5em;
  --nih-space-hierarchy-external: calc(var(--nih-space-hierarchy-indent) * 2);

  --nih-space-hierarchy-list: var(--nih-space-hierarchy-indent);
  --nih-space-hierarchy-blockquote: var(--nih-space-hierarchy-external);
}

ul {
  outline: 1px dotted white;
}
li {
  outline: 1px dotted silver;
}

ul {
  padding-left: 0;
}
li {
  margin-left: var(--nih-space-hierarchy-list);
}
blockquote {
  margin-left: var(--nih-space-hierarchy-blockquote);
}

Original vs. borrowed content

• Written by Ernest Hemingway
• Language is English
• Published on 21 October 1940

The title refers to John Donne's work:

No man is an Island, intire of it selfe; every man is a piece of the Continent, a part of the maine; if a Clod bee washed away by the Sea, Europe is the lesse, as well as if a Promontorie were, as well as if a Mannor of thy friends or of thine owne were; any mans death diminishes me, because I am involved in Mankinde; And therefore never send to know for whom the bell tolls; It tolls for thee.