manubot / rootstock

Clone me to create your Manubot manuscript
https://manubot.github.io/rootstock/
Other
453 stars 178 forks source link

2 and 3-digit reference numbers overflow into reference title #428

Open dhimmel opened 3 years ago

dhimmel commented 3 years ago

https://github.com/manubot/rootstock/commit/defe787b0ad8a21a745cc82c3117770896caaf8b updated Pandoc which caused the HTML bibliography styling to change. We also updated our plugins.

Notice the layout of the reference numbers before: https://greenelab.github.io/connectivity-search-manuscript/v/650112ab029fbe6ce1f8acdf65d7d60da03fa49f/#references

image

And now after (currently): https://greenelab.github.io/connectivity-search-manuscript/v/dd6f847953b86d415d0fa8b45e71923bf5f44fb6/#references

image

The new layout where the list numbers are separated into their own column looks nicer, but currently does not adapt well to double digit numbers. For manuscripts with 100+ references, the issue might be even worse. @vincerubinetti is there a way we could accommodate three-digit numbers in the list? And/or have more spacing after the 2-digit numbers?

agitter commented 3 years ago

The COVID-19 review has 4 digit reference numbers. This HTML artifact shows how those look image

dhimmel commented 3 years ago

Ah that is actually not bad. I was worried the text would overlap. The minimal fix would probably be to ensure that there is at least one space after the number period? @vincerubinetti what do you think?

vincerubinetti commented 3 years ago

Indeed, I checked to make sure the text wouldn't overlap in that last PR.

A space is already there after the period, but you'd probably want two. Whitespace gets collapsed in HTML, so you'd have to write   . I'm not sure if that will work in the CSL definition though.

Here is how it looks with two:

image

To avoid the alignment issue, a better solution is to just increase the left margin of the right side of the citation. This would be the style to add (somewhere in default.html theme, there may be a section already for references):

.csl-right-inline {
  margin-left: 3em;
}

Anywhere from 2.5em to 3em looks good to me.

dhimmel commented 3 years ago

To avoid the alignment issue, a better solution is to just increase the left margin of the right side of the citation

Nice. I like that. Did you want to make a PR for this?

vincerubinetti commented 3 years ago

I'm on vacation this week, but I can do it on the 28th, or you can do it. It's not critical though, just a minor aesthetic issue.

dhimmel commented 3 years ago

Enjoy the vacation 🏖️ & take your time. Not urgent at all.