Advanced Stylesheet: Class in class

Ignition
,
14 
/*Expand left dock*/
.docked-view-left{
	width: auto !important
}
.psc-leftMenuDockClosed {
	width: 100px;
	transition: width 0.2s ease-in-out;
}
.psc-leftMenuDockOpened {
	width: 300px;
	transition: width 0.2s ease-in-out;	
}
.client-root:has(.docked-view-left .psc-leftMenuDockOpened) > .center-column.flex-col .docked-view-top{
   	left: 310px !important;
}
.client-root:has(.docked-view-left .psc-leftMenuDockOpened) > .center-column.flex-col .center.view-parent{
   	margin: 40px 0px 0px 310px!important;
}

Here me go.
After analyse on how ignition is changing the CSS code when using the onboard functionalities, i've found a working code.
The two last line modify the position of my top dock and the central view of 310px to the left when the leftMenuDockOpened class is present.
As for the moment this seems only to be working with chrome and Edge. I will try to debug on the firefox later.

if you have a bottom dock you should add a extra line to take care of that one also.

@victordcq your nickname CSS king fit you well :smile:
@Transistor maybe it will help you also

Thanks to everyone for the help

Arnaud

1 Like