Fix post_processing example on webgl2 (#9361)

# Objective

The `post_processing` example is currently broken when run with webgl2.

```
cargo run --example post_processing --target=wasm32-unknown-unknown
```

```
wasm.js:387 panicked at 'wgpu error: Validation Error

Caused by:
    In Device::create_render_pipeline
      note: label = `post_process_pipeline`
    In the provided shader, the type given for group 0 binding 2 has a size of 4. As the device does not support `DownlevelFlags::BUFFER_BINDINGS_NOT_16_BYTE_ALIGNED`, the type must have a size that is a multiple of 16 bytes.
```

I bisected the breakage to c7eaedd.

## Solution

Add padding when using webgl2

assets/shaders/post_processing.wgsl

@@ -28,6 +28,10 @@ var screen_texture: texture_2d<f32>;
 var texture_sampler: sampler;
 struct PostProcessSettings {
  intensity: f32,
+#ifdef SIXTEEN_BYTE_ALIGNMENT
+ // WebGL2 structs must be 16 byte aligned.
+ _webgl2_padding: vec3<f32>
+#endif
 }
 @group(0) @binding(2)
 var<uniform> settings: PostProcessSettings;

examples/shader/post_processing.rs

@@ -283,7 +283,7 @@ impl FromWorld for PostProcessPipeline {
  ty: BindingType::Buffer {
  ty: bevy::render::render_resource::BufferBindingType::Uniform,
  has_dynamic_offset: false,
- min_binding_size: None,
+ min_binding_size: Some(PostProcessSettings::min_size()),
  },
  count: None,
  },
@@ -338,6 +338,9 @@ impl FromWorld for PostProcessPipeline {
 #[derive(Component, Default, Clone, Copy, ExtractComponent, ShaderType)]
 struct PostProcessSettings {
  intensity: f32,
+ // WebGL2 structs must be 16 byte aligned.
+ #[cfg(feature = "webgl2")]
+ _webgl2_padding: Vec3,
 }
 
 /// Set up a simple 3D scene
@@ -359,7 +362,10 @@ fn setup(
  },
  // Add the setting to the camera.
  // This component is also used to determine on which camera to run the post processing effect.
- PostProcessSettings { intensity: 0.02 },
+ PostProcessSettings {
+ intensity: 0.02,
+ ..default()
+ },
  ));
 
  // cube