Insert / Edit Link Search layout issues

When you are in the builder and you want to add a link by searching for a page the display is messed up.

The CSS below is messing up the “Search input box” and causing it to hover over the list items below making it difficult to view the pages from the list. Dark mode also looks pretty rubbish. It seems to specifically be display: block and position : relative that throw things out.

.cs-forms select, .cs-forms textarea, .cs-forms input[type=“text”], .cs-forms input[type=“password”], .cs-forms input[type=“color”], .cs-forms input[type=“email”], .cs-forms input[type=“number”], .cs-forms input[type=“search”], .cs-forms input[type=“text”], .cs-forms input[type=“url”], .cs-forms input[type=“file”], .cs-forms .cs-styled-select {
display: block;
position: relative;
z-index: 5;
width: 100%;
min-width: 1px;
height: 32px;
height: var(–d-form-input-h);
margin: 0;
border-width: 1px;
border-width: var(–d-form-border);
border-style: solid;
border-color: #ddd;
border-color: var(–c-form-border);
border-radius: 4px;
border-radius: var(–d-form-input-br);
padding: 5px 7px;
padding: var(–d-form-input-padding-y) var(–d-form-input-padding-x);
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
font-family: var(–f-form-ff);
font-size: 14px;
font-size: var(–f-form-fs);
font-weight: 400;
font-weight: var(–f-form-fw);
line-height: 32px;
line-height: var(–d-form-input-h);
color: #020202;
color: var(–c-form);
background-color: #fff;
background-color: var(–c-form-bg);
box-shadow: inset 0 1px 2px rgba(0,0,0,0.07);
box-shadow: var(–s-form-input);
outline: none;
}

This happens because the cs-forms class is on the body. It should really only go on elements that need our app’s form reset. Updated this for the next release. Oddly though, I’m still seeing some styles missing from WordPress for the inputs. It won’t have those black boxes in the next release, but I don’t know at the moment how we go about solving the missing input borders.