Нельзя настроить таргетинг: перед псевдоселектором в JSS

Я пытаюсь настроить таргетинг на псевдо-селектор после элемента на моей странице. Я пробовал JSS для этого проекта и до сих пор являюсь огромным поклонником, но все же очень новичок в этом. У меня возникают проблемы с выбором: после выбора с помощью JSS. Возможно ли это, потому что я думал, что это при чтении документов.

Это моя отметка:

<Link to="about" className={classes.link}>About</Link>

и мой JSS выглядит так:

link: {
    position: 'relative',
    fontFamily: fonts.family.primary
    '&:before': {
        content: ' ',
        position: 'absolute',
        bottom: 0,
        left: 50,
        width: '100%',
        height: '1rem',
        display: 'block',
        background:styles.colors.white
    }
}

если кто-нибудь, кто знаком с JSS, может помочь, это было бы здорово!

Ответ 1

То, что вы сделали, правильно. За исключением двух вещей:

1) Синтаксическая ошибка: вам не хватает запятой после записи fontFamily: fonts.family.primary

2) Содержимое должно быть строкой, заключенной в двойные кавычки, которая, в свою очередь, должна быть заключена в одинарные кавычки. Таким образом, пустой контент будет content: '""',

Итак, просто попробуйте следующее:

link: {
    position: 'relative',
    fontFamily: fonts.family.primary,
    '&:before': {
        content: '""',
        position: 'absolute',
        bottom: 0,
        left: 50,
        width: '100%',
        height: '1rem',
        display: 'block',
        background:styles.colors.white
    }
}