Make the default background color of NodeBundle transparent (bevyen…

…gine#6211)

# Objective

Closes bevyengine#6202.

The default background color for `NodeBundle` is currently white.
However, it's very rare that you actually want a white background color.
Instead, you often want a background color specific to the style of your game or a transparent background (e.g. for UI layout nodes).

## Solution

`Default` is not derived for `NodeBundle` anymore, but explicitly specified.
The default background color is now transparent (`Color::NONE.into()`) as this is the most common use-case, is familiar from the web and makes specifying a layout for your UI less tedious.

---

## Changelog

- Changed the default `NodeBundle.background_color` to be transparent (`Color::NONE.into()`).

## Migration Guide

If you want a `NodeBundle` with a white background color, you must explicitly specify it:

Before:

```rust
let node = NodeBundle {
    ..default()
}
```

After:

```rust
let node = NodeBundle {
    background_color: Color::WHITE.into(),
    ..default()
}
```

crates/bevy_ui/src/entity.rs

@@ -10,14 +10,16 @@ use bevy_ecs::{
     query::QueryItem,
 };
 use bevy_render::{
-    camera::Camera, extract_component::ExtractComponent, prelude::ComputedVisibility,
+    camera::Camera,
+    extract_component::ExtractComponent,
+    prelude::{Color, ComputedVisibility},
     view::Visibility,
 };
 use bevy_text::{Text, TextAlignment, TextSection, TextStyle};
 use bevy_transform::prelude::{GlobalTransform, Transform};
 
 /// The basic UI node
-#[derive(Bundle, Clone, Debug, Default)]
+#[derive(Bundle, Clone, Debug)]
 pub struct NodeBundle {
     /// Describes the size of the node
     pub node: Node,
@@ -45,6 +47,23 @@ pub struct NodeBundle {
     pub computed_visibility: ComputedVisibility,
 }
 
+impl Default for NodeBundle {
+    fn default() -> Self {
+        NodeBundle {
+            // Transparent background
+            background_color: Color::NONE.into(),
+            node: Default::default(),
+            style: Default::default(),
+            image: Default::default(),
+            focus_policy: Default::default(),
+            transform: Default::default(),
+            global_transform: Default::default(),
+            visibility: Default::default(),
+            computed_visibility: Default::default(),
+        }
+    }
+}
+
 /// A UI node that is an image
 #[derive(Bundle, Clone, Debug, Default)]
 pub struct ImageBundle {

examples/games/alien_cake_addict.rs

@@ -383,7 +383,6 @@ fn display_score(mut commands: Commands, asset_server: Res<AssetServer>, game: R
                 align_items: AlignItems::Center,
                 ..default()
             },
-            background_color: Color::NONE.into(),
             ..default()
         })
         .with_children(|parent| {

examples/ui/ui.rs

@@ -28,7 +28,6 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
                 justify_content: JustifyContent::SpaceBetween,
                 ..default()
             },
-            background_color: Color::NONE.into(),
             ..default()
         })
         .with_children(|parent| {
@@ -130,7 +129,6 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
                                             max_size: Size::UNDEFINED,
                                             ..default()
                                         },
-                                        background_color: Color::NONE.into(),
                                         ..default()
                                     },
                                     ScrollingList::default(),
@@ -200,7 +198,6 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
                         justify_content: JustifyContent::Center,
                         ..default()
                     },
-                    background_color: Color::NONE.into(),
                     ..default()
                 })
                 .with_children(|parent| {
@@ -283,7 +280,6 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
                         align_items: AlignItems::FlexEnd,
                         ..default()
                     },
-                    background_color: Color::NONE.into(),
                     ..default()
                 })
                 .with_children(|parent| {

examples/window/scale_factor_override.rs

@@ -28,7 +28,6 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
                 justify_content: JustifyContent::SpaceBetween,
                 ..default()
             },
-            background_color: Color::NONE.into(),
             ..default()
         })
         .with_children(|parent| {