rschneider/yogastic
1
0
Fork 0
Code Issues 28 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

fix yoga services

Browse Source
This commit is contained in:
Schneider Roland 2025-03-28 22:09:28 +01:00
parent cf6201cfa9
commit 886505885b
3 changed files with 51 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
yoga-app/src/app/page.tsx
View File

@ -34,8 +34,8 @@ export default async function Home() {
return (
<>
{ header && <MainHeaderComponent config={header}/> }
{ ourServices && <OurServicesComponent header={ourServices.header!} description={ourServices.description!} title={ourServices.title!}/> }
{ aboutUs && <AboutUsComponent data={aboutUs} /> }
{ ourServices && <OurServicesComponent config={ourServices}/> }
{ ourSpecialities && <OurSpecialitiesComponent config={ourSpecialities} /> }
{ contactUs && <ContactUsComponent contactUs={contactUs} /> }
{ prices && <PricingComponent config={prices}/> }

79
yoga-app/src/components/our.services.component.tsx
View File

@ -1,11 +1,14 @@
import YogaImageComponent from "@/components/yoga.image.component";
import {
OurServicesComponent_Plain
} from "@/types/generated-strapi-interfaces/components/yoga-site/OurServicesComponent";
import {YogaOurServicesComponent_Plain} from "@/types/generated-strapi-interfaces/api/yoga-our-services-component";
import OurServiceItemComponent from "@/components/our.services.item.component";
export interface Props{
title: string;
header: string;
description: string;
config: YogaOurServicesComponent_Plain
}
const OurServiceComponent = ({title,header,description}: Props) => {
const OurServiceComponent = ({config: {title,header,description,services}}: Props) => {
return (
<section className="services_section">
<div className="container">
@ -19,70 +22,10 @@ const OurServiceComponent = ({title,header,description}: Props) => {
</div>
</div>
<div className="row" data-aos="fade-up">
<div className="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<div className="services_box_content">
<div className="services_box_upper_portion">
<figure className="mb-0"><YogaImageComponent src="/assets/images/services_img_1.png" alt=""
className="img-fluid"/></figure>
</div>
<div className="services_box_lower_portion">
<h3>Prenatal Yoga</h3>
<p>Finibus metus elit tempus faucibus urna nunc aui.</p>
<div className="btn_wrapper">
<a href="/services" className="text-decoration-none"><i
className="fa-solid fa-arrow-right" aria-hidden="true"></i></a>
</div>
</div>
</div>
</div>
<div className="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<div className="services_box_content">
<div className="services_box_upper_portion">
<figure className="mb-0"><YogaImageComponent src="/assets/images/services_img_2.png" alt=""
className="img-fluid"/></figure>
</div>
<div className="services_box_lower_portion">
<h3>Meditation</h3>
<p>Ainibus metus elit tempus faucibus urna nunc cui.</p>
<div className="btn_wrapper">
<a href="/services" className="text-decoration-none"><i
className="fa-solid fa-arrow-right" aria-hidden="true"></i></a>
</div>
</div>
</div>
</div>
<div className="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<div className="services_box_content">
<div className="services_box_upper_portion">
<figure className="mb-0"><YogaImageComponent src="/assets/images/services_img_3.png" alt=""
className="img-fluid"/></figure>
</div>
<div className="services_box_lower_portion">
<h3>Nutrition Consultation</h3>
<p>Binibus metus elit tempus faucibus urna nunc eui.</p>
<div className="btn_wrapper">
<a href="/services" className="text-decoration-none"><i
className="fa-solid fa-arrow-right" aria-hidden="true"></i></a>
</div>
</div>
</div>
</div>
<div className="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<div className="services_box_content">
<div className="services_box_upper_portion">
<figure className="mb-0"><YogaImageComponent src="/assets/images/services_img_4.png" alt=""
className="img-fluid"/></figure>
</div>
<div className="services_box_lower_portion">
<h3>Hatha Yoga</h3>
<p>Dinibus metus elit tempus faucibus urna nunc rui.</p>
<div className="btn_wrapper">
<a href="/services" className="text-decoration-none"><i
className="fa-solid fa-arrow-right" aria-hidden="true"></i></a>
</div>
</div>
</div>
</div>
{services.map(
itemConfig =>
<OurServiceItemComponent config={itemConfig} />
)}
</div>
<figure className="services_left_shape left_shape mb-0">
<YogaImageComponent src="/assets/images/services_left_shape.png" alt="" className="img-fluid"/>

39
yoga-app/src/components/our.services.item.component.tsx Normal file
View File

@ -0,0 +1,39 @@
import YogaImageComponent from "@/components/yoga.image.component";
import {
OurServicesComponent_Plain
} from "@/types/generated-strapi-interfaces/components/yoga-site/OurServicesComponent";
import {YogaOurServicesComponent_Plain} from "@/types/generated-strapi-interfaces/api/yoga-our-services-component";
import {YogaSingleService_Plain} from "@/types/generated-strapi-interfaces/api/yoga-single-service";
import {StrapiFile} from "@/types/types";
import strapiApi from "@/api/strapi/strapi-api";
export interface Props {
config: YogaSingleService_Plain
}
const OurServiceItemComponent = ({config: {header,description,image}}: Props) => {
const imageFile: StrapiFile = image as StrapiFile;
return (
<div className="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<div className="services_box_content">
<div className="services_box_upper_portion">
<figure className="mb-0">
<YogaImageComponent src={strapiApi.getImageUrl(imageFile.url)} alt="" className="img-fluid"/>
</figure>
</div>
<div className="services_box_lower_portion">
<h3>{header}</h3>
<p>{description}</p>
<div className="btn_wrapper">
<a href="/services" className="text-decoration-none"><i
className="fa-solid fa-arrow-right" aria-hidden="true"></i></a>
</div>
</div>
</div>
</div>
);
}
export default OurServiceItemComponent;