ホバーエフェクト（カード）

src/assets/sass/global/mixins/ に、any-hover・:focus-visible・リンクの opacity 打ち消しなどを含めたホバー用 Sass mixin を置いている。コンポーネント SCSS では @use '../global' as *; のあと @include で呼び出す。各セクションに、このデモで使っている mixin を記載している。

カード型：画像拡大

@include hover-scale-img();

カード型：上へ

@include hover-up();

カード型：シャドウ

@include hover-shadow(-4px);

カード型：明るさ

@include hover-brightness();