Как изменить цвет текста при выборе с библиотекой Emotion - PullRequest
0 голосов
/ 18 февраля 2019

Я пытаюсь преобразовать CSS-код из Stylus в Emotion.В Stylus, как и в CSS, вы можете добавить псевдоэлемент ::selection, чтобы изменить color при выделении текста.

// Stylus
#adventure
  max-width: 1400px
    ::selection
      color: $adventure-background

Я попробовал этот синтаксис, но, похоже, он не работает

// Emotion
export const Adventure = styled.div`
  max-width: 1400px;
  /* @TODO not working */
  &::selection {
    color: ${colors.greenWater};
  }
`;

Если у кого-то есть подсказка!Спасибо за вашу помощь!

1 Ответ

0 голосов
/ 19 февраля 2019

Итак, мы наконец нашли, как заставить css ::selection работать с Emotion.Мы преобразовали наш стилизованный компонент в объект и используем & ::selection.Я не пробовал с пробелом и это было то!

// Emotion
export const Adventure = styled.div({
  maxWidth: '1400px',
  /* working now! */
  '& ::selection': {
    color: colors.greenWater,
  },
});
...