Skip to content

Instantly share code, notes, and snippets.

@davidmoten
Last active September 3, 2019 09:02
Show Gist options
  • Save davidmoten/03ca6332e416e050a4a6 to your computer and use it in GitHub Desktop.
Save davidmoten/03ca6332e416e050a4a6 to your computer and use it in GitHub Desktop.

With markdown table with extra Notes column we get pretty horrendous Notes column size (small) as the screen width lowers. Once you get to mobile it's very yuk. In fact the dominant column in terms of size is determined by the longest text in a cell so if a long note gets put in then that will make the Notes column dominate sizing:

ID Rule Notes
1 A Subscriber MUST signal demand via Subscription.request(long n) to receive onNext signals. It is intended blah blah that something happens here that is not confusing and stuff
2 If a Subscriber suspects that its processing of signals will negatively impact its Publisher's responsivity, it is RECOMMENDED that it asynchronously dispatches its signals. It is intended blah blah that something happens here that is not confusing and stuff.

Using pure html we get control over column sizes but lose the markdown formatting in the cells:

IDRuleNotes
1A `Subscriber` MUST signal demand via `Subscription.request(long n)` to receive `onNext` signals.It is intended blah blah that something happens here that is not confusing and stuff
1A `Subscriber` MUST signal demand via `Subscription.request(long n)` to receive `onNext` signals.It is intended blah blah that something happens here that is not confusing and stuff

Another option is to use another row for Notes so we can use markdown but be more readable on mobile. Note also that the alternating default background color for rows in markdown matches nicely with the note row:

ID Rule
1 A Subscriber MUST signal demand via Subscription.request(long n) to receive onNext signals.
✏️ It is intended blah blah that something happens here that is not confusing and stuff
2 If a Subscriber suspects that its processing of signals will negatively impact its Publisher's responsivity, it is RECOMMENDED that it asynchronously dispatches its signals.
✏️ It is intended blah blah that something happens here that is not confusing and stuff and there might be a few lines of this stuff so needs to look ok after wrapping and there might be a few lines of this stuff so needs to look ok after wrapping.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment