aboutsummaryrefslogtreecommitdiff
path: root/files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experiment/index.html
diff options
context:
space:
mode:
authorjulieng <julien.gattelier@gmail.com>2021-11-15 21:45:09 +0100
committerSphinxKnight <SphinxKnight@users.noreply.github.com>2021-11-15 22:10:33 +0100
commitf36cc6a7639a8f1adff02bc7a152bd7f54ceae6d (patch)
treea977e8bdefcbd40b40cd7812628da7bd95b48e10 /files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experiment/index.html
parent241dda7e8117b4ec0c843e3875a10e9f4aa7da7b (diff)
downloadtranslated-content-f36cc6a7639a8f1adff02bc7a152bd7f54ceae6d.tar.gz
translated-content-f36cc6a7639a8f1adff02bc7a152bd7f54ceae6d.tar.bz2
translated-content-f36cc6a7639a8f1adff02bc7a152bd7f54ceae6d.zip
move *.html to *.md
Diffstat (limited to 'files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experiment/index.html')
-rw-r--r--files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experiment/index.html161
1 files changed, 0 insertions, 161 deletions
diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experiment/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experiment/index.html
deleted file mode 100644
index 5bf66f5ad3..0000000000
--- a/files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experiment/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: theme expérimentation
-slug: Mozilla/Add-ons/WebExtensions/manifest.json/theme_experiment
-tags:
- - Add-ons
- - Browser
- - Customisation
- - Customise
- - Design
- - Look and Feel
- - Themes
- - colors
- - navigatuer
- - theme manifest
-translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/theme_experiment
-original_slug: Mozilla/Add-ons/WebExtensions/manifest.json/theme_experimentation
----
-<div>{{AddonSidebar}}</div>
-
-<table class="standard-table">
- <tbody>
- <tr>
- <th scope="row" style="width: 30%;">Type</th>
- <td><code>Object</code></td>
- </tr>
- <tr>
- <th scope="row">Obligatoire</th>
- <td>Non</td>
- </tr>
- <tr>
- <th scope="row">Exemple</th>
- <td>
- <pre class="brush: json">
-"theme_experiment": {
- "stylesheet": "style.css",
- "colors": {
- "popup_affordance": "--arrowpanel-dimmed"
- },
- "images": {
- "theme_toolbar": "--toolbar-bgimage"
- },
- "properties": {
- "toolbar_image_alignment":
- "--toolbar-bgalignment"
- }
-}</pre>
- </td>
- </tr>
- </tbody>
-</table>
-
-<p>Cette clé permet de définir les propriétés de la clé expérimentale de <code><a href="/fr/docs/Mozilla/Add-ons/WebExtensions/manifest.json/theme">theme</a></code> pour l'interface Firefox. Ces expériences sont un précurseur pour proposer de nouvelles fonctionnalités thématiques à inclure dans Firefox. L'expérimentation se fait par:</p>
-
-<ul>
- <li>créer une feuille de style qui définit les correspondances entre les sélecteurs CSS internes pour les éléments d'interface utilisateur Firefox et les variables CSS arbitraires. Les variables CSS sont ensuite mappées dans les objets <code>colors</code>, <code>images</code>, et <code>properties</code> avec les nouvelles propriétés de clé de <code>theme</code>.</li>
- <li>(sans feuille de style) en utilisant <code>colors</code>, <code>images</code>, et <code>properties</code> pour mapper les sélecteurs CSS internes de Firefox, tels que <code>--arrowpanel-dimmed</code> vers les nouvelles propriétés de clé de <code>theme</code> key properties. Cette option limite l'expérimentation aux composants d'interface utilisateur associés à une variable CSS intégrée.</li>
-</ul>
-
-<p>Pour découvrir les sélecteurs CSS des éléments de l'interface utilisateur Firefox ou des variables CSS internes de Firefox, utilise la <a href="/fr/docs/Outils/Boîte_à_outils_du_navigateur">boite à outils du navigateur</a>.</p>
-
-<div class="note">
-<p><strong>Note :</strong> Cette clé est uniquement disponible pour une utilisation dans les canaux Firefox Developer Edition et Firefox Nightly et nécessite l'activation de la préférence <code>extensions.legacy.enabled</code>.</p>
-</div>
-
-<div class="warning">
-<p><strong>Attention :</strong> Cette fonctionnalité est expérimentale et peut être sujette à modification.</p>
-</div>
-
-<h2 id="Syntaxe">Syntaxe</h2>
-
-<p>La clé theme_experiment est un objet qui prend les propriétés suivantes :</p>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Nom</th>
- <th scope="col">Type</th>
- <th scope="col">Description</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td><code>stylesheet</code></td>
- <td><code>String</code></td>
- <td>
- <p>Facultatif</p>
-
- <p>Nom d'une feuille de style fournissant le mappage des sélecteurs CSS des éléments de l'interface Firefox aux variables CSS.</p>
- </td>
- </tr>
- <tr>
- <td><code>images</code></td>
- <td><code>Object</code></td>
- <td>
- <p>Facultatif</p>
-
- <p>Mappings des variables CSS (telles que définies dans Firefox ou par la feuille de style définie dans la <code>stylesheet</code>) aux noms de propriétés <code>images</code> à utiliser dans la clé <code><a href="/fr/docs/Mozilla/Add-ons/WebExtensions/manifest.json/theme">theme</a></code>.</p>
- </td>
- </tr>
- <tr>
- <td><code>colors</code></td>
- <td><code>Object</code></td>
- <td>
- <p>Facultatif</p>
-
- <p>Mappings des variables CSS (telles que définies dans Firefox ou par la feuille de style définie dans la <code>stylesheet</code>) aux noms de propriétés <code>colors</code> à utiliser dans la clé <code><a href="/fr/docs/Mozilla/Add-ons/WebExtensions/manifest.json/theme">theme</a></code>.</p>
- </td>
- </tr>
- <tr>
- <td><code>properties</code></td>
- <td><code>Object</code></td>
- <td>
- <p>Facultatif</p>
-
- <p>Mappings des variables CSS (telles que définies dans Firefox ou par la feuille de style définie dans la <code>stylesheet</code>) aux noms de propriétés <code>properties</code> à utiliser dans la clé <code><a href="/fr/docs/Mozilla/Add-ons/WebExtensions/manifest.json/theme">theme</a></code>.</p>
- </td>
- </tr>
- </tbody>
-</table>
-
-<h2 id="Exemples">Exemples</h2>
-
-<p>Ces exemples utilisent une feuille de style appelée <code>style.css</code> pour permettre de définir une couleur pour le bouton de recharge du navigateur dans la clé <code><a href="/fr/docs/Mozilla/Add-ons/WebExtensions/manifest.json/theme">theme</a></code>.</p>
-
-<p>La feuille de style définit :</p>
-
-<pre class="brush: css">#reload-button {
- fill: var(--reload-button-color);
-}
-</pre>
-
-<p>où <code>#reload-button</code> est le sélecteur CSS interne de Firefox pour le bouton reload et  <code>--reload-button-color</code> est un nom arbitraire..</p>
-
-<p>Dans le fichier <code>manifest.json</code>, <code>--reload-button-color</code> est alors mappé au nom à utiliser dans la propriété <code>theme</code> <code>colors</code> :</p>
-
-<pre class="brush: json">"theme_experiment": {
- "stylesheet": "style.css",
- "colors": {
- "reload_button": "--reload-button-color"
- }
-}
-</pre>
-
-<p>L'argument <code>reload_button</code> est alors utilisé de la même manière que n'importe quelle autre propriété de <code>theme</code> .</p>
-
-<pre class="brush: json">"theme": {
- "colors": {
- "reload_button": "orange"
- }
-}
-</pre>
-
-<p>Ceci a pour effet de rendre l'icône de recharge orange.</p>
-<img src="theme_experiment.png">
-
-
-<p>Cette propriété peut également être utilisée dans <code>browser.theme.update()</code>. <code>images</code> et  <code>properties</code> travaillent de la même manière que <code>colors</code>.</p>
-
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
-
-<p>{{Compat("webextensions.manifest.theme_experiment")}}</p>