Customize spinner

[admin]

Use this CSS for vertical spinner for both show control and pop-up element (icon display). You need to set additional classes to s-vertical, icon display will only work correctly with 2020 RC2 firmware.

Code:

.pcontrol-s-vertical .popover-content,
.usermode .s-vertical .popover-content {
  display: flex;
  flex-direction: column-reverse;
}
.pcontrol-s-vertical .spinner-up,
.usermode .s-vertical .spinner-up {
  border-radius: 4px 4px 0 0 !important;
}
.pcontrol-s-vertical .spinner-down,
.usermode .s-vertical .spinner-down {
  border-radius: 0 0 4px 4px !important;
}
.pcontrol-s-vertical .spinner-up,
.usermode .s-vertical .spinner-up,
.pcontrol-s-vertical .spinner-down,
.usermode .s-vertical .spinner-down {
  width: 54px !important;
  margin: 0 !important;
}
.pcontrol-s-vertical .spinner-value,
.usermode .s-vertical .spinner-value {
  width: 52px;
  border-top-width: 0;
  border-bottom-width: 0;
}

You can add multiple classes to an element if you want to change colors or other properties. For pop-up element display classes are prefixed with pcontrol- so s-vertical becomes pcontrol-s-vertical: