Update

SuveenE · Nov 6, 2024 · 33662ea · 33662ea
1 parent cf5fcf0
commit 33662ea
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -13,7 +13,7 @@ export default function Home() {
     <div className="flex bg-white text-black flex-col items-center justify-items-center min-h-screen p-12  pb-20 mx-auto">
       <p className="text-xl font-bold">Photos to video in seconds.</p>
       <p className="text-gray-600 mt-2">
-        Upload images, add music, and create a photo montage!
+        Upload images, add music, and create a beautiful photo montage!
       </p>
       <div className="md:grid md:grid-cols-5 gap-4 mt-4 md:min-w-[1000px]">
         <div className="flex flex-col gap-2 md:gap-4 col-span-3">
@@ -22,7 +22,7 @@ export default function Home() {
             selectedAudio={selectedAudio}
             setSelectedAudio={setSelectedAudio}
           />
-        </div>
+        </div>x
         <div className="col-span-2 mt-4 md:mt-0">
           <VideoGenerator images={images} audioTrack={selectedAudio} />
         </div>

diff --git a/src/components/audioSelector.tsx b/src/components/audioSelector.tsx
@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { PauseCircleIcon, PlayCircleIcon } from "lucide-react";
+import { PauseCircleIcon, PlayCircleIcon, Music } from "lucide-react";
 
 interface AudioSelectorProps {
   selectedAudio: string;
@@ -39,7 +39,7 @@ export default function AudioSelector({
 
   return (
     <div className="w-full max-w-3xl">
-      <h3 className="text-md font-semibold mb-4">Select Background Music:</h3>
+      <h3 className="flex flex-row gap-4 text-md font-semibold mb-4"><span className="text-indigo-600"><Music /></span> Select Background Music:</h3>
       <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
         {audioTracks.map((track) => (
           <div

diff --git a/src/components/imageUpload.tsx b/src/components/imageUpload.tsx
@@ -49,7 +49,7 @@ export default function ImageUpload({ images, setImages }: ImageUploadProps) {
 
       {error && <p className="text-red-500 mt-2">{error}</p>}
 
-      <div className="mt-4 p-4 grid grid-cols-4 max-h-80 gap-4 overflow-y-auto">
+      <div className="mt-4 p-4 grid grid-cols-4 max-h-8 gap-4 overflow-y-auto">
         {images.map((file, index) => (
           <div key={index} className="relative">
             <Image