Skip to content

Commit 62a4eab

Browse files
committed
docs(customization): update UI customization guide
- Remove reference to "taking ownership" of packages - Clarify creating a private copy for customization - Update step titles and descriptions - Remove redundant conclusion statement
1 parent 996a129 commit 62a4eab

File tree

1 file changed

+7
-7
lines changed

1 file changed

+7
-7
lines changed

src/content/docs/customization/guide-customizing-the-ui.mdx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
11
---
22
title: 'Guide: Customizing the UI Theme'
3-
description: A practical, step-by-step guide to customizing the UI theme by taking ownership of the ui_kit package.
3+
description: A practical, step-by-step guide to customizing the UI theme by creating a private copy of the ui_kit package.
44
---
55
import { Steps, Aside } from '@astrojs/starlight/components';
66

77
This guide provides a hands-on, practical walkthrough of the most common and impactful customization task: changing the application's visual theme.
88

9-
By following this guide, you will learn the complete, end-to-end workflow for modifying a shared package and seeing that change reflected in both the Mobile Client and the Web Dashboard. This process is the key to unlocking the full customization potential of the toolkit.
9+
By following this guide, you will learn the complete, end-to-end workflow for modifying a shared package and seeing that change reflected in both the Mobile Client and the Web Dashboard.
1010

1111
### The Goal
1212

13-
Our goal is to change the default blue accent color of the application to a new color, for example, deep purple. To do this, we will take ownership of the `ui_kit` package, modify its theme file, and then instruct both of our Flutter applications to use our modified version.
13+
Our goal is to change the default blue accent color of the application to a new color, for example, deep purple. To do this, we will create a private copy of the `ui_kit` package, modify its theme file, and then instruct both of our Flutter applications to use our modified version.
1414

1515
<Steps>
16-
1. **Take Ownership of the `ui_kit` Package**
16+
1. **Host a Private Copy of the `ui_kit` Package**
1717

1818
Before you can change any code, you must have your own version of the `ui_kit` package hosted in a private repository.
1919

20-
- Follow the [**Taking Ownership of Packages**](/docs/architecture/02-taking-ownership-of-packages/) guide from start to finish, but for the `ui_kit` repository.
20+
- Follow the [**Hosting Packages for Customization**](/docs/customization/hosting-packages-for-customization/) guide from start to finish, but for the `ui_kit` repository.
2121
- **Clone URL:** `https://github.com/flutter-news-app-full-source-code/ui-kit.git`
2222

2323
Once you have successfully pushed the `ui_kit` code to your own private GitHub repository, you are ready to proceed.
@@ -30,7 +30,7 @@ Our goal is to change the default blue accent color of the application to a new
3030
- Locate the `_commonSubThemesData` constant. This is where you can make global changes to widget styles.
3131
- Let's change the `appBarBackgroundSchemeColor` to `primary` to make the app bar more prominent.
3232

33-
```dart title="packages/ui-kit/lib/src/theme/app_theme.dart"
33+
```dart title="ui_kit/lib/src/theme/app_theme.dart"
3434
const FlexSubThemesData _commonSubThemesData = FlexSubThemesData(
3535
// ...
3636
// Change the app bar background color
@@ -90,4 +90,4 @@ Our goal is to change the default blue accent color of the application to a new
9090

9191
### Conclusion
9292

93-
You have successfully completed the core customization workflow. You now have a privately owned and modified `ui_kit` package that is consumed by both of your client applications. You can use this exact same process to customize any other shared package in the toolkit.
93+
You have successfully completed the core customization workflow. You now have a privately hosted and modified `ui_kit` package that is consumed by both of your client applications. You can use this exact same process to customize any other shared package in the toolkit.

0 commit comments

Comments
 (0)