Feedback-ID: id4a34324:Fastmail
Date: Fri, 3 Nov 2023 13:44:35 -0700
From: Andres Freund <andres@anarazel.de>
To: pgsql-www@postgresql.org,
	"Jonathan S. Katz" <jonathan.katz@excoventures.com>
Subject: docs: variablelist rendering
Message-ID: <20231103204435.tz6qgxbht3n62hi5@awork3.anarazel.de>
MIME-Version: 1.0
Content-Type: text/plain; charset=us-ascii
Content-Disposition: inline
Archived-At: 
 <https://www.postgresql.org/message-id/20231103204435.tz6qgxbht3n62hi5%40awork3.anarazel.de>
Precedence: bulk

Hi,

The styles used to render variablelist on pages like
https://www.postgresql.org/docs/devel/install-meson.html#MESON-OPTIONS

imo make it hard to visually attribute the description of an option to the
option, as the vertical space between the description and the variable is
about the same as the to the next option.

This seems to be from
https://git.postgresql.org/gitweb/?p=pgweb.git;a=blob;f=media/css/main.css;h=80afc3d113cd1992b890ff2b90c04b991290b1b2;hb=HEAD#l1345
and a few related rules.

I'm not sure this was intended, it looks like there are a few rules
interacting with each other, some from bootstrap.

First dd has a top margin of 1 from
#docContent .variablelist dd {
  margin-top: 1rem;
}

and a bottom margin of 0.5rem from bootstrap (except for other margins it'd be
close to the next dt). Then p has a 1rem distance from both bottom and top:

#docContent .VARIABLELIST p,
#docContent .variablelist p,
#docContent .VARIABLELIST pre,
#docContent .variablelist pre {
  margin: 1rem 0 1rem 2rem !important;;
}

making the distance from both the same.


The indentation of items is also very deep - is that intended? Kinda looks
like it accidentally might have gotten doubled. There's 2rem from

#docContent .VARIABLELIST dd,
#docContent .variablelist dd {
  margin-inline-start: 2rem;
}

*and* 2 rem from

#docContent .VARIABLELIST p,
#docContent .variablelist p,
#docContent .VARIABLELIST pre,
#docContent .variablelist pre {
  margin: 1rem 0 1rem 2rem !important;;
}

which are not collapsed (I think that just happens vertically). So it's 4 rem
deep...


After adjusting this in the browser, I noticed that the itemized lists inside

https://www.postgresql.org/docs/devel/install-meson.html#CONFIGURE-WITH-UUID-MESON

ended up very deeply indented. But that actually something happening outside
of this context / without changing anything else. Check e.g.:

https://www.postgresql.org/docs/devel/btree-behavior.html

There's a 2.5rem left margin from:
#docContent ul.itemizedlist {
  margin-left: 2.5rem;
}

*and* padding - I think from the desktop browser defaults (both in firefox and
chrome on linux).  I doubt that was intended?

Greetings,

Andres Freund