Skip to content

Commit

Permalink
Merge branch 'master' into dev/mara/docs-dsp-tasks
Browse files Browse the repository at this point in the history
  • Loading branch information
rajamatt committed May 9, 2024
2 parents 8c199e8 + 4d87b4c commit 8cb8b38
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 6 deletions.
Binary file modified doc/assets/material-theme-builder-export2.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
17 changes: 11 additions & 6 deletions doc/material-dsp.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,18 +51,23 @@ It is possible to configure the import process. The _UnoDspImportColors_ item fo
> [!NOTE]
> The Uno.Sdk will automatically include this configuration for you. Creating a new project with the *CSharpMarkup* feature will automatically set the generator attribute to *csharp*. It will set the generator to *xaml* by default.
## Generating a custom color palette and export as DSP file
## Generating a custom color palette and exporting it as a JSON file

1. Navigate to the [Material Theme Builder](https://m3.material.io/theme-builder#/custom) and select the colors you want to use for your application.
2. Locate the _Export_ button and pick the _material Tokens (DSP)_ format.
2. Locate the _Export_ button and pick the _Material Theme (JSON)_ format.

![Export Button](assets/material-theme-builder-export1.png) ![DSP Selection](assets/material-theme-builder-export2.png)
3. Save the zip file to your computer.
4. Replace the file `ColorPaletteOverride.zip` in the `Styles` folder of your application project with the one you just downloaded.
5. Build your application. The `ColorPaletteOverride.xaml` file will be automatically updated with the colors present in the DSP zip file.
3. Save the file to your computer.
4. Replace the `ColorPaletteOverride.json` file in the `Styles` folder of your application project with the one you just downloaded.
5. Build your application. The `ColorPaletteOverride.xaml` file will be automatically updated with the colors present in the JSON file.

## More flexibility

This will generate the file at each build, potentially overriding any changes you made to the file. If you want to keep it that way, you can simply remove the `ColorPaletteOverride.zip` file from the `Styles` folder, the file won't get overwritten anymore.
This will generate the file at each build, potentially overriding any changes you made to the file. If you want to keep it that way, you can simply remove the `ColorPaletteOverride.json` file from the `Styles` folder, the file won't get overwritten anymore.

Alternatively, you can also use the [Uno.Dsp.Cli](https://nuget.org/packages/Uno.Dsp.Cli) package to generate the file from the command line. This will allow you to generate the file only when you want to, and not at each build.

> [!NOTE]
> Although the **Material Theme Builder Tool** doesn't export **Material Tokens (DSP)** packages anymore, the Uno Figma Plugin still supports this file format.
> To be able to import DSP packages just follow the same steps described previously and save the downloaded DSP zip file as `ColorPaletteOverride.zip` in the `Styles` folder of your application project.
> In that case, make sure to delete the `material-theme.json` file from `Styles` folder before building your application, to avoid conflicts.

0 comments on commit 8cb8b38

Please sign in to comment.