Consistent margin-y for Embeddable components

Author: ryuheechul

src/components/glue/EmbeddableCIDR.svelte

@@ -7,7 +7,7 @@ Wrap CIDR to work better with astro mdx files
   import OpacitySkeleton from '../parts/OpacitySkeleton.svelte';
 </script>
 
-<div class="not-prose">
+<div class="not-prose my-7">
   <OpacitySkeleton>
     <CIDR />
   </OpacitySkeleton>

src/components/glue/EmbeddableColor.svelte

@@ -7,7 +7,7 @@ Wrap Color to work better with astro mdx files
   import OpacitySkeleton from '../parts/OpacitySkeleton.svelte';
 </script>
 
-<div class="not-prose">
+<div class="not-prose my-7">
   <OpacitySkeleton>
     <Color />
   </OpacitySkeleton>

src/components/glue/EmbeddableNumber.svelte

@@ -7,7 +7,7 @@ Wrap Number to work better with astro mdx files
   import OpacitySkeleton from '../parts/OpacitySkeleton.svelte';
 </script>
 
-<div class="not-prose">
+<div class="not-prose my-7">
   <OpacitySkeleton>
     <Number />
   </OpacitySkeleton>

src/pages/index.mdx

@@ -9,20 +9,14 @@ import CIDR from '../components/glue/EmbeddableCIDR.svelte';
 
 This is [Bit Visualizer](./toys/bit-visualizer)
 
-<div class="mt-7">
-  <Number client:visible />
-</div>
+<Number client:visible />
 
 Below is [True Color Picker](./toys/color)
 
-<div class="my-7">
-  <Color client:visible />
-</div>
+<Color client:visible />
 
 And [IPv4 CIDR Calculator](./toys/ipv4)
 
-<div class="my-7">
-  <CIDR client:visible />
-</div>
+<CIDR client:visible />
 
 And [more](./toys) will come!

src/pages/toys/ipv4.mdx

@@ -5,6 +5,4 @@ toy: true
 ---
 import CIDR from '../../components/glue/EmbeddableCIDR.svelte';
 
-<div class="my-7">
-  <CIDR client:visible />
-</div>
+<CIDR client:visible />