Fix page number placement for ebook themes (BL-15611)

[StephenMcConnel]

The zero margin theme page numbers were misplaced for full bleed books, which could be set by full image cover pages. The rounded border theme mislocated the whole page, leaving the page numbers looking too high.

---

This change is 

[JohnThomson]

Nice work tracking down what needed to change, but I think the reasons could be made clearer for the benefit of the next person trying to maintain this.

@JohnThomson reviewed 2 files and all commit messages, and made 4 comments.
Reviewable status: all files reviewed, 3 unresolved discussions (waiting on @hatton and @StephenMcConnel).

---

src/content/appearanceThemes/appearance-theme-zero-margin-ebook.css line 30 at r1 (raw file):

}
.bloom-fullBleed .Device16x9Landscape.numberedPage {
    /* Adjust the page number position for full bleed pages */

This comment pretty much just says what is obvious by reading the code. I think it would be more helpful to say something like, "on full-bleed pages we want the number positioned based on the ideal place where the page should be trimmed, not where it will usually be cut off"

---

src/content/appearanceThemes/appearance-theme-zero-margin-ebook.css line 31 at r1 (raw file):

.bloom-fullBleed .Device16x9Landscape.numberedPage {
    /* Adjust the page number position for full bleed pages */
    --pageNumber-left-margin-override: calc(var(--full-bleed-excess-width) / 2);

We don't also need more space below it?
Also, (more a question for @hatton), do we want to position it where it will look best if the printer trims the page perfectly? Or do we want it further in so it is part of what should never be trimmed off? Does what you have put at least the number itself inside the safe area of the page?

---

src/content/appearanceThemes/appearance-theme-rounded-border-ebook.css line 25 at r1 (raw file):

}
[class*="Device"] .marginBox > .split-pane-component-inner {
    top: 0px; /* default of auto leaves gap at top */

I think this needs more explanation. top: auto does not usually leave a gap at the top of a div; it must be because of some combination of other things we've done, which presumably are desirable when we're not using a device page size.

[StephenMcConnel]

@StephenMcConnel made 3 comments.
Reviewable status: all files reviewed, 3 unresolved discussions (waiting on @hatton and @JohnThomson).

---

src/content/appearanceThemes/appearance-theme-rounded-border-ebook.css line 25 at r1 (raw file):

Previously, JohnThomson (John Thomson) wrote…

I think this needs more explanation. top: auto does not usually leave a gap at the top of a div; it must be because of some combination of other things we've done, which presumably are desirable when we're not using a device page size.

I changed this altogether, hopefully with enough explanation, after figuring out better what was going on.

---

src/content/appearanceThemes/appearance-theme-zero-margin-ebook.css line 30 at r1 (raw file):

Previously, JohnThomson (John Thomson) wrote…

This comment pretty much just says what is obvious by reading the code. I think it would be more helpful to say something like, "on full-bleed pages we want the number positioned based on the ideal place where the page should be trimmed, not where it will usually be cut off"

Done.

---

src/content/appearanceThemes/appearance-theme-zero-margin-ebook.css line 31 at r1 (raw file):

Previously, JohnThomson (John Thomson) wrote…

We don't also need more space below it?
Also, (more a question for @hatton), do we want to position it where it will look best if the printer trims the page perfectly? Or do we want it further in so it is part of what should never be trimmed off? Does what you have put at least the number itself inside the safe area of the page?

No, the top / bottom edges are okay, probably because --full-bleed-excess-height calculates out to 0mm for Device16x9Landscape. (which may be a theoretical issue, but we don't really expect physical printing for Device layouts.)