Give rendered-data sections a background and some padding #1195
Conversation
... rather than all tables.
Now that only object and request tables get the stripes, there is no need to reset it for basic-info
instead, only do the stripes for rows in the tbody, not the thead.
| @@ -270,7 +270,9 @@ footer { | |||
|
|
|||
| /* Styles for sections that are rendered from data, such as HTTP APIs and event schemas */ | |||
| .rendered-data { | |||
| margin: 1rem 0 3rem 0; | |||
| background-color: $secondary-lightest-background; | |||
There was a problem hiding this comment.
This seems to have a jarring reaction with the arrow on the details section:
(accented for visibility)
There was a problem hiding this comment.
This can be fixed with list-style-position: inside; on the summary (rule just below here)
| } | ||
| &.object-table, &.response-table { | ||
| caption, tbody tr { | ||
| background-color: $table-row-default; |
There was a problem hiding this comment.
table rows now blend in with the background:
There was a problem hiding this comment.
I'd suggest making $table-row-alternate be white instead, as it makes #f4fafc pop more. Alternatively, don't bother with striping and play around with table layout some more, though this is more involved and requires a bunch of awkward CSS to get right (we'd want to change various alignments and justifications, possibly copy changes as well).
There was a problem hiding this comment.
Yeah, I'd noticed that, but decided I would rather live with it than have the alternate table rows be lighter than the background, which looks really odd to me.
How about we give the table a light border? Done in b62be51 - I think it looks quite good, though ymmv
There was a problem hiding this comment.
it feels a bit like the table is now bleeding into the background instead of being the background, but also a border is a marked enough improvement for now. Typically we avoid table borders as it can feel overly restricting, though here it seems to fit well enough to break up the pages and pages of text.
Feels like a thing someone else can PR if they don't like it, now.
Not sure if everyone will like this, but it gives definition sections for APIs, events, etc a background and a small indent, which I find very helpful to guide the eye.
Suggest reviewing commit-by-commit as I had to move some stuff out of the way first.
Preview: https://pr1195--matrix-spec-previews.netlify.app