Реагируйте Афродита Нечетные + Четные Селекторы

В настоящее время я разрабатываю простое приложение с React, я решил использовать Aphrodite для обработки моего CSS.

Однако я столкнулся с проблемой, для которой я не могу найти ответ, и он обрабатывает нечетные и даже псевдо-селекторы. Кто-нибудь получил пример того, как использовать Aphrodite для обработки нечетных + четных псевдо?

Источник

2 ответа

Решение

В Aphrodite вы используете таблицу стилей в js и можете определить псевдокласс с его строковым представлением для ключа объекта. Это будет выглядеть примерно так

const styles = StyleSheet.create({
    hover: {
        ':hover': {
            backgroundColor: 'red'
        }
    },
    ... other styles here ...
});

поэтому при использовании Афродиты вы используете их css функция, чтобы ввести его в <head>

<div className={css(styles.hover)}>I get a red background on hover!</div>

Вот отличное видео, показывающее, как использовать Афродиту (включая псевдо-классы!)

Источник

Приведенный выше ответ является правильным, я не понял, что вы можете сделать, это..

const styles = StyleSheet.create({
    red: {
        backgroundColor: '#dedcdb'
    },

    nthChild: {
      ':nth-child(even)': {
        backgroundColor: '#e8e8e8'
      }
    },

    small: {
        '@media (max-width: 600px)': {
            backgroundColor: 'red',
        }
    }
});

Который будет окрашивать каждого четного ребенка в правильный цвет.

Источник
Другие вопросы по тегам