Why does my theme ruin the editor?

  • petruzzo
    Asked on January 3, 2017 at 6:41 PM

    I created a form. Looks good, works the way I need it to. Having a new form I needed to create, I saved the old form as a theme, made the new form without any customizations, and then applied the theme I just saved. And it looks like this in the editor. What's going on?

    Jotform Thread 1024695 Screenshot
  • candy
    Replied on January 4, 2017 at 1:46 AM

    Hello,

    We're sorry for the inconvenience you have.

    I have checked your form(id: 70027242564147) named "New Portraits Form" and I have seen the issue.

    I have forwarded this issue related to theme named "2017" to our software development team. Please remove or change your theme of the form until we will fix it. You can use our "Default theme" for now, as you can see the screenshot below:

    Why does my theme ruin the editor? Image 1 Screenshot 20

    Thank you for reporting us.

  • Scott JotForm Developer
    Replied on January 4, 2017 at 11:10 AM

    Hey petruzzo,

    It's due to the CSS code of the theme you've created. In particular, this part:

    .form-all {
        width : 100% !important;

    When you add the !important property, it over rides the form builder page's CSS.

    I removed the !important part from the theme and applied it again to your form New Portraits and now the builder looks ok.

    If you are seeing any other problems with your theme's CSS code, please let us know and we will gladly help you.

  • petruzzo
    Replied on January 4, 2017 at 11:49 AM

    Thank you. Why doesn't it do that with the original form the theme was saved from? Should changes be made to that form also?

  • Welvin Support Team Lead
    Replied on January 4, 2017 at 2:07 PM

    You should edit the theme and remove the !important declaration there to fix it and so you can use it in another form without getting the same problem again. 

    You have to go to your Themes section (https://www.jotform.com/mythemes), click and edit it. 

    Why does my theme ruin the editor? Image 1 Screenshot 20

  • Scott JotForm Developer
    Replied on January 4, 2017 at 2:22 PM

    Hey guys,

    @Welvin I actually made this change for preventing this issue to reoccur.

    @petruzzo I now tried to reproduce the issue with creating a theme that uses;

    .form-all{ width: 100% !important;}

    When I first injected the code while creating the form which is to be the theme, .form-all CSS did not affect the builder. But when you complete it as a theme and use it on an another form, then it overrides the form builder page.

    I will be talking this issue with our UI developers and so, thanks again for reporting us this issue,

    Cheers!