Wie man die ‚neue‘ Grafik auf neue Themen anwendet

Als ich mich heute in der Community angemeldet habe, ist mir eine rote „Neu“-Flagge aufgefallen, wie hier gezeigt.


Wie wurde die rote „Neu!“-Flagge erreicht? Da wir täglich Artikel veröffentlichen werden, möchte ich sie verwenden, um neue Themen zu kennzeichnen. Wie oder was wurde verwendet, um die Flagge zu erstellen?
Danke

1 „Gefällt mir“
.badge-notification.new-topic::before {
    content: "Neu!";
    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);
}

7 „Gefällt mir“

Vielen Dank. Ich gehe davon aus, dass dies als Komponente hinzugefügt wird, richtig?
Da es sich um eine globale Änderung handelt, die für alle Themes gilt, spielt es eine Rolle, ob der Speicherort „head“, „body“ usw. ist?

Ich schlage vor, Sie erstellen eine Themenkomponente, nennen sie benutzerdefiniertes CSS und fügen das gesamte benötigte CSS hinzu.

2 „Gefällt mir“

Hallo, danke für den Tipp. Allerdings verwende ich für “New” auf Französisch eine längere Übersetzung (Nouveau), und das Wort wird abgeschnitten. Wissen Sie, wie man das lösen kann? Danke. @sheng_hualuo

Versuchen Sie, die folgenden Eigenschaften hinzuzufügen

    height: auto;
    width: auto;

Wenn es das ist, was Sie meinen:

3 „Gefällt mir“

Danke @Arkshine, das funktioniert!

1 „Gefällt mir“

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.