From 69c2f354c2648bf057d5b975610e4afbd3109ba8 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Thu, 7 Mar 2024 12:14:21 +0530
Subject: [PATCH 01/21] docs(joystick): improved link text

---
 doc/flame/inputs/other_inputs.md | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/doc/flame/inputs/other_inputs.md b/doc/flame/inputs/other_inputs.md
index 88f46b0b6c8..556e79ec462 100644
--- a/doc/flame/inputs/other_inputs.md
+++ b/doc/flame/inputs/other_inputs.md
@@ -14,7 +14,7 @@ Flame provides a component capable of creating a virtual joystick for taking inp
 To use this feature, you need to create a `JoystickComponent`, configure it the way you want, and
 add it to your game.
 
-Check this example to get a better understanding:
+Check out the following example to get a better understanding:
 
 ```dart
 class MyGame extends FlameGame {
@@ -74,12 +74,11 @@ class Player extends SpriteComponent with HasGameRef {
 }
 ```
 
-So in this example, we create the classes `MyGame` and `Player`. `MyGame` creates a joystick which is
-passed to the `Player` when it is created. In the `Player` class we act upon the current state of
-the joystick.
+So in this example, we create the classes `MyGame` and `Player`. `MyGame` creates a joystick which is passed to the `Player` when it is created. In the `Player` class we act upon the current state of the joystick.
 
 The joystick has a few fields that change depending on what state it is in.
-These are the fields that should be used to know the state of the joystick:
+
+Following are the fields that should be used to know the state of the joystick:
 
 - `intensity`: The percentage [0.0, 1.0] that the knob is dragged from the epicenter to the edge of
   the joystick (or `knobRadius` if that is set).
@@ -90,13 +89,10 @@ These are the fields that should be used to know the state of the joystick:
 If you want to create buttons to go with your joystick, check out
 [`HudButtonComponent`](#hudbuttoncomponent).
 
-A full examples of how to use it can be found
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart).
-And it can be seen running [here](https://examples.flame-engine.org/#/Input_Joystick).
+For the complete code on implementing the joystick, check out the [Joystick Example on GitHub](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart). You can also view the [JoystickComponent in action](https://examples.flame-engine.org/#/Input_Joystick) to see a live example of the joystick input function integrated into a game.
 
-There is also a more advanced example
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_advanced_example.dart)
-which is running [here](https://examples.flame-engine.org/#/Input_Joystick%20Advanced).
+For an add challenge, explore the 
+[Advanced Joystick Example on GitHub](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_advanced_example.dart). See what else the advanced features can do in the [live demo](https://examples.flame-engine.org/#/Input_Joystick%20Advanced).
 
 
 ## HudButtonComponent

From 6f7db82e3a482e6dca9955c537a2d42d2af1030b Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Thu, 7 Mar 2024 12:17:58 +0530
Subject: [PATCH 02/21] docs(gamepads): fixed link & improved link text

---
 doc/flame/inputs/other_inputs.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/doc/flame/inputs/other_inputs.md b/doc/flame/inputs/other_inputs.md
index 556e79ec462..b9e0f0fcdc6 100644
--- a/doc/flame/inputs/other_inputs.md
+++ b/doc/flame/inputs/other_inputs.md
@@ -130,8 +130,8 @@ else which isn't a pure sprite.
 
 ## Gamepad
 
-Flame has a separate plugin to support external game controllers (gamepads), check
-[here](https://github.com/flame-engine/flame_gamepad) for more information.
+Flame has a dedicated plugin to support external game controllers (gamepads). Find more information in the 
+[Gamepads repository](https://github.com/flame-engine/gamepad).
 
 
 ## AdvancedButtonComponent

From 4b6c95f7db6443e008600f90d8598215bd70f6b4 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Thu, 7 Mar 2024 12:26:14 +0530
Subject: [PATCH 03/21] docs(rendering): improved link text descriptions

---
 doc/flame/rendering/text_rendering.md | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/doc/flame/rendering/text_rendering.md b/doc/flame/rendering/text_rendering.md
index 86d544793fa..24f2aa0c91a 100644
--- a/doc/flame/rendering/text_rendering.md
+++ b/doc/flame/rendering/text_rendering.md
@@ -355,16 +355,16 @@ import 'package:flutter/painting.dart';
 import 'dart:ui' hide TextStyle;
 ```
 
-Some common properties of `TextStyle` are the following (here is the [full
-list](https://api.flutter.dev/flutter/painting/TextStyle-class.html)):
+Following are some common properties of `TextStyle`(see the [full
+list of `TextStyle` properties](https://api.flutter.dev/flutter/painting/TextStyle-class.html)):
 
 - `fontFamily`: a commonly available font, like Arial (default), or a custom font added in your
- pubspec (see [here](https://docs.flutter.dev/cookbook/design/fonts) how to do it).
+ pubspec (see [how to add a custom font](https://docs.flutter.dev/cookbook/design/fonts)).
 - `fontSize`: font size, in pts (default `24.0`).
 - `height`: height of text line, as a multiple of font size (default `null`).
 - `color`: the color, as a `ui.Color` (default white).
 
-For more information regarding colors and how to create then, see the [Colors and the
+For more information regarding colors and how to create them, see the [Colors and the
 Palette](palette.md) guide.
 
 

From 0632a040437abddf9e8ca78c64d8f0ebc38bc196 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Thu, 7 Mar 2024 12:46:33 +0530
Subject: [PATCH 04/21] docs(layout): added discernible link & alt text

---
 doc/_sphinx/theme/layout.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/doc/_sphinx/theme/layout.html b/doc/_sphinx/theme/layout.html
index 3a33826beb1..b029f1f1da7 100644
--- a/doc/_sphinx/theme/layout.html
+++ b/doc/_sphinx/theme/layout.html
@@ -83,8 +83,8 @@
     });
   </script>
 
-  <a href="{{pathto('index')}}" class="logo_image">
-    <img src="{{pathto('_static/logo_flame.png', 1)}}">
+  <a href="{{pathto('index')}}" class="logo_image" aria-label="Navigate to home page">
+    <img src="{{pathto('_static/logo_flame.png', 1)}}" alt="Flame logo: a fiery symbol along with the FLAME wordmark.">
   </a>  
   <div class="highlight-box" role="alert" style="display:none">
     <div>

From 6bf50b75d5793c1284a7ccbc88405a95f1cbd75c Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Thu, 7 Mar 2024 14:48:41 +0530
Subject: [PATCH 05/21] docs(css): improved text contrast ratio

---
 doc/_sphinx/theme/flames.css | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/doc/_sphinx/theme/flames.css b/doc/_sphinx/theme/flames.css
index b4e7b073dd0..db4bd114fbd 100644
--- a/doc/_sphinx/theme/flames.css
+++ b/doc/_sphinx/theme/flames.css
@@ -32,7 +32,7 @@ body {
 }
 
 a {
-  color: #ffbb3e;
+  color: #ff9500;
   text-decoration: none;
 }
 
@@ -40,6 +40,10 @@ a:hover {
   color: #ddbb99;
 }
 
+a:visited {
+  color: #ffbc70;
+}
+
 a:hover code {
   color: white;
 }
@@ -347,7 +351,7 @@ div.nav-left li {
 div.nav-left li > a,
 div.nav-left li > div.submenu > a.reference {
   border-radius: 5px 0 0 5px;
-  color: #9d9175;
+  color: #ff9500;
   display: block;
   font-size: 13px;
   margin-left: -5px;
@@ -431,7 +435,7 @@ div.nav-right > #toc-local > div.header {
 div.nav-right > #toc-local > a.list-group-item {
   border: none;
   border-left: 4px solid transparent;
-  color: #9d9175;
+  color: #ff9500;
   display: block;
   font-size: 13px;
   line-height: 1.2;
@@ -526,12 +530,17 @@ div.document::after { /* clearfix */
   clear: both;
 }
 
+
 div.copyright {
+  color: #d4d4d4;
   font-size: 12px;
   margin-top: 3px;
   opacity: 0.5;
 }
 
+.copyright a {
+  color: #ffae00;
+}
 div.document h1 {
   border-bottom: 1px solid #555;
   color: #ccc;
@@ -867,7 +876,7 @@ table.docutils td {
 }
 
 table.docutils th {
-  color: #9d9175;
+  color: #ff9500;
 }
 
 /* This ensures that when navigating to a link within a page, the link

From 1527a5761c544204a608b0f775009d0d2e0b7985 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Thu, 7 Mar 2024 15:23:26 +0530
Subject: [PATCH 06/21] lint(docs): fixed lint errors

---
 doc/flame/inputs/other_inputs.md | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/doc/flame/inputs/other_inputs.md b/doc/flame/inputs/other_inputs.md
index b9e0f0fcdc6..373fa35eaab 100644
--- a/doc/flame/inputs/other_inputs.md
+++ b/doc/flame/inputs/other_inputs.md
@@ -74,7 +74,9 @@ class Player extends SpriteComponent with HasGameRef {
 }
 ```
 
-So in this example, we create the classes `MyGame` and `Player`. `MyGame` creates a joystick which is passed to the `Player` when it is created. In the `Player` class we act upon the current state of the joystick.
+So in this example, we create the classes `MyGame` and `Player`. 
+`MyGame` creates a joystick which is passed to the `Player` when it is created. 
+In the `Player` class we act upon the current state of the joystick.
 
 The joystick has a few fields that change depending on what state it is in.
 
@@ -89,10 +91,15 @@ Following are the fields that should be used to know the state of the joystick:
 If you want to create buttons to go with your joystick, check out
 [`HudButtonComponent`](#hudbuttoncomponent).
 
-For the complete code on implementing the joystick, check out the [Joystick Example on GitHub](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart). You can also view the [JoystickComponent in action](https://examples.flame-engine.org/#/Input_Joystick) to see a live example of the joystick input function integrated into a game.
+For the complete code on implementing the joystick, check out the 
+[Joystick Example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart). 
+You can also view the [JoystickComponent in action](https://examples.flame-engine.org/#/Input_Joystick) 
+to see a live example of the joystick input function integrated into a game.
 
 For an add challenge, explore the 
-[Advanced Joystick Example on GitHub](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_advanced_example.dart). See what else the advanced features can do in the [live demo](https://examples.flame-engine.org/#/Input_Joystick%20Advanced).
+[Advanced Joystick Example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_advanced_example.dart). 
+See what else the advanced features can do in the 
+[live demo](https://examples.flame-engine.org/#/Input_Joystick%20Advanced).
 
 
 ## HudButtonComponent

From 2a1f7e2c5dcdebe1dff01ba280c102ff37eb8424 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Sun, 7 Apr 2024 15:04:41 +0530
Subject: [PATCH 07/21] chore: resolved merge conflicts

---
 doc/flame/inputs/other_inputs.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/doc/flame/inputs/other_inputs.md b/doc/flame/inputs/other_inputs.md
index 373fa35eaab..e0f28d429e4 100644
--- a/doc/flame/inputs/other_inputs.md
+++ b/doc/flame/inputs/other_inputs.md
@@ -96,10 +96,10 @@ For the complete code on implementing the joystick, check out the
 You can also view the [JoystickComponent in action](https://examples.flame-engine.org/#/Input_Joystick) 
 to see a live example of the joystick input function integrated into a game.
 
-For an add challenge, explore the 
+For an additional challenge, explore the 
 [Advanced Joystick Example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_advanced_example.dart). 
 See what else the advanced features can do in the 
-[live demo](https://examples.flame-engine.org/#/Input_Joystick%20Advanced).
+[live demo](https://examples.flame-engine.org/#/Input_Joystick_Advanced).
 
 
 ## HudButtonComponent

From 91cd27fd789c634aa9c796174bc4f3e0b2ed14c0 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 11:03:08 +0530
Subject: [PATCH 08/21] docs: improved clarity

---
 doc/flame/inputs/other_inputs.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/doc/flame/inputs/other_inputs.md b/doc/flame/inputs/other_inputs.md
index e0f28d429e4..bd96a64a9c4 100644
--- a/doc/flame/inputs/other_inputs.md
+++ b/doc/flame/inputs/other_inputs.md
@@ -74,13 +74,13 @@ class Player extends SpriteComponent with HasGameRef {
 }
 ```
 
-So in this example, we create the classes `MyGame` and `Player`. 
-`MyGame` creates a joystick which is passed to the `Player` when it is created. 
+In this example, we created the classes `MyGame` and `Player`. 
+`MyGame` creates a joystick which is passed to the `Player` when the latter is created.
 In the `Player` class we act upon the current state of the joystick.
 
 The joystick has a few fields that change depending on what state it is in.
 
-Following are the fields that should be used to know the state of the joystick:
+Following fields should be used to know the state of the joystick:
 
 - `intensity`: The percentage [0.0, 1.0] that the knob is dragged from the epicenter to the edge of
   the joystick (or `knobRadius` if that is set).

From d303f49e83736eaf63078b79955e12df87a8bb0c Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 12:33:37 +0530
Subject: [PATCH 09/21] docs: improved link text

---
 doc/flame/rendering/images.md         | 19 ++++++++-----------
 doc/flame/rendering/layers.md         | 13 ++++++-------
 doc/flame/rendering/palette.md        | 12 ++++++------
 doc/flame/rendering/particles.md      | 14 +++++++-------
 doc/flame/rendering/text_rendering.md |  2 +-
 5 files changed, 28 insertions(+), 32 deletions(-)

diff --git a/doc/flame/rendering/images.md b/doc/flame/rendering/images.md
index ed7cf5a8946..5d280ce5d9f 100644
--- a/doc/flame/rendering/images.md
+++ b/doc/flame/rendering/images.md
@@ -192,9 +192,7 @@ parameter `overridePaint` that parameter will override the current `Sprite` pain
 render call.
 
 `Sprite`s can also be used as widgets, to do so just use `SpriteWidget` class.
-
-A complete example using sprite as widgets can be found
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/sprite_widget_example.dart).
+Here is [a complete example using sprite as widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/sprite_widget_example.dart).
 
 
 ## SpriteBatch
@@ -209,8 +207,7 @@ You render it with a `Canvas` and an optional `Paint`, `BlendMode` and `CullRect
 
 A `SpriteBatchComponent` is also available for your convenience.
 
-See the examples
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/sprite_batch_example.dart).
+See how to use it in the [SpriteBatch examples](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/sprite_batch_example.dart)
 
 
 ## ImageComposition
@@ -317,15 +314,15 @@ and the former ticks the internal clock to update the frames.
 Animations are normally used inside `SpriteAnimationComponent`s, but custom components with several
 Animations can be created as well.
 
-A complete example of using animations as widgets can be found
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/sprite_animation_widget_example.dart).
+To learn more, check out the full example code of
+[using animations as widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/sprite_animation_widget_example.dart).
 
 
 ## SpriteSheet
 
 Sprite sheets are big images with several frames of the same sprite on it and is a very good way to
-organize and keep your animations stored. Flame provides a very simple utility class to deal with
-SpriteSheets, with it you can load your sprite sheet image and extract animations from it. Below is
+organize and store your animations. Flame provides a very simple utility class to deal with
+SpriteSheets, using which you can load your sprite sheet image and extract animations from it as well. Following is
 a very simple example of how to use it:
 
 ```dart
@@ -363,5 +360,5 @@ spriteSheet.getSpriteById(2); // by id
 spriteSheet.getSprite(0, 0); // row, column
 ```
 
-You can see a full example of the `SpriteSheet` class
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/sprite_sheet_example.dart).
+See a full example of the [`SpriteSheet` class](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/sprite_sheet_example.dart)
+for more details on how to work with it.
diff --git a/doc/flame/rendering/layers.md b/doc/flame/rendering/layers.md
index cd28ad42eba..4c32552c88d 100644
--- a/doc/flame/rendering/layers.md
+++ b/doc/flame/rendering/layers.md
@@ -111,7 +111,7 @@ entire layer. At the moment, out of the box, only the `ShadowProcessor` is avail
 renders a back drop shadow on your layer.
 
 To add processors to your layer, just add them to the layer `preProcessors` or `postProcessors`
-list. For example:
+list, like so:
 
 ```dart
 // Works the same for both DynamicLayer and PreRenderedLayer
@@ -130,8 +130,7 @@ class BackgroundLayer extends PreRenderedLayer {
 
 Custom processors can be created by extending the `LayerProcessor` class.
 
-You can check a working example of layers
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/layers_example.dart).
+See [a working example of layers](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/layers_example.dart).
 
 
 ## Snapshots
@@ -158,8 +157,8 @@ class MyGame extends FlameGame {
 
 Setting `renderSnapshot` to `true` (the default) on a snapshot-enabled component behaves similarly
 to a `PreRenderedLayer`. The component is rendered only once, cached in memory and then just
-replicated on the game canvas afterwards. They are useful for caching content that doesn't change
-during the game, like a background for example.
+replicated on the game canvas afterwards. This is useful for caching content that doesn't change
+during the game, like a background.
 
 ```dart
 class SnapshotComponent extends PositionComponent with Snapshot {}
@@ -243,7 +242,7 @@ class MyGame extends FlameGame {
 
 ### Snapshots that are cropped or off-center
 
-Sometimes your snapshot `Image` may appear cropped, or not in the position that is expected.
+Sometimes your snapshot `Image` may appear cropped, or not in the position you expected.
 
 This is because the contents of a `Picture` can be positioned anywhere with respect to the origin,
 but when it is converted to an `Image`, the image always starts from `0,0`. This means that
@@ -254,7 +253,7 @@ The best way to deal with this is to ensure that your `Snapshot` component is al
 contain what you expect it to.
 
 However, this is not always possible. To move (or rotate, or scale etc) the snapshot before
-converting it to an image, pass a transformation matrix to `snapshotToImage`.
+converting it to an image, pass a transformation matrix to `snapshotToImage` like so:
 
 ```dart
 // Call something like this to take an image snapshot at any time.
diff --git a/doc/flame/rendering/palette.md b/doc/flame/rendering/palette.md
index cb36144d8e3..d1e87eca028 100644
--- a/doc/flame/rendering/palette.md
+++ b/doc/flame/rendering/palette.md
@@ -40,12 +40,12 @@ You can create such an object like this:
 Paint green = Paint()..color = const Color(0xFF00FF00);
 ```
 
-To help you with this and to also keep your game's color palette consistent, Flame adds the `Palette`
-class. You can use it to easily access both `Color`s and `Paint`s where needed and also to define
-the colors your game use as constants, so you don't get those mixed up.
+To help you with this and also keep your game's color palette consistent, Flame adds the `Palette`
+class. You can use it to easily access both `Color`s and `Paint`s where needed and also define
+the colors your game use as constants, so that you don't get those mixed up.
 
 The `BasicPalette` class is an example of what a palette can look like, and adds black and white as
-colors. So to use black or white you can access those directly from the `BasicPalette`; for example,
+colors. So you can access black or white directly from the `BasicPalette`; for example,
 using `color`:
 
 ```dart
@@ -60,8 +60,8 @@ canvas.drawRect(rect, BasicPalette.black.paint);
 
 However, the idea is that you can create your own palette, following the `BasicPalette` example, and
 add the color palette/scheme of your game. Then you will be able to statically access any color in
-your components and classes. Below is an example of a `Palette` implementation, from the example
-game [BGUG](https://github.com/bluefireteam/bgug/blob/master/lib/palette.dart):
+your components and classes. Below is an example of a `Palette` implementation, from the [example
+game BGUG](https://github.com/bluefireteam/bgug/blob/master/lib/palette.dart):
 
 ```dart
 import 'dart:ui';
diff --git a/doc/flame/rendering/particles.md b/doc/flame/rendering/particles.md
index 056ccb5e048..ac67fadabd0 100644
--- a/doc/flame/rendering/particles.md
+++ b/doc/flame/rendering/particles.md
@@ -3,7 +3,7 @@
 Flame offers a basic, yet robust and extendable particle system. The core concept of this system is
 the `Particle` class, which is very similar in its behavior to the `ParticleSystemComponent`.
 
-The most basic usage of a `Particle` with `FlameGame` would look as following:
+The most basic usage of a `Particle` with `FlameGame` would look as in the following:
 
 ```dart
 import 'package:flame/components.dart';
@@ -103,8 +103,8 @@ game.add(
 );
 ```
 
-You can find more examples of how to use different built-in particles in various combinations
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/particles_example.dart).
+See more [examples of how to use different built-in particles in various combinations]
+(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/particles_example.dart).
 
 
 ## Lifecycle
@@ -160,11 +160,11 @@ Flame ships with a few built-in `Particle` behaviors:
 - The `ComponentParticle` renders Flame `Component` within a `Particle` effect
 - The `FlareParticle` renders Flare animation within a `Particle` effect
 
-More examples of how to use these behaviors together are available
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/particles_example.dart).
+See more [examples of how to use built-in Particle behaviors together]
+(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/particles_example.dart).
 All the implementations are available in the
-[particles](https://github.com/flame-engine/flame/tree/main/packages/flame/lib/src/particles) folder
-on the Flame repository.
+[particles folder on the Flame repository.]
+(https://github.com/flame-engine/flame/tree/main/packages/flame/lib/src/particles)
 
 
 ## TranslatedParticle
diff --git a/doc/flame/rendering/text_rendering.md b/doc/flame/rendering/text_rendering.md
index 24f2aa0c91a..9b9f33f17a7 100644
--- a/doc/flame/rendering/text_rendering.md
+++ b/doc/flame/rendering/text_rendering.md
@@ -364,7 +364,7 @@ list of `TextStyle` properties](https://api.flutter.dev/flutter/painting/TextSty
 - `height`: height of text line, as a multiple of font size (default `null`).
 - `color`: the color, as a `ui.Color` (default white).
 
-For more information regarding colors and how to create them, see the [Colors and the
+For more information regarding colors and how to create them, see the [Colors and
 Palette](palette.md) guide.
 
 

From 2324e4fdced0e513350180c5ee5f0e6a7903d9ce Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 14:23:24 +0530
Subject: [PATCH 10/21] docs: fixed link contrast

---
 doc/README.md                |  2 +-
 doc/_sphinx/theme/flames.css | 17 ++++++++++-------
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/doc/README.md b/doc/README.md
index 9ca29c8c20f..cae361a4ff2 100644
--- a/doc/README.md
+++ b/doc/README.md
@@ -63,7 +63,7 @@ Flame doesn't bundle any network feature, which may be needed to write online mu
 
 If you are building a multiplayer game, here are some recommendations of packages/services:
 
-- [Nakama](https://github.com/obrunsmann/flutter_nakama/): Nakama is an open-source server designed
+- [Nakama](https://github.com/obrunsmann/flutter_nakama/): An open-source server designed
  to power modern games and apps.
 - [Firebase](https://firebase.google.com/): Provides dozens of services that can be used to write
 simpler multiplayer experiences.
diff --git a/doc/_sphinx/theme/flames.css b/doc/_sphinx/theme/flames.css
index db4bd114fbd..20d15226d2b 100644
--- a/doc/_sphinx/theme/flames.css
+++ b/doc/_sphinx/theme/flames.css
@@ -21,7 +21,7 @@
 
 body {
   background-color: #484848;
-  color: #b8b8b8;
+  color: #757575;
   font-family: var(--font-sans);
   font-size: 15px;
   line-height: 1.5;
@@ -73,7 +73,7 @@ code {
 
 code.xref {
   background: none;
-  color: #f75151;
+  color: #ff9500;
   padding: 0;
 }
 
@@ -88,6 +88,7 @@ strong {
   color: white;
 }
 
+
 div.expander {
   flex: 1;
 }
@@ -144,7 +145,7 @@ div.top-bar .btn {
   background-color: transparent;
   border: none;
   border-radius: 0.25rem;
-  color: #ffd78d;
+  color: #ff9500;
   cursor: pointer;
   display: inline-flex;
   font-size: 1rem;
@@ -199,7 +200,7 @@ div.top-bar #menu-button {
 }
 
 #versions-menu > .btn > .version-id {
-  color: #ffe95c;
+  color: #ff9500;
   font-weight: bold;
   padding: 0 0 0 6px;
 }
@@ -518,7 +519,7 @@ div.warning .version {
 
 div.document {
   background-color: #282828;
-  color: #b0b0b0;
+  color: #D6D6D6;
   border-radius: 2pt;
   box-shadow: 2px 2px 3px 0 #000;
   padding: var(--document-padding);
@@ -532,7 +533,7 @@ div.document::after { /* clearfix */
 
 
 div.copyright {
-  color: #d4d4d4;
+  color: #000000;
   font-size: 12px;
   margin-top: 3px;
   opacity: 0.5;
@@ -699,7 +700,9 @@ div.highlight-text pre:before {
   content: "text";
   color: #666;
 }
-
+span.keyword {
+  color: #ffffcA;
+}
 
 /*----------------------------------------------------------------------------*
  * Search elements

From b6353deb83a88d94487f48f3d2b13cc8c57d8822 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 14:26:09 +0530
Subject: [PATCH 11/21] docs: fixed poor contrast

---
 doc/_sphinx/theme/flames.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/doc/_sphinx/theme/flames.css b/doc/_sphinx/theme/flames.css
index 20d15226d2b..9250937ccd4 100644
--- a/doc/_sphinx/theme/flames.css
+++ b/doc/_sphinx/theme/flames.css
@@ -533,7 +533,7 @@ div.document::after { /* clearfix */
 
 
 div.copyright {
-  color: #000000;
+  color: #757575;
   font-size: 12px;
   margin-top: 3px;
   opacity: 0.5;

From 7c503b2df894b387afe887485f2c73ff2ff21d03 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 15:30:39 +0530
Subject: [PATCH 12/21] docs: fixed contrast ratio for copyright text

---
 doc/_sphinx/theme/flames.css          | 8 ++++----
 doc/flame/rendering/text_rendering.md | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/doc/_sphinx/theme/flames.css b/doc/_sphinx/theme/flames.css
index 9250937ccd4..b4389523664 100644
--- a/doc/_sphinx/theme/flames.css
+++ b/doc/_sphinx/theme/flames.css
@@ -20,7 +20,7 @@
 }
 
 body {
-  background-color: #484848;
+  background-color: #383838;
   color: #757575;
   font-family: var(--font-sans);
   font-size: 15px;
@@ -533,14 +533,14 @@ div.document::after { /* clearfix */
 
 
 div.copyright {
-  color: #757575;
+  color: #ffffe8;
   font-size: 12px;
   margin-top: 3px;
   opacity: 0.5;
 }
 
 .copyright a {
-  color: #ffae00;
+  color: #ffbf00;
 }
 div.document h1 {
   border-bottom: 1px solid #555;
@@ -636,7 +636,7 @@ div.document :is(h1, h2, h3, h4) > code {
 }
 
 .prev-next-area > a > .prev-next-info > p.prev-next-subtitle {
-  color: #888;
+  color: #ffffe8;
 }
 
 .prev-next-area > a:hover > .prev-next-info > p.prev-next-title {
diff --git a/doc/flame/rendering/text_rendering.md b/doc/flame/rendering/text_rendering.md
index 9b9f33f17a7..b3d38468dc3 100644
--- a/doc/flame/rendering/text_rendering.md
+++ b/doc/flame/rendering/text_rendering.md
@@ -194,8 +194,8 @@ well):
   );
 ```
 
-For a more elaborate example of rich-text, formatted text blocks rendering, check [this
-example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/rich_text_example.dart).
+See also, [a more elaborate example of rich-text, formatted text blocks rendering]
+(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/rich_text_example.dart).
 
 For more details about the underlying mechanics of the text rendering pipeline, see "Text Elements,
 Text Nodes, and Text Styles" below.
@@ -442,8 +442,8 @@ However, the other types of Text Elements, Text Nodes, and Text Styles must be u
 to create an entire document (multiple blocks or paragraphs), enriched with formatted text. In order
 to render an arbitrary TextElement, you can alternatively use the `TextElementComponent` (see above).
 
-An example of such usages can be seen in [this
-example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/rich_text_example.dart).
+See [examples of such usage]
+(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/rich_text_example.dart).
 
 
 ### Text Nodes and the Document Root

From 3fce1688ee234435149cd6466b07f6fd81b0c172 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 15:42:59 +0530
Subject: [PATCH 13/21] docs: accessibility contrast ratio fix

---
 doc/_sphinx/theme/flames.css | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/doc/_sphinx/theme/flames.css b/doc/_sphinx/theme/flames.css
index b4389523664..715bc9f69e4 100644
--- a/doc/_sphinx/theme/flames.css
+++ b/doc/_sphinx/theme/flames.css
@@ -21,7 +21,7 @@
 
 body {
   background-color: #383838;
-  color: #757575;
+  color: #cccccc;
   font-family: var(--font-sans);
   font-size: 15px;
   line-height: 1.5;
@@ -533,14 +533,14 @@ div.document::after { /* clearfix */
 
 
 div.copyright {
-  color: #ffffe8;
+  color: #cccccc;
   font-size: 12px;
   margin-top: 3px;
   opacity: 0.5;
 }
 
 .copyright a {
-  color: #ffbf00;
+  color: #ff9500;
 }
 div.document h1 {
   border-bottom: 1px solid #555;

From 351d261ec1218e3c8c11918b398e3537dc94d82f Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 15:53:06 +0530
Subject: [PATCH 14/21] docs: fixed copyright link accessibility

---
 doc/_sphinx/theme/flames.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/doc/_sphinx/theme/flames.css b/doc/_sphinx/theme/flames.css
index 715bc9f69e4..9e225bece3c 100644
--- a/doc/_sphinx/theme/flames.css
+++ b/doc/_sphinx/theme/flames.css
@@ -541,6 +541,7 @@ div.copyright {
 
 .copyright a {
   color: #ff9500;
+  text-decoration: underline;
 }
 div.document h1 {
   border-bottom: 1px solid #555;

From 6b61feffe3908fe2ecb5f80ffea97a2c08015385 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 16:13:57 +0530
Subject: [PATCH 15/21] docs: fixed spacing issues

---
 doc/_sphinx/theme/flames.css | 2 +-
 doc/flame/overlays.md        | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/doc/_sphinx/theme/flames.css b/doc/_sphinx/theme/flames.css
index 9e225bece3c..b82c1b89654 100644
--- a/doc/_sphinx/theme/flames.css
+++ b/doc/_sphinx/theme/flames.css
@@ -425,7 +425,7 @@ div.nav-right > #toc-local {
   flex-direction: column;
   margin: 0 0 0 6px;
   max-width: var(--right-menu-width);
-  padding: 0 0 0 10px;
+  padding: 0 0 0 1rem;
 }
 
 div.nav-right > #toc-local > div.header {
diff --git a/doc/flame/overlays.md b/doc/flame/overlays.md
index 897a9ff98eb..50b096007c0 100644
--- a/doc/flame/overlays.md
+++ b/doc/flame/overlays.md
@@ -42,5 +42,5 @@ Widget build(BuildContext context) {
 The order of rendering for an overlay is determined by the order of the keys in the
 `overlayBuilderMap`.
 
-An example of this feature can be found
-[here](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/system/overlays_example.dart).
+See an [example of the Overlays feature]
+(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/system/overlays_example.dart).

From ed5a2466e3cf2a89652961d2b36118a86b77ac75 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 17:08:09 +0530
Subject: [PATCH 16/21] docs: improved text accessibility

---
 doc/flame/other/debug.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/doc/flame/other/debug.md b/doc/flame/other/debug.md
index f75607fa3a3..3c41fb21598 100644
--- a/doc/flame/other/debug.md
+++ b/doc/flame/other/debug.md
@@ -9,8 +9,8 @@ When `debugMode` is enabled, each `PositionComponent` will be rendered with thei
 have their positions written on the screen. This way, you can visually verify the components
 boundaries and positions.
 
-To see a working example of the debugging features of the `FlameGame`, check this
-[example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/components/debug_example.dart).
+Check out this [working example of the debugging features of the `FlameGame`],[example]
+(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/components/debug_example.dart).
 
 
 ## FPS

From fc73ef9dc24f5ef4bb7d3157456bea10fa4fdcf2 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 17:20:54 +0530
Subject: [PATCH 17/21] docs: fix trailing spaces

---
 doc/flame/inputs/other_inputs.md | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/doc/flame/inputs/other_inputs.md b/doc/flame/inputs/other_inputs.md
index bd96a64a9c4..e7b979c5520 100644
--- a/doc/flame/inputs/other_inputs.md
+++ b/doc/flame/inputs/other_inputs.md
@@ -74,7 +74,7 @@ class Player extends SpriteComponent with HasGameRef {
 }
 ```
 
-In this example, we created the classes `MyGame` and `Player`. 
+In this example, we created the classes `MyGame` and `Player`.
 `MyGame` creates a joystick which is passed to the `Player` when the latter is created.
 In the `Player` class we act upon the current state of the joystick.
 
@@ -91,12 +91,13 @@ Following fields should be used to know the state of the joystick:
 If you want to create buttons to go with your joystick, check out
 [`HudButtonComponent`](#hudbuttoncomponent).
 
-For the complete code on implementing the joystick, check out the 
-[Joystick Example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart). 
-You can also view the [JoystickComponent in action](https://examples.flame-engine.org/#/Input_Joystick) 
+For the complete code on implementing the joystick, check out the [Joystick Example]
+(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart).
+You can also view the [JoystickComponent in action]
+(https://examples.flame-engine.org/#/Input_Joystick) 
 to see a live example of the joystick input function integrated into a game.
 
-For an additional challenge, explore the 
+For an additional challenge, explore the
 [Advanced Joystick Example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_advanced_example.dart). 
 See what else the advanced features can do in the 
 [live demo](https://examples.flame-engine.org/#/Input_Joystick_Advanced).
@@ -137,8 +138,8 @@ else which isn't a pure sprite.
 
 ## Gamepad
 
-Flame has a dedicated plugin to support external game controllers (gamepads). Find more information in the 
-[Gamepads repository](https://github.com/flame-engine/gamepad).
+Flame has a dedicated plugin to support external game controllers (gamepads). 
+Find more information in the [Gamepads repository](https://github.com/flame-engine/gamepad).
 
 
 ## AdvancedButtonComponent

From 3b957a3148980b3d1988da56acb75c885cfa415a Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 17:31:38 +0530
Subject: [PATCH 18/21] docs: fixed bare URLs

---
 doc/flame/inputs/other_inputs.md      |  8 ++++----
 doc/flame/other/debug.md              |  5 +++--
 doc/flame/overlays.md                 |  5 +++--
 doc/flame/rendering/images.md         | 16 +++++++++++-----
 doc/flame/rendering/particles.md      |  8 +++++---
 doc/flame/rendering/text_rendering.md | 15 +++++++++------
 6 files changed, 35 insertions(+), 22 deletions(-)

diff --git a/doc/flame/inputs/other_inputs.md b/doc/flame/inputs/other_inputs.md
index e7b979c5520..41728d1ab3c 100644
--- a/doc/flame/inputs/other_inputs.md
+++ b/doc/flame/inputs/other_inputs.md
@@ -91,10 +91,10 @@ Following fields should be used to know the state of the joystick:
 If you want to create buttons to go with your joystick, check out
 [`HudButtonComponent`](#hudbuttoncomponent).
 
-For the complete code on implementing the joystick, check out the [Joystick Example]
-(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart).
-You can also view the [JoystickComponent in action]
-(https://examples.flame-engine.org/#/Input_Joystick) 
+For the complete code on implementing the joystick, check out the
+[Joystick Examp
+le](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart).
+You can also view the [JoystickComponent in action](https://examples.flame-engine.org/#/Input_Joystick) 
 to see a live example of the joystick input function integrated into a game.
 
 For an additional challenge, explore the
diff --git a/doc/flame/other/debug.md b/doc/flame/other/debug.md
index f29151957ee..f1ebd2b5669 100644
--- a/doc/flame/other/debug.md
+++ b/doc/flame/other/debug.md
@@ -9,8 +9,9 @@ When `debugMode` is enabled, each `PositionComponent` will be rendered with thei
 have their positions written on the screen. This way, you can visually verify the components
 boundaries and positions.
 
-Check out this [working example of the debugging features of the `FlameGame`],[example]
-(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/components/debug_example.dart).
+Check out this [working example of the debugging features of
+the `FlameGame`](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/components/
+debug_example.dart).
 
 
 ## Devtools extension
diff --git a/doc/flame/overlays.md b/doc/flame/overlays.md
index 50b096007c0..ff514830140 100644
--- a/doc/flame/overlays.md
+++ b/doc/flame/overlays.md
@@ -42,5 +42,6 @@ Widget build(BuildContext context) {
 The order of rendering for an overlay is determined by the order of the keys in the
 `overlayBuilderMap`.
 
-See an [example of the Overlays feature]
-(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/system/overlays_example.dart).
+See an [example of the Overlays 
+feature](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/system/
+overlays_example.dart).
diff --git a/doc/flame/rendering/images.md b/doc/flame/rendering/images.md
index 5d280ce5d9f..8007396b4dc 100644
--- a/doc/flame/rendering/images.md
+++ b/doc/flame/rendering/images.md
@@ -192,7 +192,9 @@ parameter `overridePaint` that parameter will override the current `Sprite` pain
 render call.
 
 `Sprite`s can also be used as widgets, to do so just use `SpriteWidget` class.
-Here is [a complete example using sprite as widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/sprite_widget_example.dart).
+Here is [a complete example using sprite as 
+widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/
+sprite_widget_example.dart).
 
 
 ## SpriteBatch
@@ -207,7 +209,9 @@ You render it with a `Canvas` and an optional `Paint`, `BlendMode` and `CullRect
 
 A `SpriteBatchComponent` is also available for your convenience.
 
-See how to use it in the [SpriteBatch examples](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/sprite_batch_example.dart)
+See how to use it in the [SpriteBatch 
+examples](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/
+sprite_batch_example.dart)
 
 
 ## ImageComposition
@@ -314,8 +318,9 @@ and the former ticks the internal clock to update the frames.
 Animations are normally used inside `SpriteAnimationComponent`s, but custom components with several
 Animations can be created as well.
 
-To learn more, check out the full example code of
-[using animations as widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/sprite_animation_widget_example.dart).
+To learn more, check out the full example code of [using animations as 
+widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/
+sprite_animation_widget_example.dart).
 
 
 ## SpriteSheet
@@ -360,5 +365,6 @@ spriteSheet.getSpriteById(2); // by id
 spriteSheet.getSprite(0, 0); // row, column
 ```
 
-See a full example of the [`SpriteSheet` class](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/sprite_sheet_example.dart)
+See a full example of the [`SpriteSheet` class](https://github.com/flame-engine/flame/blob/main/
+examples/lib/stories/sprites/sprite_sheet_example.dart)
 for more details on how to work with it.
diff --git a/doc/flame/rendering/particles.md b/doc/flame/rendering/particles.md
index ac67fadabd0..700b706dad3 100644
--- a/doc/flame/rendering/particles.md
+++ b/doc/flame/rendering/particles.md
@@ -103,8 +103,9 @@ game.add(
 );
 ```
 
-See more [examples of how to use different built-in particles in various combinations]
-(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/particles_example.dart).
+See more [examples of how to use different built-in particles in various
+combinations](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/
+particles_example.dart).
 
 
 ## Lifecycle
@@ -161,7 +162,8 @@ Flame ships with a few built-in `Particle` behaviors:
 - The `FlareParticle` renders Flare animation within a `Particle` effect
 
 See more [examples of how to use built-in Particle behaviors together]
-(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/particles_example.dart).
+(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/
+particles_example.dart).
 All the implementations are available in the
 [particles folder on the Flame repository.]
 (https://github.com/flame-engine/flame/tree/main/packages/flame/lib/src/particles)
diff --git a/doc/flame/rendering/text_rendering.md b/doc/flame/rendering/text_rendering.md
index 56c296964cd..b1226075143 100644
--- a/doc/flame/rendering/text_rendering.md
+++ b/doc/flame/rendering/text_rendering.md
@@ -16,8 +16,9 @@ typing effect. You can use the `newLineNotifier` to be notified when a new line
 scrolling capability when the text exceeds the boundaries of the enclosing box.
 
 
-All components are showcased in
-[this example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/text_example.dart).
+All components are showcased in [this
+example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/
+text_example.dart).
 
 
 ### TextComponent
@@ -193,8 +194,9 @@ well):
   );
 ```
 
-See also, [a more elaborate example of rich-text, formatted text blocks rendering]
-(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/rich_text_example.dart).
+See also, [a more elaborate example of rich-text, formatted text blocks
+rendering](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/
+rich_text_example.dart).
 
 For more details about the underlying mechanics of the text rendering pipeline, see "Text Elements,
 Text Nodes, and Text Styles" below.
@@ -441,8 +443,9 @@ However, the other types of Text Elements, Text Nodes, and Text Styles must be u
 to create an entire document (multiple blocks or paragraphs), enriched with formatted text. In order
 to render an arbitrary TextElement, you can alternatively use the `TextElementComponent` (see above).
 
-See [examples of such usage]
-(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/rich_text_example.dart).
+See [examples of such
+usage](https://github.com/flame-engine/flame/blob/main/examples/
+lib/stories/rendering/rich_text_example.dart).
 
 
 ### Text Nodes and the Document Root

From 5c70ef49f2ba3dab54f0d3dbb38ffbc02006e53d Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 17:45:44 +0530
Subject: [PATCH 19/21] docs: fix URLs

---
 doc/flame/inputs/other_inputs.md      | 10 +++++-----
 doc/flame/other/debug.md              |  4 +---
 doc/flame/overlays.md                 |  4 +---
 doc/flame/rendering/images.md         | 18 +++++++-----------
 doc/flame/rendering/text_rendering.md |  4 +---
 5 files changed, 15 insertions(+), 25 deletions(-)

diff --git a/doc/flame/inputs/other_inputs.md b/doc/flame/inputs/other_inputs.md
index 41728d1ab3c..28eb33dce31 100644
--- a/doc/flame/inputs/other_inputs.md
+++ b/doc/flame/inputs/other_inputs.md
@@ -92,14 +92,14 @@ If you want to create buttons to go with your joystick, check out
 [`HudButtonComponent`](#hudbuttoncomponent).
 
 For the complete code on implementing the joystick, check out the
-[Joystick Examp
-le](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart).
-You can also view the [JoystickComponent in action](https://examples.flame-engine.org/#/Input_Joystick) 
+[Joystick Example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_example.dart).
+You can also view the
+[JoystickComponent in action](https://examples.flame-engine.org/#/Input_Joystick)
 to see a live example of the joystick input function integrated into a game.
 
 For an additional challenge, explore the
-[Advanced Joystick Example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_advanced_example.dart). 
-See what else the advanced features can do in the 
+[Advanced Joystick Example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/input/joystick_advanced_example.dart).
+See what else the advanced features can do in the
 [live demo](https://examples.flame-engine.org/#/Input_Joystick_Advanced).
 
 
diff --git a/doc/flame/other/debug.md b/doc/flame/other/debug.md
index f1ebd2b5669..fd7abbea1f5 100644
--- a/doc/flame/other/debug.md
+++ b/doc/flame/other/debug.md
@@ -9,9 +9,7 @@ When `debugMode` is enabled, each `PositionComponent` will be rendered with thei
 have their positions written on the screen. This way, you can visually verify the components
 boundaries and positions.
 
-Check out this [working example of the debugging features of
-the `FlameGame`](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/components/
-debug_example.dart).
+Check out this [working example of the debugging features of the `FlameGame`](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/components/debug_example.dart).
 
 
 ## Devtools extension
diff --git a/doc/flame/overlays.md b/doc/flame/overlays.md
index ff514830140..7a96d4f29a6 100644
--- a/doc/flame/overlays.md
+++ b/doc/flame/overlays.md
@@ -42,6 +42,4 @@ Widget build(BuildContext context) {
 The order of rendering for an overlay is determined by the order of the keys in the
 `overlayBuilderMap`.
 
-See an [example of the Overlays 
-feature](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/system/
-overlays_example.dart).
+See an [example of the Overlays feature](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/system/overlays_example.dart).
diff --git a/doc/flame/rendering/images.md b/doc/flame/rendering/images.md
index 8007396b4dc..1803aa735a1 100644
--- a/doc/flame/rendering/images.md
+++ b/doc/flame/rendering/images.md
@@ -192,9 +192,8 @@ parameter `overridePaint` that parameter will override the current `Sprite` pain
 render call.
 
 `Sprite`s can also be used as widgets, to do so just use `SpriteWidget` class.
-Here is [a complete example using sprite as 
-widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/
-sprite_widget_example.dart).
+Here is a complete
+[example using sprite as widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/sprite_widget_example.dart).
 
 
 ## SpriteBatch
@@ -209,9 +208,8 @@ You render it with a `Canvas` and an optional `Paint`, `BlendMode` and `CullRect
 
 A `SpriteBatchComponent` is also available for your convenience.
 
-See how to use it in the [SpriteBatch 
-examples](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/
-sprite_batch_example.dart)
+See how to use it in the 
+[SpriteBatch examples](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/sprite_batch_example.dart)
 
 
 ## ImageComposition
@@ -318,9 +316,8 @@ and the former ticks the internal clock to update the frames.
 Animations are normally used inside `SpriteAnimationComponent`s, but custom components with several
 Animations can be created as well.
 
-To learn more, check out the full example code of [using animations as 
-widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/
-sprite_animation_widget_example.dart).
+To learn more, check out the full example code of
+[using animations as widgets](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/widgets/sprite_animation_widget_example.dart).
 
 
 ## SpriteSheet
@@ -365,6 +362,5 @@ spriteSheet.getSpriteById(2); // by id
 spriteSheet.getSprite(0, 0); // row, column
 ```
 
-See a full example of the [`SpriteSheet` class](https://github.com/flame-engine/flame/blob/main/
-examples/lib/stories/sprites/sprite_sheet_example.dart)
+See a full example of the [`SpriteSheet` class](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/sprite_sheet_example.dart)
 for more details on how to work with it.
diff --git a/doc/flame/rendering/text_rendering.md b/doc/flame/rendering/text_rendering.md
index b1226075143..1653071b6b0 100644
--- a/doc/flame/rendering/text_rendering.md
+++ b/doc/flame/rendering/text_rendering.md
@@ -16,9 +16,7 @@ typing effect. You can use the `newLineNotifier` to be notified when a new line
 scrolling capability when the text exceeds the boundaries of the enclosing box.
 
 
-All components are showcased in [this
-example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/
-text_example.dart).
+All components are showcased in [this example](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/text_example.dart).
 
 
 ### TextComponent

From 18ccfa85daf9b6b59f3b42a7a0200e03e9288453 Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 17:52:39 +0530
Subject: [PATCH 20/21] docs: fix URLs

---
 doc/flame/rendering/particles.md      | 15 ++++++---------
 doc/flame/rendering/text_rendering.md |  5 ++---
 2 files changed, 8 insertions(+), 12 deletions(-)

diff --git a/doc/flame/rendering/particles.md b/doc/flame/rendering/particles.md
index 700b706dad3..d98ad1484ff 100644
--- a/doc/flame/rendering/particles.md
+++ b/doc/flame/rendering/particles.md
@@ -103,9 +103,8 @@ game.add(
 );
 ```
 
-See more [examples of how to use different built-in particles in various
-combinations](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/
-particles_example.dart).
+See more [examples of how to use built-in particles in various
+combinations](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/particles_example.dart).
 
 
 ## Lifecycle
@@ -161,12 +160,10 @@ Flame ships with a few built-in `Particle` behaviors:
 - The `ComponentParticle` renders Flame `Component` within a `Particle` effect
 - The `FlareParticle` renders Flare animation within a `Particle` effect
 
-See more [examples of how to use built-in Particle behaviors together]
-(https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/
-particles_example.dart).
-All the implementations are available in the
-[particles folder on the Flame repository.]
-(https://github.com/flame-engine/flame/tree/main/packages/flame/lib/src/particles)
+See more [examples of how to use built-in Particle behaviors
+together](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/particles_example.dart).
+All the implementations are available in the [particles folder on the 
+Flame repository.](https://github.com/flame-engine/flame/tree/main/packages/flame/lib/src/particles)
 
 
 ## TranslatedParticle
diff --git a/doc/flame/rendering/text_rendering.md b/doc/flame/rendering/text_rendering.md
index 1653071b6b0..46e6b69057d 100644
--- a/doc/flame/rendering/text_rendering.md
+++ b/doc/flame/rendering/text_rendering.md
@@ -192,9 +192,8 @@ well):
   );
 ```
 
-See also, [a more elaborate example of rich-text, formatted text blocks
-rendering](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/
-rich_text_example.dart).
+See a more elaborate [example of rich-text, formatted
+text blocks rendering](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/rich_text_example.dart).
 
 For more details about the underlying mechanics of the text rendering pipeline, see "Text Elements,
 Text Nodes, and Text Styles" below.

From dc38633cbd5fb070cf2f6c13b13609c1e5e1853d Mon Sep 17 00:00:00 2001
From: alt-shreya <shreyakumar31@gmail.com>
Date: Tue, 9 Apr 2024 17:59:18 +0530
Subject: [PATCH 21/21] docs: fix lint errors

---
 doc/flame/inputs/other_inputs.md      | 2 +-
 doc/flame/rendering/images.md         | 6 +++---
 doc/flame/rendering/particles.md      | 2 +-
 doc/flame/rendering/text_rendering.md | 4 +---
 4 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/doc/flame/inputs/other_inputs.md b/doc/flame/inputs/other_inputs.md
index 28eb33dce31..5e86acf1ea7 100644
--- a/doc/flame/inputs/other_inputs.md
+++ b/doc/flame/inputs/other_inputs.md
@@ -138,7 +138,7 @@ else which isn't a pure sprite.
 
 ## Gamepad
 
-Flame has a dedicated plugin to support external game controllers (gamepads). 
+Flame has a dedicated plugin to support external game controllers (gamepads).
 Find more information in the [Gamepads repository](https://github.com/flame-engine/gamepad).
 
 
diff --git a/doc/flame/rendering/images.md b/doc/flame/rendering/images.md
index 1803aa735a1..3a4c3e8db60 100644
--- a/doc/flame/rendering/images.md
+++ b/doc/flame/rendering/images.md
@@ -208,7 +208,7 @@ You render it with a `Canvas` and an optional `Paint`, `BlendMode` and `CullRect
 
 A `SpriteBatchComponent` is also available for your convenience.
 
-See how to use it in the 
+See how to use it in the
 [SpriteBatch examples](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/sprites/sprite_batch_example.dart)
 
 
@@ -324,8 +324,8 @@ To learn more, check out the full example code of
 
 Sprite sheets are big images with several frames of the same sprite on it and is a very good way to
 organize and store your animations. Flame provides a very simple utility class to deal with
-SpriteSheets, using which you can load your sprite sheet image and extract animations from it as well. Following is
-a very simple example of how to use it:
+SpriteSheets, using which you can load your sprite sheet image and extract animations from it as
+well. Following is a simple example of how to use it:
 
 ```dart
 import 'package:flame/sprite.dart';
diff --git a/doc/flame/rendering/particles.md b/doc/flame/rendering/particles.md
index d98ad1484ff..448d66c5fdf 100644
--- a/doc/flame/rendering/particles.md
+++ b/doc/flame/rendering/particles.md
@@ -162,7 +162,7 @@ Flame ships with a few built-in `Particle` behaviors:
 
 See more [examples of how to use built-in Particle behaviors
 together](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/particles_example.dart).
-All the implementations are available in the [particles folder on the 
+All the implementations are available in the [particles folder on the
 Flame repository.](https://github.com/flame-engine/flame/tree/main/packages/flame/lib/src/particles)
 
 
diff --git a/doc/flame/rendering/text_rendering.md b/doc/flame/rendering/text_rendering.md
index 46e6b69057d..2dd4d0eb117 100644
--- a/doc/flame/rendering/text_rendering.md
+++ b/doc/flame/rendering/text_rendering.md
@@ -440,9 +440,7 @@ However, the other types of Text Elements, Text Nodes, and Text Styles must be u
 to create an entire document (multiple blocks or paragraphs), enriched with formatted text. In order
 to render an arbitrary TextElement, you can alternatively use the `TextElementComponent` (see above).
 
-See [examples of such
-usage](https://github.com/flame-engine/flame/blob/main/examples/
-lib/stories/rendering/rich_text_example.dart).
+See [examples of such usage](https://github.com/flame-engine/flame/blob/main/examples/lib/stories/rendering/rich_text_example.dart).
 
 
 ### Text Nodes and the Document Root