Я пытаюсь повторить некоторые CSS в Emotion, используя Partials , но я не вижу, как можно воспроизвести правило, подобное :first-of-type
, в ситуации, когда я использую partial
,Есть ли способ добиться этого?
Запуск CSS:
li.item {
background: white;
border: 1px solid;
}
li.item.isResult:first-of-type {
background: pink; /* Don't know how to port this rule */
}
Лучшая попытка перенести это правило на Emotion:
import styled from '@emotion/styled';
import { css } from '@emotion/core';
const Item = styled.li`
background: white;
border: 1px solid;
${resultPartial}
`
const resultPartial = props => props.isResult && css`
&:first-of-type {
background: pink; // Has no effect
}
`
PS: Хотя partial
s, кажется, не упоминается в документах Emotion, они поддерживаются и работают. Меня особенно интересует вопрос о том, как создать правило :first-of-type
внутри партиала.