Hi All,


I am using Wizard from Web patterns component, I need to show the steps are connected.

Is there any by default CSS or styling we can apply to show the connected steps?

Following is the ss.

And the wizard i am using is :- 

Thanks in advance.

Hi Dhiraj,

If you are using wizard pattern than you need to set setpsIdentifire,than you are able to see connected lines

Like below image


Regards

Rahul Sahu

Rahul Sahu wrote:

Hi Dhiraj,

If you are using wizard pattern than you need to set setpsIdentifire,than you are able to see connected lines

Like below image


Regards

Rahul Sahu

 

 Hi rahul,

Thanks for the reply.

I am using Web pattern navigation wizard.

You are refering to Outsystems UI web navigation wizard.

any idea about web pattern wizard.



Regards,

Dhiraj

Dhiraj Manwani wrote:

Hi All,


I am using Wizard from Web patterns component, I need to show the steps are connected.

Is there any by default CSS or styling we can apply to show the connected steps?

Following is the ss.

And the wizard i am using is :- 

Thanks in advance.

 Hi Dhiraj,

You can use after and before style border-bottom property to show them connected.It will apply border in after and before of steps so that they will look like connected.

 example

.navigation::after{border-bottom:1px solid #333}

.navigtion::before{border-bottom:1px solid #333}

you can use (:not first-child) so that it will not apply on first element i.e in your case is English.


Hope this helps


Thanks

AD