"Preview" button and "Back to settings" button spacing can be improved on narrow viewports

[heybran]

Issue Summary

Hi there,

I installed Ghost on a linux server yesterday and was playing a bit with the publishing UI on my phone and found out there are two small spacing issues that can be improved. This is more of a style thing as it doesn't break anything related to workflow but I thought it would be good to report it here.

1. Preview button: this was due to the header.gh-publish-header element is missing an inline end padding. This is happening on viewport smaller than 1024px.
2. Back to settings button: this one was due to the viewport width of my phone is smaller (I'm iPhone 11). Although it will looks good on phones with a bigger viewport width, such as phones with 414px viewport width and higher.

Steps to Reproduce

What did I expect?

To keep the UI consistent with other parts of the system, these two buttons should have a spacing between them and the edge of the viewport.

1. Login to Ghost backend on a mobile device.
2. Go through the creating posts process.
3. Or login to Ghost backend on a desktop browser, then reduce the browser viewport.

Ghost Version

6.0.7

Node.js Version

22

How did you install Ghost?

Ubuntu 24.04 on Tencent Cloud

Database type

Other

Browser & OS version

Safari on iOS 18.6.2

Relevant log / error output

Code of Conduct

• I agree to be friendly and polite to people in this repository