Height of message from Spreadsheet to form

  • Profile Image
    rosang1
    Asked on November 01, 2021 at 04:21 AM

    Hi,

    How do I adjust the height of this message field? As you can see it's too small.

    1635754907_617fa39bc1d57_

  • Profile Image
    Gaetan_B
    Answered on November 01, 2021 at 06:04 AM

    Hello,

    Thank you for reaching out.


    In the CSS of the widget:

    1635760769_617fba8138459_


    Could you replace the existing code by the following:

    @font-face {
    font-family : Orgon;
    src : url(https://assets.grandvision.io/global/orgon-regular.woff2);
    font-weight : normal;
    }
    .input-btn {
    margin-top: 33.5px;
    background: #ffffff;
    height: 40px;
    width: 50%;
    font-weight: bold;
    border-radius: 30px 30px 30px 30px;
    border: 1px solid #2b2e31;
    font-family: 'Orgon', Arial;
    color: #212529;
    display: none;
    }
    button#autofill:hover {
    box-shadow: 0px 0px 0px 5px #b3b3b3!important;
    }
    button#autofill {
    margin-left: 10px;
    }


    .input-box{
    display: none;
    }
    #message{
    margin: 0;
    }
    @media screen and (max-width:480px)
    {
    li#id_234{
    width: 60% !important;
    margin-left: auto;
    margin-right: auto;
    }
    li#id_229{
    width: 30% !important;
    margin-left: auto;
    margin-right: auto;
    }
    }


    Best regards

  • Profile Image
    rosang1
    Answered on November 01, 2021 at 06:10 AM

    Is it possible to hide these icons also?

    1635761400_617fbcf8dac34_1635761414_617fbd06c3cdd_

  • Profile Image
    Bojan_J
    Answered on November 01, 2021 at 06:21 AM

    Greetings.

    To remove those icons, please add the following CSS to your widget:

    #message {
     background: none !important;
    }

    You can click here to see how to add CSS to widgets.

    Let us know if you have any additional questions.

  • Profile Image
    rosang1
    Answered on November 01, 2021 at 07:06 AM

    Can I adjust the width somehow?

    1635764760_617fca18edabc_

  • Profile Image
    Bojan_J
    Answered on November 01, 2021 at 07:24 AM

    Greetings.

    I have checked the CSS of your widget, and it looks like you have multiple selectors for this message. You will first have to locate the second selector, and remove it completely:

    screenshot_8078.png

    Make sure you remove everything here:

    #message{
    margin: 0;
    margin-left: 10px !important;
    }

    Then, you will have to scroll up and locate the first selector and add the following:

    margin-left: 0 !important;
    padding-left: 0 !important;
    margin-top: 0 !important;

    It should look like this:

    screenshot_8080.png

    After these changes, your form will look like this:

    screenshot_8081.png

    Let us know if you have any additional questions.