Text edit box size on custom page content

MarcQuinlivan

I've had a problem when editing text in a text box, HTML or CSS widget while using a 4K screen.

The text box is tiny - 765 x 265 pixels.

I have created some code to make the boxes bigger:

/* make edit boxes wider on larger screens */

@media screen and (min-width: 1600px) and (max-width: 2100px) {
  .sm-page-widget-inspector-panel {
     width: 1200px !important;
     left: 30% !important;
     top: 25% !important;
  }
  .cm-s-zenburn.CodeMirror {
    height: 500px !important;
  }
}

@media screen and (min-width: 2101px) {
  .sm-page-widget-inspector-panel {
     width: 1800px !important;
     left: 23% !important;
     top: 20% !important;
  }
  .cm-s-zenburn.CodeMirror {
    height: 700px !important;
  }
}

It now looks like this on larger screens:

The only (minor) problem I have now is that the photo selection (and other widget menus) also appear in the same larger size.

It's something I can live with in order to have the larger text editing panels, but is there another way to achieve the same result?

Allen

Make sure the browser is set to 100% zoom.

MarcQuinlivan

@Allen 100% zoom won't make the text box any bigger.

I want to fit more text into the text box rather than just zooming in.

I have a solution, but I wanted to see if there was a way to stop the other widgets resizing.

Allen

At one time I resized the widget using this CSS. Back in 2014-15

EDIT: looks like still works, just tried it.

    /* start edit box */
.sm-overlay-container .sm-page-widget-inspector-panel{
  width:920px!important
}

.sm-page-widget-inspector-panel .sm-panel-content .sm-tabs-content{
  height:500px!important;
  width:920px
}

.sm-page-widget-inspector-panel .sm-panel-content .sm-tabs-content .CodeMirror{
  height:400px!important
}
    /* END edit box */

MarcQuinlivan

Thanks @Allen

That's something I tried too, but from what I remember it had the same effect in that it made the rest of the widgets on the "customise content and design" view resize too (as per my photo in the original post)

It also makes the publish\discard changes popup wider too.

I'll see if I can merge both into something that might work.