From be0406ebe0150a0417e8d2c8b6f260210e1bb1c3 Mon Sep 17 00:00:00 2001 From: Ritika Mishra Date: Wed, 13 Nov 2024 16:53:30 +0530 Subject: [PATCH 1/3] removed animation from heading --- src/app/globals.css | 1 + src/components/LandingComp/Features.tsx | 129 +++++++++--------------- 2 files changed, 51 insertions(+), 79 deletions(-) diff --git a/src/app/globals.css b/src/app/globals.css index db05d91..91fd074 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -116,6 +116,7 @@ height: 50px; animation: spin 1s linear infinite; } + .fade-in { opacity: 0; animation: fadeIn 0.9s ease-in-out forwards; diff --git a/src/components/LandingComp/Features.tsx b/src/components/LandingComp/Features.tsx index 907efde..8c7643d 100644 --- a/src/components/LandingComp/Features.tsx +++ b/src/components/LandingComp/Features.tsx @@ -37,93 +37,64 @@ export function Features() { image: "./assets/Pause.png", }, ]; - + return (
-
-
-
-

- {/* Mobile View with explicit delays */} - - Chords - is packed -
- - with - - - features - - +
+
+
+

+ {/* Mobile View */} + + Chords + is packed +
+ with + features + + + {/* Desktop View */} + + {["Chords", "is", "packed", "with", "features"].map((word, index) => ( + + {word} + + ))} + +

+

+ An overview of all the core features provides. +

+
+
- {/* Desktop View */} - - {["Chords", "is", "packed", "with", "features"].map((word, index) => ( - + {features.map((feature, index) => ( + - {word} - +
+
+ Icon +
+

{feature.title}

+

+ {feature.description} +

+
+ ))} - -

-

- An overview of all the core features provides. -

-
-
- - {/* Grid Layout for Cards */} -
- {features.map((feature, index) => ( - -
-
- Icon -
-

{feature.title}

-

- {feature.description} -

-
- - ))}
-
-
- - + ); } From a986e0df48de687d362892ce214f09a03d09cdcf Mon Sep 17 00:00:00 2001 From: Ritika Mishra Date: Thu, 14 Nov 2024 19:06:13 +0530 Subject: [PATCH 2/3] updated alignment of landing page --- src/app/page.tsx | 4 +- src/components/Connection.tsx | 4 +- src/components/LandingComp/FAQSection.tsx | 12 ++- src/components/LandingComp/Features.tsx | 22 ++-- src/components/LandingComp/HeadSection.tsx | 66 ++++++------ src/components/LandingComp/Steps.tsx | 5 +- src/components/LandingComp/TechStack.tsx | 111 +++++++++++---------- 7 files changed, 113 insertions(+), 111 deletions(-) diff --git a/src/app/page.tsx b/src/app/page.tsx index 9d06f08..ba15632 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -40,9 +40,9 @@ const page = () => { <>
- + - + diff --git a/src/components/Connection.tsx b/src/components/Connection.tsx index c9ad4c3..3e27d39 100644 --- a/src/components/Connection.tsx +++ b/src/components/Connection.tsx @@ -985,7 +985,7 @@ const Connection: React.FC = ({ -

Save Data as Zip

+

Save Recording

 @@ -1000,7 +1000,7 @@ const Connection: React.FC = ({ -

Delete All Data

+

Delete Recording
diff --git a/src/components/LandingComp/FAQSection.tsx b/src/components/LandingComp/FAQSection.tsx index 49c24d3..e52f919 100644 --- a/src/components/LandingComp/FAQSection.tsx +++ b/src/components/LandingComp/FAQSection.tsx @@ -104,7 +104,7 @@ const FAQSection = () => { answer: ( <> Chords supports an array format: [A0, A1, ..., A5, counter], where - A0-A5 are raw signal values and counter is a uint8_t (0-255). Array + A0-A5 are raw signal values and counter is a uint8_t (0-255). Array example : [468, 472, 463, 466, 465, 434, 10]. For implementation details, see our{" "} { }, ]; return ( -
+
-

- Frequently Asked Questions -

+
+

+ Frequently Asked Questions +

+
{FAQs.map((faq, index) => ( diff --git a/src/components/LandingComp/Features.tsx b/src/components/LandingComp/Features.tsx index 9d5ca77..d2455b2 100644 --- a/src/components/LandingComp/Features.tsx +++ b/src/components/LandingComp/Features.tsx @@ -21,7 +21,7 @@ export function Features() { { title: "Record & Save Data", description: - "Record and save data for future reference. Export data in CSV/ZIP format for further analysis.", + "Record and save data for future reference. Export data in CSV format for further analysis.", image: "./assets/DownloadIcon.png", }, { @@ -39,20 +39,22 @@ export function Features() { ]; return ( -
+
-
-
-

+
+
+

is packed with features

-

- An overview of all the core features provides. -

-
+ +

+ An overview of all the core features provides. +

+

+ {/* Grid Layout for Cards */} -
+
{features.map((feature, index) => ( { return ( <> -
+
{/* Text Section */}
- + Hi, Welcome to Chords - + Tune Into Your EXG Data - + With - + Chords
- Transform bio signals into clear, insightful visuals, enabling deeper - understanding of physiological patterns and processes. + Transform bio signals into clear, insightful visuals, enabling deeper + understanding of physiological patterns and processes.
-
-
- - - - - - -
+
+ + + + + +
-
+
{/* Animation Section */}
@@ -112,9 +110,9 @@ c 1.4089684,-1.39202 2.8179419,-2.78405 4.4681851,-4.13231 1.6502432,-1.34827 3. to="400,0" dur="4s" begin="0s" - repeatCount="indefinite" + repeatCount="indefinite" keySplines="0.4 0 0.2 1" - keyTimes="0; 1"/> + keyTimes="0; 1" />
diff --git a/src/components/LandingComp/Steps.tsx b/src/components/LandingComp/Steps.tsx index 734f7d4..c96769b 100644 --- a/src/components/LandingComp/Steps.tsx +++ b/src/components/LandingComp/Steps.tsx @@ -123,9 +123,8 @@ const CardSlider = () => { alt={currentCard.title} width={1500} height={500} - className={`${ - fadeIn ? 'fade-in' : '' - } rounded-md object-cover cursor-pointer lg:max-h-[500px] transition-opacity duration-500 ease-in-out`} + className={`${fadeIn ? 'fade-in' : '' + } rounded-md object-cover cursor-pointer lg:max-h-[500px] transition-opacity duration-500 ease-in-out`} onMouseEnter={() => setIsPaused(true)} onMouseLeave={() => setIsPaused(false)} onClick={handleImageClick} diff --git a/src/components/LandingComp/TechStack.tsx b/src/components/LandingComp/TechStack.tsx index 179d0f2..04a0b99 100644 --- a/src/components/LandingComp/TechStack.tsx +++ b/src/components/LandingComp/TechStack.tsx @@ -60,64 +60,65 @@ const Stack = () => { ]; return (
-
- - {/* Left Side (Text Content) */} -
-
-

- {/* Use block to force line break */} - is - - {/* Use block to force line break */} - open-source, - - {/* Use block to force line break */} - and free to use. - -

-

- It is powered by the following technologies, making it super fast, efficient, and reliable. -

-
-
- - - -
-
+
- {/* Right Side (Images) */} -
- {stack.map((item, index) => ( - - {item.name} -
-

{item.name}

-

{item.description}

-
- - ))} -
+ {/* Left Side (Text Content) */} +
+
+
+

+ {/* Force line break */} + is open-source, + + + {/* Force line break */} + and free to use. + +

+
+

+ It is powered by the following technologies, making it super fast, efficient, and reliable. +

+
+
+ + + +
+
- -
-
+ {/* Right Side (Images) */} +
+ {stack.map((item, index) => ( + + {item.name} +
+

{item.name}

+

{item.description}

+
+ + ))} +
+ + + +
+
); From 984c7a395efe9c06b93011804c2b53024fb7690e Mon Sep 17 00:00:00 2001 From: Ritika Mishra Date: Fri, 15 Nov 2024 16:59:50 +0530 Subject: [PATCH 3/3] updated alignment of first section for medium screens --- src/components/LandingComp/HeadSection.tsx | 26 +++++++++++----------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/src/components/LandingComp/HeadSection.tsx b/src/components/LandingComp/HeadSection.tsx index 66d254d..9c1782e 100644 --- a/src/components/LandingComp/HeadSection.tsx +++ b/src/components/LandingComp/HeadSection.tsx @@ -33,38 +33,38 @@ const HeadSection: React.FC = () => { return ( <> -
-
-
+
+
+
{/* Text Section */} -
-
+
+
Hi, Welcome to Chords - + Tune Into Your EXG Data - + With - + Chords -
+
Transform bio signals into clear, insightful visuals, enabling deeper understanding of physiological patterns and processes.
-
+
-
-
+ {/* Animation Section */}