[6.x] Prevent horizontal overflow on create form pages

[duncanmcclean]

This pull request attempts to prevent the horizontal overflow currently seen on Create Form pages.

[jasonvarga]

This is just masking the issue. There's gotta be something pushing it wider.

[jasonvarga]

It's this:

cms/resources/css/core/utilities.css

Line 317 in f828b11

width: 100vw;

[duncanmcclean]

Oh good catch. It doesn't seem like we need that width so I've just removed it.

[jasonvarga]

I meant that's what's causing the overflow. Removing it fixes the overflow but removes the horizontal line that was being intentionally added.

[JayGeorge]

Executive Summary

I've removed the line that caused the overflow—in hindsight, aesthetically I prefer the look of it without the line.

Details

The overflow is caused by the horizontal line added to the action button underneath the form (in this case "Create Form"). I've highlighted the horizontal line in the screenshot below.

This is added around line 310 of utilities.css

footer {
    position: relative;
    &::before {
        content: '';
        pointer-events: none;
        position: absolute;
        border-block-end: 1px solid black;
        opacity: 0.06;
        width: 100vw;
        top: 50%;
        transform: translateY(50%);
    }
    etc.
}

In this case, 100vw was needed to extend the line across the container. We could have fixed it by adding overflow-x: clip; to container, around line 264