[Bleed] Fix examples (#7747)

![image](https://user-images.githubusercontent.com/6844391/202480607-e975e23c-e2bc-4b04-bacf-1fb103083c61.png)

Fixes #7736

Author: kyledurand

.changeset/lucky-pianos-search.md

@@ -0,0 +1,5 @@
+---
+'polaris.shopify.com': patch
+---
+
+Fixed bleed examples

polaris.shopify.com/pages/examples/bleed-all-directions.tsx

@@ -5,8 +5,8 @@ import {withPolarisExample} from '../../src/components/PolarisExampleWrapper';
 
 function BleedAllDirectionsExample() {
   return (
-    <Box background="surface" border="base" padding="4">
-      <Bleed vertical="4" horizontal="4">
+    <Box background="surface" border="base" padding="5">
+      <Bleed vertical="5">
         <Placeholder label="All directions" />
       </Bleed>
     </Box>

polaris.shopify.com/pages/examples/bleed-specific-direction.tsx

@@ -6,23 +6,23 @@ import {withPolarisExample} from '../../src/components/PolarisExampleWrapper';
 function BleedSpecificDirectionExample() {
   return (
     <AlphaStack spacing="6" fullWidth>
-      <Box background="surface" border="base" padding="4">
-        <Bleed top="4">
+      <Box background="surface" border="base" padding="5">
+        <Bleed top="5">
           <Placeholder label="Top" />
         </Bleed>
       </Box>
-      <Box background="surface" border="base" padding="4">
-        <Bleed bottom="4">
+      <Box background="surface" border="base" padding="5">
+        <Bleed bottom="5">
           <Placeholder label="Bottom" />
         </Bleed>
       </Box>
-      <Box background="surface" border="base" padding="4">
-        <Bleed left="4">
+      <Box background="surface" border="base" padding="5">
+        <Bleed left="5" right="0">
           <Placeholder label="Left" />
         </Bleed>
       </Box>
-      <Box background="surface" border="base" padding="4">
-        <Bleed right="4">
+      <Box background="surface" border="base" padding="5">
+        <Bleed right="5" left="0">
           <Placeholder label="Right" />
         </Bleed>
       </Box>

polaris.shopify.com/pages/examples/bleed-vertical.tsx

@@ -6,7 +6,7 @@ import {withPolarisExample} from '../../src/components/PolarisExampleWrapper';
 function BleedVerticalExample() {
   return (
     <Box background="surface" border="base" padding="4">
-      <Bleed vertical="4">
+      <Bleed horizontal="0" vertical="4">
         <Placeholder label="Vertical" />
       </Bleed>
     </Box>