diff --git a/frontend/src/component/demo/demo-topics.tsx b/frontend/src/component/demo/demo-topics.tsx
index a0022fa257..0b3224520e 100644
--- a/frontend/src/component/demo/demo-topics.tsx
+++ b/frontend/src/component/demo/demo-topics.tsx
@@ -72,10 +72,7 @@ export const TOPICS: ITutorialTopic[] = [
The simplest way to use a feature toggle is to
enable or disable it for everyone (on/off).
- }
- >
+ }>
Look at the demo page when toggling!
>
@@ -205,10 +202,7 @@ export const TOPICS: ITutorialTopic[] = [
Enter your userId
- }
- >
+ }>
You can find your userId on the demo page.
>
@@ -244,10 +238,7 @@ export const TOPICS: ITutorialTopic[] = [
Finally, toggle{' '}
demoApp.step2
- }
- >
+ }>
Look at the demo page to see your changes!
>
@@ -296,8 +287,9 @@ export const TOPICS: ITutorialTopic[] = [
target: `a[href="${basePath}/projects/${PROJECT}/features/demoApp.step3"]`,
content: (
- First, let's open the feature toggle configuration for{' '}
- demoApp.step3
+ First, open the feature toggle configuration for{' '}
+ demoApp.step3 by using this
+ link.
),
preventDefault: true,
@@ -308,7 +300,7 @@ export const TOPICS: ITutorialTopic[] = [
content: (
Expand the environment card to see all the defined
- strategies.
+ strategies by using the arrow button.
),
},
@@ -316,7 +308,8 @@ export const TOPICS: ITutorialTopic[] = [
target: `div[data-testid="FEATURE_ENVIRONMENT_ACCORDION_${ENVIRONMENT}"].Mui-expanded a[data-testid="STRATEGY_EDIT-flexibleRollout"]`,
content: (
- Edit the existing gradual rollout strategy.
+ Edit the existing gradual rollout strategy by using the
+ "Edit" button.
),
backCollapseExpanded: true,
@@ -324,18 +317,35 @@ export const TOPICS: ITutorialTopic[] = [
{
target: 'span[data-testid="ROLLOUT_SLIDER_ID"]',
content: (
- Change the rollout percentage.
+ <>
+
+ Change the rollout percentage by adjusting the
+ percentage slider.
+
+
+ When you're done, use the "Next" button in the
+ dialog.
+
+ >
),
backCloseModal: true,
nextButton: true,
},
{
target: 'button[data-testid="STRATEGY_FORM_SUBMIT_ID"]',
- content: Save your strategy.,
+ content: (
+
+ Save and apply your strategy by using this button.
+
+ ),
},
{
target: 'button[data-testid="DIALOGUE_CONFIRM_ID"]',
- content: Confirm your changes.,
+ content: (
+
+ Confirm your changes by using this button.
+
+ ),
optional: true,
backCloseModal: true,
},
@@ -345,13 +355,10 @@ export const TOPICS: ITutorialTopic[] = [
content: (
<>
- Finally, toggle{' '}
- demoApp.step3
+ Finally, enable or disable the feature with the new
+ variant by toggling the highlighted switch.
- }
- >
+ }>
Look at the demo page to see your changes!
>
@@ -514,10 +521,7 @@ export const TOPICS: ITutorialTopic[] = [
Enter your userId
- }
- >
+ }>
You can find your userId on the demo page.