Activation de CSS/HTML personnalisé

[lyseoy]

J’ai ajouté du CSS et du HTML personnalisés. J’ai vérifié l’aperçu et tout semble parfait.

Maintenant, je veux valider ces modifications, mais comment faire ? Je ne vois aucune commande pour cela, et j’ai essayé de reconstruire l’application Discourse, mais rien ne se passe.

Mes recherches n’ont rien donné. C’est probablement si simple que personne n’a jamais demandé comment faire, mais ce débutant aurait besoin d’un petit indice…

[Bcat]

Ça semble hors de propos, mais je ne comprends pas vraiment.

[Vaping_Community]

@lyseoy

J’ai ajouté du CSS et du HTML personnalisés.

Où ? Thème personnalisé, thème par défaut ?
CSS commun / CSS bureau / CSS mobile ?
Plus de détails sur ce que vous avez fait seraient utiles.

Habituellement, vous sélectionnez simplement un thème /admin/customize/themes et faites ceci :

Une fois que vous avez cliqué sur le bouton Enregistrer, les modifications s’affichent presque instantanément, à condition que le thème que vous avez modifié soit actif.

[lyseoy]

Ce que vous avez fait. Dans la vidéo. Sauf que je ne peux voir les modifications que lorsque je clique sur le bouton Aperçu.

[Vaping_Community]

Avez-vous sélectionné le thème comme thème par défaut actif ? Voyez-vous la coche verte ?

[lyseoy]

Oui. J’ai modifié le thème clair standard, et il est actif et par défaut.

[Vaping_Community]

Ok, pouvez-vous lister les modifications que vous avez apportées, s’il vous plaît ?

Un lien vers le site web serait également utile.

[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;
}

Je posterai le contenu de l’en-tête dans un instant. Le forum continue d’afficher le HTML lorsque je le colle…

[Vaping_Community]

@lyseoy

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

C’est incorrect, cela devrait être

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

[lyseoy]

C’est tout ! Très bien vu, vous avez l’œil !

C’est drôle que l’aperçu n’ait pas fait attention à cette erreur de syntaxe.

[Vaping_Community]

Content que cela fonctionne

• Toute erreur dans votre CSS rendra ce CSS invalide.
• Je n’ai jamais utilisé l’aperçu auparavant, donc je ne peux pas commenter à ce sujet.
• Je suis sûr qu’il y avait autrefois une notification d’erreur sur la page

Oh et joyeux anniversaire @tshenry :tada! Passe une bonne journée.

[system (system) A fermé ce sujet ()]

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