chore(api): Remove screenshots from EmbedLiveSample calls (#32505)

* chore(api): Remove screenshots from EmbedLiveSample calls

* chore(api): Remove screenshots from EmbedLiveSample calls

Author: bsmth

files/en-us/web/api/canvas_api/tutorial/applying_styles_and_colors/canvas-grid.png

@@ -64,7 +64,7 @@ draw();
 
 The result looks like this:
 
-{{EmbedLiveSample("A_fillStyle_example", 160, 160, "canvas_fillstyle.png")}}
+{{EmbedLiveSample("A_fillStyle_example", "", "160")}}
 
 ### A `strokeStyle` example
 
@@ -96,7 +96,7 @@ draw();
 
 The result looks like this:
 
-{{EmbedLiveSample("A_strokeStyle_example", "180", "180", "canvas_strokestyle.png")}}
+{{EmbedLiveSample("A_strokeStyle_example", "", "160")}}
 
 ## Transparency
 
@@ -156,7 +156,7 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("A_globalAlpha_example", "180", "180", "canvas_globalalpha.png")}}
+{{EmbedLiveSample("A_globalAlpha_example", "", "160")}}
 
 ### An example using `rgb()` with alpha transparency
 
@@ -194,7 +194,7 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("An_example_using_rgb_with_alpha_transparency", "180", "180", "canvas_rgb.png")}}
+{{EmbedLiveSample("An_example_using_rgb_with_alpha_transparency", "", "160")}}
 
 ## Line styles
 
@@ -246,7 +246,7 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("A_lineWidth_example", "180", "180", "canvas_linewidth.png")}}
+{{EmbedLiveSample("A_lineWidth_example", "", "160")}}
 
 Obtaining crisp lines requires understanding how paths are stroked. In the images below, the grid represents the canvas coordinate grid. The squares between gridlines are actual on-screen pixels. In the first grid image below, a rectangle from (2,1) to (5,5) is filled. The entire area between them (light red) falls on pixel boundaries, so the resulting filled rectangle will have crisp edges.
 
@@ -313,7 +313,7 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("A_lineCap_example", "180", "180", "Canvas_linecap.png")}}
+{{EmbedLiveSample("A_lineCap_example", "", "160")}}
 
 ### A `lineJoin` example
 
@@ -355,7 +355,7 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("A_lineJoin_example", "180", "180", "Canvas_linejoin.png")}}
+{{EmbedLiveSample("A_lineJoin_example", "", "160")}}
 
 ### A demo of the `miterLimit` property
 
@@ -436,7 +436,7 @@ document.getElementById("miterLimit").value = document
 draw();
 ```
 
-{{EmbedLiveSample("A_demo_of_the_miterLimit_property", "400", "180", "canvas_miterlimit.png")}}
+{{EmbedLiveSample("A_demo_of_the_miterLimit_property", "", "180")}}
 
 ### Using line dashes
 
@@ -471,7 +471,7 @@ function march() {
 march();
 ```
 
-{{EmbedLiveSample("Using_line_dashes", "120", "120", "marching-ants.png")}}
+{{EmbedLiveSample("Using_line_dashes")}}
 
 ## Gradients
 
@@ -545,7 +545,7 @@ The first is a background gradient. As you can see, we assigned two colors at th
 
 In the second gradient, we didn't assign the starting color (at position 0.0) since it wasn't strictly necessary, because it will automatically assume the color of the next color stop. Therefore, assigning the black color at position 0.5 automatically makes the gradient, from the start to this stop, black.
 
-{{EmbedLiveSample("A_createLinearGradient_example", "180", "180", "canvas_lineargradient.png")}}
+{{EmbedLiveSample("A_createLinearGradient_example", "", "160")}}
 
 ### A `createRadialGradient` example
 
@@ -600,7 +600,7 @@ In this case, we've offset the starting point slightly from the end point to ach
 
 The last color stop in each of the four gradients uses a fully transparent color. If you want to have a nice transition from this to the previous color stop, both colors should be equal. This isn't very obvious from the code because it uses two different CSS color methods as a demonstration, but in the first gradient `#019F62 = rgb(1 159 98 / 100%)`.
 
-{{EmbedLiveSample("A_createRadialGradient_example", "180", "180", "canvas_radialgradient.png")}}
+{{EmbedLiveSample("A_createRadialGradient_example", "", "160")}}
 
 ### A `createConicGradient` example
 
@@ -648,7 +648,7 @@ The first gradient is positioned in the center of the first rectangle and moves
 
 The second gradient is also positioned at the center of it's second rectangle. This one has multiple color stops, alternating from black to white at each quarter of the rotation. This gives us the checkered effect.
 
-{{EmbedLiveSample("A_createConicGradient_example", "180", "180", "canvas_conicgrad.png")}}
+{{EmbedLiveSample("A_createConicGradient_example", "", "160")}}
 
 ## Patterns
 
@@ -706,7 +706,7 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("A_createPattern_example", "180", "180", "canvas_createpattern.png")}}
+{{EmbedLiveSample("A_createPattern_example", "", "160")}}
 
 ## Shadows
 
@@ -756,7 +756,7 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("A_shadowed_text_example", "180", "100", "shadowed-string.png")}}
+{{EmbedLiveSample("A_shadowed_text_example")}}
 
 We will look at the `font` property and `fillText` method in the next chapter about [drawing text](/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_text).
 
@@ -791,6 +791,6 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("Canvas_fill_rules", "110", "110", "fill-rule.png")}}
+{{EmbedLiveSample("Canvas_fill_rules")}}
 
 {{PreviousNext("Web/API/Canvas_API/Tutorial/Drawing_shapes", "Web/API/Canvas_API/Tutorial/Drawing_text")}}

files/en-us/web/api/canvas_api/tutorial/applying_styles_and_colors/canvas_conicgrad.png

@@ -101,7 +101,7 @@ In the first few lines of code, we draw a black rectangle the size of the canvas
 
 Everything that's drawn after creating the clipping path will only appear inside that path. You can see this clearly in the linear gradient that's drawn next. After this a set of 50 randomly positioned and scaled stars is drawn, using the custom `drawStar()` function. Again the stars only appear inside the defined clipping path.
 
-{{EmbedLiveSample("A_clip_example", "180", "190", "canvas_clip.png")}}
+{{EmbedLiveSample("A_clip_example", "", "160")}}
 
 ### Inverse clipping path
 
@@ -177,6 +177,6 @@ function drawStar(ctx, r) {
 draw();
 ```
 
-{{EmbedLiveSample("Hole_in_rectangle", 160, 160, "inverse_clipping_path.png")}}
+{{EmbedLiveSample("Hole_in_rectangle", "", "160")}}
 
 {{PreviousNext("Web/API/Canvas_API/Tutorial/Transformations", "Web/API/Canvas_API/Tutorial/Basic_animations")}}

files/en-us/web/api/canvas_api/tutorial/applying_styles_and_colors/canvas_createpattern.png

@@ -82,7 +82,7 @@ So far this is pretty similar to what we've done in previous sections. However o
 
 When the second `restore()` statement is called, the original state (the one we set up before the first call to `save`) is restored and the last rectangle is once again drawn in black.
 
-{{EmbedLiveSample("A_save_and_restore_canvas_state_example", "180", "190", "canvas_savestate.png")}}
+{{EmbedLiveSample("A_save_and_restore_canvas_state_example", "", "160")}}
 
 ## Translating
 
@@ -124,7 +124,7 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("A_translate_example", "160", "190", "translate.png")}}
+{{EmbedLiveSample("A_translate_example")}}
 
 ## Rotating
 
@@ -185,7 +185,7 @@ To rotate the rectangle around its own center, we translate the canvas to the ce
 draw();
 ```
 
-{{EmbedLiveSample("A_rotate_example", "310", "260", "rotate.png")}}
+{{EmbedLiveSample("A_rotate_example", "", "160")}}
 
 ## Scaling
 
@@ -227,7 +227,7 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("A_scale_example", "160", "190", "scale.png")}}
+{{EmbedLiveSample("A_scale_example", "", "160")}}
 
 ## Transforms
 
@@ -291,6 +291,6 @@ function draw() {
 draw();
 ```
 
-{{EmbedLiveSample("Example_for_transform_and_setTransform", "230", "290", "canvas_transform.png")}}
+{{EmbedLiveSample("Example_for_transform_and_setTransform", "", "160")}}
 
 {{PreviousNext("Web/API/Canvas_API/Tutorial/Using_images", "Web/API/Canvas_API/Tutorial/Compositing")}}