fix(curriculum): make color percentage requirements clearer (freeCodeCamp#56607)

Author: lasjorg

curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9904.md

@@ -17,7 +17,9 @@ gradient-type(
 );
 ```
 
-Fill in `.bb3` with a `repeating-linear-gradient`. Use `90deg` for the direction, your `building-color3` for the first two colors, and `window-color3` at `15%` for the third. When you don't specify a distance for a color, it will use the values that makes sense. In this case, the first two colors will default to `0%` and `7.5%` because it starts at `0%`, and `7.5%` is half of the `15%`.
+Fill in `.bb3` with a `repeating-linear-gradient`. Use `90deg` for the direction, your `building-color3` for the first two colors, and `window-color3` at `15%` for the third.
+
+When you don't specify a distance for a color, it will use the values that makes sense. In this case, the first two colors will default to `0%` and `7.5%` because it starts at `0%`, and `7.5%` is half of the `15%`, so you do not need to set them.
 
 # --hints--
 
@@ -33,6 +35,18 @@ You should use `90deg` for the direction in the first argument of `repeating-lin
 assert.include(new __helpers.CSSHelp(document).getStyle(".bb3")?.getPropVal('background', true), "repeating-linear-gradient(90deg");
 ```
 
+You should not set the percentage for the first color.
+
+```js
+assert.notInclude(new __helpers.CSSHelp(document).getStyle(".bb3")?.getPropVal('background', true), "var(--building-color3)0%");
+```
+
+You should not set the percentage for the second color.
+
+```js
+assert.notInclude(new __helpers.CSSHelp(document).getStyle(".bb3")?.getPropVal('background', true), "var(--building-color3)7.5%");
+```
+
 You should use `--building-color3` for the first two colors.
 
 ```js