Office UI Fabric реагирует на слияние стилей: селектор наведения - PullRequest
0 голосов
/ 18 января 2019

Я использую фантастический пакет офисного пользовательского интерфейса и получаю информацию о том, как заставить псевдо-селектор :hover работать так, как я хочу.

В основном я хотел бы сделать следующее:

export const getMainNavClassNames = (): IMainNavClassNames => mergeStyleSets({
    nav: {
        selectors: {
            '& .ms-Nav-compositeLink:hover': {
                background: theme.palette.themeDark
            }
        }
    }
});

Однако селектор: hover не работает, если между классом нет пробела. Следующая будет работать, но она выбирает дочерний элемент .ms-Nav-композитLink, а это не то, что мне нужно.

export const getMainNavClassNames = (): IMainNavClassNames => mergeStyleSets({
    nav: {
        selectors: {
            '& .ms-Nav-compositeLink :hover': {
                background: theme.palette.themeDark
            }
        }
    }
});

Я пробовал каждую перестановку, которую только мог придумать, основываясь на документации .

1 Ответ

0 голосов
/ 21 января 2019

Оказывается, селектор работает должным образом, однако мне нужно было больше знать об иерархии классов css, используя devtools для правильного нацеливания на класс. Это помогает присмотреться к classNames, сгенерированному mergeStyle, чтобы определить, какой стиль выбрать.

...