Как применить «новый» графический элемент к новым темам

[oga]

Когда я сегодня зашел в сообщество, я заметил красный флаг «Новое», как показано здесь.

Как был получен красный флаг «Новое!»? Поскольку мы будем публиковать статьи ежедневно, я хотел бы использовать его для отметки новых тем. Как или что использовалось для создания флага?
Спасибо

[sheng_hualuo (花落晓斩神)]

.badge-notification.new-topic::before {
    content: "Новое!";
    position: absolute;
    right: -1.1em;
    top: -0.85em;
    background: var(--quaternary);
    transform: rotate(12deg);
    font-size: var(--font-down-2);
    letter-spacing: .05em;
    padding: .2em .5em;
    border-radius: 4px;
    font-weight: normal;
    color: var(--secondary);
}

[oga]

Большое спасибо. Я предполагаю, что это будет добавлено как компонент, верно? Поскольку это глобальное изменение, которое применяется ко всем темам, имеет ли значение, где оно размещено: в “head”, “body” и т.д.?

[sheng_hualuo (花落晓斩神)]

Я предлагаю создать компонент темы, назвать его «Custom CSS» и добавить все необходимые CSS-стили.

[patrickemin]

Привет, спасибо за подсказку. Однако я использую перевод слова «New» на французский — «Nouveau», которое длиннее, и из-за этого слово обрезается. Не подскажете, как это исправить? Спасибо. @sheng_hualuo

[Arkshine]

Попробуйте добавить следующие свойства

    height: auto;
    width: auto;

Если вы имели в виду это:

[patrickemin]

Спасибо, @Arkshine, это работает!