How to change the color of the form collapse tool?

  • nhetravel
    Asked on February 12, 2016 at 2:56 AM
    I still have one question, how do i change the colour of the collapse [+]. Thank you
  • Charlie
    Replied on February 12, 2016 at 3:08 AM

    I presume you have a screenshot shared to us? Unfortunately, if you are replying to our post using your email client and attaching images on it, it won't go through our forum. You need to directly visit this thread (http://www.jotform.com/answers/770707), and use the upload image button to share your screenshot.

    Here's a screenshot showing the upload image button:

    How to change the color of the form collapse tool? Image 1 Screenshot 20

     

    I also see that you have a lot of forms being updated, could you share us the form URL of the work you are working with? It seems like you are using some themes, are you referring to the arrows for the form collapse tool? We'll wait for your response.

  • nhetravel
    Replied on February 14, 2016 at 9:03 PM

    Hi Charlie, Yes, it's the arrow that opens up the collapse bar. I can find the place to change the text colour but not the arrow displaying on the right side. Thanks in advance for your help.

    How to change the color of the form collapse tool? Image 1 Screenshot 20

  • Charlie
    Replied on February 15, 2016 at 1:10 AM

    Here's the CSS code that you can edit:

    .form-collapse-right-hide {

        width: 16px !important;

        height: 16px !important;

        background: linear-gradient(to bottom, transparent 35%, black 35%, black 65%, transparent 65%), linear-gradient(to right, transparent 35%, black 35%, black 65%, transparent 65%) !important;

        margin-right: 10px !important;

    }

    .form-collapse-right-show {

        width: 16px !important;

        height: 16px !important;

        background: linear-gradient(to bottom, transparent 35%, black 35%, black 65%, transparent 65%) !important;

        margin-right: 10px !important;

    }

     

    In my case, I changed it to color black, just replace the color that I have in my CSS code with your own preferred color. Paste the copied CSS code under your CSS tab in your Form Designer Tool. Here's how my cloned form looks like after using that code: https://form.jotform.com/60450850769966 

    How to change the color of the form collapse tool? Image 1 Screenshot 20

    Let us know if you need more help on this. 

  • nhetravel
    Replied on February 15, 2016 at 1:44 AM

    You are awesome. Thank you very much for that . Have a great day !

  • nhetravel
    Replied on February 15, 2016 at 2:03 AM

    Two more questions;

    1.) How you change the "Scale Rating"
    , Radio/checkbox & The Calendar date colour?

    How to change the color of the form collapse tool? Image 1 Screenshot 50

     

    How to change the color of the form collapse tool? Image 2 Screenshot 61

     

    How to change the color of the form collapse tool? Image 3 Screenshot 72

     

    2.) Also, how to do maintenance on the database, e.g. to delete some of the images upload to your site?

    How to change the color of the form collapse tool? Image 4 Screenshot 83

     

    Thank you

  • Charlie
    Replied on February 15, 2016 at 3:33 AM

    You are welcome. I'm glad the CSS worked for you.

    Regarding the follow up questions you have, I strongly suggest that you open separate threads for each one, it would be best to focus on each question on separate threads.

    For the scale rating, please refer to this link instead: http://www.jotform.com/answers/772207 

    For the concern about the uploaded images, you can refer to this one: http://www.jotform.com/answers/772206 

     

    For the radio default radio/check box fields, you can change their color using the Form Designer Tool.

    How to change the color of the form collapse tool? Image 1 Screenshot 20

     

    For the date field in your form, it seems like you are using a Date Picker widget for it, you need to use a custom CSS code for it. I would recommend opening a separate thread for it. Here's a link that you can use: http://www.jotform.com/contact/

     

    Thank you for your understanding. 

  • nhetravel
    Replied on February 15, 2016 at 4:36 AM

    I cannot expand out the collapse form like you did in-order to excess the box/radio button.

    How to change the color of the form collapse tool? Image 1 Screenshot 20

  • Mike
    Replied on February 15, 2016 at 6:25 AM

    Your question has been moved into a separate thread.

    How to expand Form Collapse in Form Designer

    We will get back to you quickly.