address PR comments for Beams component

src/constants/Categories.ts

@@ -59,6 +59,7 @@ export const CATEGORIES = [
     name: 'Backgrounds',
     subcategories: [
       'Aurora',
+      'Beams',
       'Dot Grid',
       'Silk',
       'Lightning',
@@ -70,4 +71,4 @@ export const CATEGORIES = [
       'Threads',
     ],
   }
-];
+];

src/constants/code/Backgrounds/beamsCode.ts

@@ -15,7 +15,6 @@ export const beams: CodeObject = {
       :noise-intensity="1.75"
       :scale="0.2"
       :rotation="0"
-      class="w-full h-full"
     />
   </div>
 </template>

src/content/Backgrounds/Beams/Beams.vue

@@ -453,17 +453,3 @@ onUnmounted(() => {
   cleanup()
 })
 </script>
-
-<style scoped>
-.beams-container {
-  position: relative;
-  width: 100%;
-  height: 100%;
-}
-
-.beams-container canvas {
-  width: 100%;
-  height: 100%;
-  display: block;
-}
-</style>

src/demo/Backgrounds/BeamsDemo.vue

@@ -12,14 +12,11 @@
             :noise-intensity="noiseIntensity"
             :scale="scale"
             :rotation="rotation"
-            class="w-full h-full"
           />
         </div>
 
         <Customize>
-          <div class="flex gap-4 items-center">
-            <PreviewColor title="Color" :model-value="lightColor" @update:model-value="lightColor = $event" />
-          </div>
+          <PreviewColor title="Color" :model-value="lightColor" @update:model-value="lightColor = $event" />
 
           <PreviewSlider
             title="Beam Width"