Aktivieren von benutzerdefiniertem CSS/HTML

[lyseoy]

Ich habe einige benutzerdefinierte CSS- und HTML-Änderungen hinzugefügt. In der Vorschau sieht alles großartig aus.

Jetzt möchte ich diese Änderungen committen, aber wie? Ich sehe keine entsprechenden Befehle, und ich habe versucht, die Discourse-App neu zu erstellen, aber es passiert nichts.

Meine Suchen ergeben keine Ergebnisse. Das ist wahrscheinlich so einfach, dass noch niemand gefragt hat, wie man das macht, aber für diesen Noob wäre ein Hinweis hilfreich…

[Bcat]

Das scheint irrelevant, aber ich verstehe es nicht wirklich.

[Vaping_Community]

@lyseoy

Ich habe etwas benutzerdefiniertes CSS und HTML hinzugefügt.

Wo? Benutzerdefiniertes Theme, Standard-Theme?
Allgemeines CSS / Desktop-CSS / Mobile-CSS?
Mehr Details zu dem, was Sie getan haben, wären hilfreich.

Normalerweise wählen Sie einfach ein Theme unter /admin/customize/themes aus und machen Folgendes:

Sobald Sie auf den Speichern-Button klicken, werden die Änderungen fast sofort angezeigt, solange das bearbeitete Theme aktiv ist.

[lyseoy]

Was du gemacht hast. Im Video. Nur dass ich die Änderungen erst sehe, wenn ich auf die Schaltfläche Vorschau klicke.

[Vaping_Community]

Haben Sie das Theme als aktives Standard-Theme ausgewählt? Sehen Sie das grüne Häkchen?

[lyseoy]

Ja. Ich habe das Standard-Lichtthema bearbeitet, und es ist aktiv und standardmäßig eingestellt.

[Vaping_Community]

Okay, kannst du bitte die Änderungen auflisten, die du vorgenommen hast?

Ein Link zur Website wäre ebenfalls hilfreich.

[lyseoy]

CSS:

@import url("https://fonts.googleapis.com/css?family=Open+Sans:400, 400i, 700");
    .docked #main-outlet {
    margin-top: 0;
}
.docked nav#bar {
    display: none;
}
nav#bar {
    font-family: 'Open Sans',  sans-serif;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
}
nav#bar ul {
    display: inline-flex;
    list-style-type: none;
    margin: 0 0 0 25px;
    align-items: center;
}
nav#bar ul li {
    margin-left: 20px;
}
@media (max-width: 650px) {
    nav#bar {
    flex-wrap: wrap;
    justify-content: center;
}
nav#bar #logo {
    display: flex;
    justify-content: center;
    flex-basis: 100%}
nav#bar #logo img {
    width: 120px;
}
nav#bar ul li {
    margin-left: 8px;
}
nav#bar ul li a {
    font-size: 14px;
}
nav#bar ul li a.www-btn {
    padding: 3px 8px 5px;
}
}
nav#bar li a {
    text-decoration: none;
    color: #333;
}
nav#bar li a:hover {
    border-bottom: 5px solid;
}
nav#bar li:nth-of-type(1) a:hover {
    border-color: #D13239;
}
nav#bar li:nth-of-type(2) a:hover {
    border-color: #f15c22;
}
nav#bar li:nth-of-type(3) a:hover {
    border-color: #F2E88F;
}
nav#bar li:nth-of-type(4) a:hover {
    border-color: #00953A;
}
nav#bar li:nth-of-type(5) a {
    font-weight: bold;
}
nav#bar li:nth-of-type(5) a:hover {
    border-color: #14A0F4;
}
nav#bar img {
    width: 150px;
    height: auto;
    max-height: 40px;
}
nav#bar .www-btn {
    border: none;
    border-radius: 100px;
    background: #13a0f5;
    color: #fff;
    padding: 5px 20px 7px;
}
nav#bar .www-btn.big {
    font-size: 1.5rem;
    padding: 7px 30px 10px 30px;
}
nav#bar .www-btn:hover {
    background: #0a5783;
}
nav#bar .www-btn:active {
    background: #08476b;
    box-shadow: none;
}
nav#bar a.www-btn {
    text-decoration: none;
    color: #fff !important;
}
.d-header {
    background: linear-gradient(-90deg,  #F2E88F,  #a3e6ff);
    background-size: 100% 100%;
    background-repeat: repeat-x;
    box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.15);
}
.d-header .icons .icon {
    color: #555;
}

Ich werde demnächst den Inhalt des Headers posten. Das Forum rendert den HTML-Code ständig, sobald ich ihn einfüge…

[Vaping_Community]

@lyseoy

nav#bar #logo {
    display: flex;
    justify-content: center;
    flex-basis: 100%}

Das ist falsch, es sollte sein:

nav#bar #logo {
    display: flex;
    justify-content: center;
    flex-basis: 100%;
}

[lyseoy]

Das war’s! Gut gemacht, du hast ein scharfes Auge!

Komisch, dass die Vorschau diesen Syntaxfehler nicht bemerkt hat.

[Vaping_Community]

Schön, dass es funktioniert hat

• Fehler in deinem CSS machen das gesamte CSS ungültig.
• Ich habe die Vorschau noch nie verwendet, daher kann ich dazu nichts sagen.
• Ich bin mir sicher, dass es früher eine Fehlermeldung auf der Seite gab

Ach ja, und alles Gute zum Geburtstag @tshenry Hab einen schönen Tag!