@import “../vars.scss”;

.sk-view-switcher {

display:flex;
align-content:center;
text-align: center;
border-radius:$sk-border-radius;

&.is-disabled {
  display:none;
}

&__action {
  flex:1;
  border:1px solid $sk-border-color;
  cursor:pointer;
  font-weight: $sk-medium-weight;
  font-size:$sk-list-font-size;
  color: $sk-action-text-color;
  padding:5px 10px;
  border-right:none;

  &:first-child {
    border-radius: $sk-border-radius 0 0 $sk-border-radius;
  }

  &:last-child {
    border-radius: 0 $sk-border-radius $sk-border-radius 0;
    border-right:1px solid $sk-border-color;
  }

  &.is-active {
    background-color:$sk-active-bg-color;
    color:white;
    font-weight: $sk-bold-weight;
    border-color:$sk-active-bg-color;
  }
}

}