production-taskbar-client / src / renderer / app / components / toggle_button / ToggleButton.less
ToggleButton.less
Raw
@import "../../vars.less";

@width: 30px;

.toggle-button {
  background-color: @background-color;
  align-self: center;
  width: @width;
  height: 100%;
  border-radius: 15px 0px 0 15px;
  overflow: hidden;
}

.toggle-button__triangle-right {
  width: 0;
  height: 0;
  border-top: 50vh solid @background-color;
  border-left: @width solid @primary-color;
  border-bottom: 50vh solid @background-color;
  transition: 0.5s all;
}

.toggle-button__triangle-left {
  .toggle-button__triangle-right;
  transform: scale(-1, 1);
}