Custom Switch MDC

[eco-view]

Hello.
Is it possible to use a custom switch such as this?

https://henan-guanjie.gitee.io/ui-design...index.html

https://material-components.github.io/ma...ent/switch

[admin]

Where exactly do you want to use it? The standard toggle element can be styled via CSS to have a similar look.

[eco-view]

I'd like to use it throughout the visualisation. Is there an easy way for a not super technical person to style 'inline' switch to look like one of these?

[admin]

Add to Custom CSS:

Code:

.toggler {
  width: 84px;
  border: none;
  overflow: visible;
}
.toggler .btn-toggler {
  color: transparent !important;
  text-shadow: none;
  padding: 0;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  box-shadow: 0 0 1px 3px rgba(0, 0, 0, 0.2);
}
.toggler .btn-bg {
  padding: 0;
  width: 64px;
  height: 22px;
  margin: 10px;
  border-radius: 11px;
}

You can adjust the Control size scale property in Vis. parameters to make it bigger/smaller as needed.

[eco-view]

That works fantastic and looks great!

Would you be able to help me out with a dimmer slider to suit?

Thank you so much

[Daniel]

See this thread, you can modify it as needed
https://forum.logicmachine.net/showthrea...44#pid2544