From 25b1397d665f74dd56598e03e3e3c7b4a96010c8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=F0=9D=99=A0=F0=9D=99=9A=F0=9D=99=A3=F0=9D=99=96?= =?UTF-8?q?=F0=9D=99=9E=F0=9D=99=A1?= Date: Wed, 12 Nov 2025 00:48:46 +0530 Subject: [PATCH] fix(curriculum): improve step 3 description and add example in build-a-heart (#63692) Co-authored-by: Huyen Nguyen <25715018+huyenltnguyen@users.noreply.github.com> --- .../686daa7ed79ceacd0b264e7e.md | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/curriculum/challenges/english/blocks/workshop-build-a-heart-icon/686daa7ed79ceacd0b264e7e.md b/curriculum/challenges/english/blocks/workshop-build-a-heart-icon/686daa7ed79ceacd0b264e7e.md index 53c44b09e21..d2ba01652fd 100644 --- a/curriculum/challenges/english/blocks/workshop-build-a-heart-icon/686daa7ed79ceacd0b264e7e.md +++ b/curriculum/challenges/english/blocks/workshop-build-a-heart-icon/686daa7ed79ceacd0b264e7e.md @@ -7,12 +7,19 @@ dashedName: step-3 # --description-- -You are getting closer. The next thing to do is to set the `viewBox` attribute of the `svg` element. This will -control how much of the image is visible. The first two numbers set the center of the image. +You are getting closer, now look at this example: -The following two numbers set the size of the image we can see: width followed by height. +```html + + +``` -Since here the entirety of the icon should be visible, you should set the `viewBox` attribute to `0 0 24 24`. +The `viewBox` attribute controls what part of the image is visible inside the SVG. + +- The first two numbers (`0 0`) set the starting position of the `viewBox` — the top-left corner (x and y). +- The next two numbers (`50 50`) define the `viewBox`'s width and height. + +Set the `viewBox` attribute to `0 0 24 24`. # --hints--