何をしたいか

今回、めったにないケースだとは思うのですが、あるボタンのhover時のcss（今回は背景色を変える実装）だけは有効にしたまま、ユーザーがクリックできないようにしたいという特殊な実装をすることになりました。

解決策

解決法は:activeの擬似クラスを使ってその中でpointer-events: none;するだけ。

.class-name {
  &:hover {
    background-color: blue;
  }
  &:active {
    pointer-events: none;
  }
}

これでhover時はちゃんと背景が青になるものの、クリックをしても何も起こらないという動作をさせることができました。