.border-button {
  @border-width: 10px;
  @border-width-half: @border-width / 2;
  
  border: solid @border-width @border;
  margin: 0.1em;

  transition: clip-path 0.6s linear;
  clip-path: polygon( ~"
    calc(0% + @{border-width-half}) 
    calc(0% + @{border-width-half}), 

    calc(100% - @{border-width-half}) 
    calc(0% + @{border-width-half}), 

    calc(100% - @{border-width-half}) 
    calc(100% - @{border-width-half}), 

    calc(0% + @{border-width-half}) 
    calc(100% - @{border-width-half})
    ");
}

.border-button:hover {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}