css - 特定のクラスの Vaadin コンポーネント CSS

Question

特定の CSS クラスを使用する各 Grid インスタンスからグリッド セル フォーカス スタイルを削除しようとしています。

CSS

.v-grid-cell-focused:before {
    display: none !important;
}

うまく機能しますが、アプリケーションのすべての Grid インスタンスにスタイリングを適用します。

次の方法で、特に CSS クラスに適用できるようにしました。

.mygrid.v-grid-cell-focused:before {
    display: none !important;
}

また

.v-grid-cell-focused.mygrid:before {
    display: none !important;
}

また

.mygrid > .v-grid-cell-focused:before {
    display: none !important;
}

ただし、デフォルトの動作から変更はありません。

次のCSSを正常に使用しました

.v-grid-cell.anotherGrid {
    background-color: #07a9ca;
    color: #000;
}

上記のスタイリングを採用した唯一のグリッドは、私がスタイル名に割り当てたものでしたanotherGrid。:beforeこれは、私の場合、実装が機能しない原因となっているカスタム CSS クラスと相まって、CSS セレクターに関する複雑さがある可能性があることを示唆しています。

Vaadin コンポーネント CSS を参照し、指定した特定の CSS クラスにのみ適用するにはどうすればよいですか?