UI - keep color as 4 f32 (bevyengine#4494)

# Objective

- Fixes inaccurate UI colors similar to this [Sprite color fix](bevyengine#4361).

## Solution

- Do not reduce the color of UI quads to 4 u8.

 Left is the displayed color. Right is the input color(#202225).
| Before Fix | After Fix |
|--------|--------|
|![before](https://user-images.githubusercontent.com/2303421/163661335-7f970a43-1f8b-45af-ae0a-cd74424aa9fb.png)|![after](https://user-images.githubusercontent.com/2303421/163661342-d8d56c08-924b-4bce-8bc8-a8de85aadc97.png)|

crates/bevy_ui/src/render/mod.rs

@@ -228,7 +228,7 @@ pub fn extract_text_uinodes(
 struct UiVertex {
     pub position: [f32; 3],
     pub uv: [f32; 2],
-    pub color: u32,
+    pub color: [f32; 4],
 }
 
 pub struct UiMeta {
@@ -360,14 +360,11 @@ pub fn prepare_uinodes(
         ]
         .map(|pos| pos / atlas_extent);
 
-        // encode color as a single u32 to save space
-        let color = extracted_uinode.color.as_linear_rgba_u32();
-
         for i in QUAD_INDICES {
             ui_meta.vertices.push(UiVertex {
                 position: positions_clipped[i].into(),
                 uv: uvs[i].into(),
-                color,
+                color: extracted_uinode.color.as_linear_rgba_f32(),
             });
         }
 

crates/bevy_ui/src/render/pipeline.rs

@@ -74,7 +74,7 @@ impl SpecializedRenderPipeline for UiPipeline {
                 // uv
                 VertexFormat::Float32x2,
                 // color
-                VertexFormat::Uint32,
+                VertexFormat::Float32x4,
             ],
         );
         let shader_defs = Vec::new();

crates/bevy_ui/src/render/ui.wgsl

@@ -15,12 +15,12 @@ struct VertexOutput {
 fn vertex(
     [[location(0)]] vertex_position: vec3<f32>,
     [[location(1)]] vertex_uv: vec2<f32>,
-    [[location(2)]] vertex_color: u32,
+    [[location(2)]] vertex_color: vec4<f32>,
 ) -> VertexOutput {
     var out: VertexOutput;
     out.uv = vertex_uv;
     out.position = view.view_proj * vec4<f32>(vertex_position, 1.0);
-    out.color = vec4<f32>((vec4<u32>(vertex_color) >> vec4<u32>(0u, 8u, 16u, 24u)) & vec4<u32>(255u)) / 255.0;
+    out.color = vertex_color;
     return out;
 }