Form Tabs Widget: How to change color of visited tabs

  • Profile Image
    NEMSSupervisor
    Asked on March 03, 2019 at 01:40 PM

    I am using the form tabs wiget.  I am being asked if it is possible to have the tabs change colour when the tab has been accessed.  Is there a CSS code that can be written to change the colour of the tab if it has been accessed.  They are black and orange currently and I am willing to accept red and black for changes. 

  • Profile Image
    Mike_G
    Answered on March 03, 2019 at 04:23 PM

    The Form Tabs widget has a Theme option where you can select a red and black combination.

    1551648082t16_20_33.png

    With that theme, the color of the tabs will look like this (please see image below).

    1551648116t16_17_44.png

    I hope this helps. If you have other questions or concerns, please do not hesitate to let us know.

  • Profile Image
    NEMSSupervisor
    Answered on March 03, 2019 at 06:01 PM

    Yes I selected the black and orange.  What I am asking is if there is a CSS code that can be written to change the color once the tab has been selected so that when you return to the form the tab will be a different color to let you know you have been there. 

  • Profile Image
    matthew
    Answered on March 04, 2019 at 02:15 AM

    To my understanding, you would like to change the active tab background color. You should add Custom CSS code in your widget. You should select the widget that you would like to change. Then, you should click on the wand 'widget settings' icon. After that, you should add your CSS Code and make sure the save changes.

     

    1551683188Screen Shot 2019-03-04 at 10.0

     

    Exampe code:

    #tabs-list .current {

        color : #0066cc !important;

        font-weight : bold;

        background : #0099ff !important;

    }

    /* Added code */

    .current div.liBefore {

        border-bottom-color: #0099ff !important;

    }

    .current div.liAfter {

        border-bottom-color: #0099ff !important;

    }

     

    The #0099ff color can be updated.

     

    For detailed information, please check this similar discussion thread: change background-color of Form Tabs.

    Is it similar to what you wanted to do on your form? 

    I hope, this has been helpful.

    Let us know if you need further assistance.

  • Profile Image
    NEMSSupervisor
    Answered on March 04, 2019 at 02:05 PM

    This will change the tab once selected but I want the colour to change and remain that colour to let the user know they have already been there.  

  • Profile Image
    Mike
    Answered on March 04, 2019 at 03:31 PM

    Unfortunately, this is not currently possible to change the color of visited tabs.

    I am escalating a feature request ticket to our developers on your behalf to see if this is something that can be implemented.

    There is no ETA for when this will be addressed, but we will let you know if we have any updates.