Support iPhone X notch and rounded corners in landscape

[Cldfire]

Hi! This is a great theme and I'm happily using it as the base for my little site, thank you for porting it :)

I noticed that it didn't support the notch and rounded corners on my iPhone X(R) properly, so I looked up how to go about fixing that and did so. I figured it would be nice to contribute this back as it is something that everyone could benefit from.

A couple of screenshots (ignore the change to the date format, that's not in this PR):

Before the changes in this PR, normal layout:

After the changes in this PR, normal layout:

After the changes in this PR, reverse layout:

I know it's hard to visualize without being able to see the notch and corners, but keep in mind that all of those images have the same dimensions. Notice that after the changes, the sidebar extends all the way to the edge and the content text has more space.

Let me know if you have any questions or concerns!

[Keats]

On your second screenshot, it does look significantly close to the right border. Maybe increase the size of the sidebar by a bit to make it look more centered?

[Cldfire]

Oh, I think you're feeling that way because the Cldfire's part is a bit too long for the padding boundary. Here's a screenshot that shows where the padding actually is (blue box):

If the word actually fit it would be fine. Poor demo choice on my part!

Also, I realized I can easily get a mockup of what it looks like on an iPhone X using an iOS simulator. Here are some screenshots from that:

(Now that I look at that second screenshot, it does feel to me as if there is too much padding on the left side of the body without the notch there. Do you agree? If so I will change that.)

And here is the look before this PR:

EDIT: Using deploy preview, direct comparison to after:

[Keats]

Sorry for the late merge!

[Cldfire]

No problem! Better late than never :)