Comment remplacer une variable de couleur pour un seul thème uniquement ?

[smrtey]

Voici les instructions beaucoup trop détaillées. Faites-moi savoir si cela ne fonctionne pas comme annoncé.

1. Créez un compte GitHub si vous n’en avez pas déjà un.

2. Dans Discourse, exportez votre thème :
   Admin → Personnaliser → Sélectionnez le thème que vous souhaitez exporter
   

   
   
   Cela enregistre le thème sous forme de fichier .zip sur votre ordinateur.

3. Extrayez les fichiers sur votre ordinateur.

4. Allez sur GitHub et créez un nouveau dépôt :
   

   
   
   
   

5. Cliquez sur « uploader un fichier existant »
   

   

6. Faites glisser les dossiers et fichiers décompressés du thème que vous avez exporté (ce sera quelque chose comme) :
   

   
   
   depuis votre ordinateur vers votre dépôt, puis cliquez sur « Valider les modifications »

7. Vous pouvez maintenant éditer le fichier about.json. Cliquez sur le nom du fichier
   
   

Le fichier ressemblera à ceci :

{
  "name": "Default",
  "component": false,
  "license_url": null,
  "about_url": null,
  "authors": null,
  "theme_version": null,
  "minimum_discourse_version": null,
  "maximum_discourse_version": null,
  "assets": {
    "badge": "assets/badge.png"
  },
  "color_schemes": {
    "blue-light": {
      "primary": "22262a",
      "secondary": "fefefe",
      "tertiary": "2572e4",
      "quaternary": "518ee9",
      "header_background": "1550a7",
      "header_primary": "fcfcfc",
      "highlight": "9edaf5",
      "danger": "ff7114",
      "success": "85cc54",
      "love": "de0100"    
    }
  },
  "learn_more": "https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966"
}

8. Cliquez sur l’icône du crayon pour modifier.

Vous pouvez maintenant le modifier. Je recommande de changer le nom du schéma de couleurs ; sinon, lorsque vous réimporterez le thème sur votre site, vous vous retrouverez avec deux schémas de couleurs différents portant le même nom. Ainsi, ci-dessous, j’ai changé "blue-light": { en "blue-lite": {

Ajoutez simplement vos remplacements de variables de couleur à la fin du schéma de couleurs après love et assurez-vous d’inclure une virgule après la valeur de love.

  "name": "Default",
  "component": false,
  "license_url": null,
  "about_url": null,
  "authors": null,
  "theme_version": null,
  "minimum_discourse_version": null,
  "maximum_discourse_version": null,
  "assets": {
    "badge": "assets/badge.png"
  },
  "color_schemes": {
    "blue-lite": {
      "primary": "22262a",
      "secondary": "fefefe",
      "tertiary": "2572e4",
      "quaternary": "518ee9",
      "header_background": "1550a7",
      "header_primary": "fcfcfc",
      "highlight": "9edaf5",
      "danger": "ff7114",
      "success": "85cc54",
      "love": "de0100",
      "primary-high": "333333",
      "primary-medium": "666666",
      "primary-low-mid": "999999",
      "primary-low": "cccccc"    
    }
  },
  "learn_more": "https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966"
}

9. Cliquez sur « Valider les modifications »

10. Cliquez sur le nom du dépôt pour revenir à la page principale du dépôt
    

    

11. Copiez le lien Cloner ou Télécharger
    

    

12. Dans Discourse, importez votre thème :
    Admin → Personnaliser → Installer → À partir d’un dépôt git : Collez le lien et installez
    

    

13. Vous pouvez maintenant modifier ce thème comme n’importe quel thème local avec vos valeurs personnalisées $primary-high, $primary-medium, $primary-low-mid et $primary-low.