Forum Discussion

phoneboy's avatar
phoneboy
Director
5 years ago

Customizing the CSS for Studio Itself

This unresizable text interface in Studio > Endpoints makes editing Macros and Endpoints...unusable, as it shows up as only a few lines of text.

I can see in the Chrome Developer console it's set in the CSS for the page:
 
@media screen and (-webkit-min-device-pixel-ratio: 0)
#lia-body .lia-content textarea {
    resize: none;
}

 

This does not appear to be coming from my custom skin CSS, but from somewhere else (a bizapps-xxxx.css file).
There's no obvious way to customize this...any ideas?

  • As a workaround, you can use the browser extension Stylus and/or Tampermonkey for some js to change element behavior.

    I usually use these fields only for copy-paste from/to the editor with syntax highlighting.

  • As a workaround, you can use the browser extension Stylus and/or Tampermonkey for some js to change element behavior.

    I usually use these fields only for copy-paste from/to the editor with syntax highlighting.

    • phoneboy's avatar
      phoneboy
      Director

      Or you can do it in uBlock Origin with the following rule:

      community.stage.example.com##.lia-form-input-wrapper textarea:style(resize: both!important)

       

      Of course, I would prefer some way to customize this on the platform itself versus having to rely on a specific browser plugin to be installed.

  • SuzieH's avatar
    SuzieH
    Khoros Alumni (Retired)

    phoneboy You might also like this Chrome extension. It was built a while back by a Khoros Service team member as part of a hack-a-thon. I wrote about it a while ago in  back when we were Lithium. I use it on my test site and it has some nice additional features such as autocomplete FreeMarker tags and line numbers.

     

     

     

     

    • phoneboy's avatar
      phoneboy
      Director

      That's neat SuzieH thanks for sharing!
      Looks like it might need a small update for more modern Chrome browsers, but still seems to work.