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

refactoring , add YogaImageComponent, bcryptjs

Browse Source
This commit is contained in:
Schneider Roland
2025-01-09 08:48:50 +01:00
parent 9d7bb39769
commit 166b26c6a4
14 changed files with 91 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
yoga-app/src/components/about.us.component.tsx
View File

@@ -1,4 +1,4 @@
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const AboutUsComponent = () =>{
return (
@@ -7,13 +7,13 @@ const AboutUsComponent = () =>{
<div className="row">
<div className="col-lg-7 col-md-7 col-sm-12 col-xs-12">
<div className="aboutus_image">
<figure className="mb-0"><Image src="/assets/images/aboutus_image.png" alt="" className="img-fluid"/></figure>
<figure className="mb-0"><YogaImageComponent src="/assets/images/aboutus_image.png" alt="" className="img-fluid"/></figure>
</div>
<figure className="aboutus_top_shape left_shape mb-0">
<Image src="/assets/images/aboutus_top_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/aboutus_top_shape.png" alt="" className="img-fluid"/>
</figure>
<figure className="aboutus_bottom_shape left_shape mb-0">
<Image src="/assets/images/aboutus_bottom_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/aboutus_bottom_shape.png" alt="" className="img-fluid"/>
</figure>
</div>
<div className="col-lg-5 col-md-5 col-sm-12 col-xs-12" data-aos="fade-right">
@@ -23,7 +23,7 @@ const AboutUsComponent = () =>{
<p>Quis autem vel eum iure reprehenderit qui in eao voluptate velit esse quam nihil molestiae consequatur vel illum.</p>
<div className="aboutus_line_wrapper">
<h6>Modi tempora incidunt ut labore dolore magnam aliquam auerat volutaem.</h6>
<figure className="mb-0 purple_line"><Image src="/assets/images/aboutus_line.png" alt="" className="img-fluid" /></figure>
<figure className="mb-0 purple_line"><YogaImageComponent src="/assets/images/aboutus_line.png" alt="" className="img-fluid" /></figure>
</div>
<div className="btn_wrapper">
<a href="/about" className="text-decoration-none get_started_btn">Get Started</a>

10
yoga-app/src/components/blog.posts.component.tsx
View File

@@ -1,4 +1,4 @@
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const BlogPostsComponent = () => {
@@ -17,7 +17,7 @@ const BlogPostsComponent = () => {
<div className="row" data-aos="fade-up">
<div className="col-lg-6 col-md-6 col-sm-12 col-xs-12">
<div className="blog_posts_image position-relative">
<figure className="mb-0"><Image src="/assets/images/blog_posts_1.png" alt=""
<figure className="mb-0"><YogaImageComponent src="/assets/images/blog_posts_1.png" alt=""
className="img-fluid"/></figure>
<div className="blog_posts_image_content">
<span>YOGA</span>
@@ -31,7 +31,7 @@ const BlogPostsComponent = () => {
</div>
<div className="col-lg-6 col-md-6 col-sm-12 col-xs-12">
<div className="blog_posts_image position-relative">
<figure className="mb-0"><Image src="/assets/images/blog_posts_2.png" alt=""
<figure className="mb-0"><YogaImageComponent src="/assets/images/blog_posts_2.png" alt=""
className="img-fluid"/></figure>
<div className="blog_posts_image_content">
<span>FITNESS</span>
@@ -48,10 +48,10 @@ const BlogPostsComponent = () => {
<a href="/single-post.html" className="text-decoration-none view_blog">View All Blogs</a>
</div>
<figure className="blog_posts_left_shape left_shape mb-0">
<Image src="/assets/images/blog_posts_left_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/blog_posts_left_shape.png" alt="" className="img-fluid"/>
</figure>
<figure className="blog_posts_right_shape right_shape mb-0">
<Image src="/assets/images/blog_posts_right_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/blog_posts_right_shape.png" alt="" className="img-fluid"/>
</figure>
</div>
</section>

6
yoga-app/src/components/contact.us.component.tsx
View File

@@ -1,4 +1,4 @@
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const ContactUsComponent = () => {
@@ -57,7 +57,7 @@ const ContactUsComponent = () => {
<a className="popup-vimeo"
href="https://previews.customer.envatousercontent.com/6720474d-ddc3-4b86-acf1-8d093cb37b6d/watermarked_preview/watermarked_preview.mp4">
<figure className="video_img mb-0">
<Image className="thumb img-fluid" style={{"cursor": "pointer"}}
<YogaImageComponent className="thumb img-fluid" style={{"cursor": "pointer"}}
src="/assets/images/get_in_touch_video_icon.png" alt=""/>
</figure>
</a>
@@ -65,7 +65,7 @@ const ContactUsComponent = () => {
</div>
</div>
<figure className="get_in_touch_shape left_shape mb-0">
<Image src="/assets/images/get_in_touch_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/get_in_touch_shape.png" alt="" className="img-fluid"/>
</figure>
</div>
</section>

6
yoga-app/src/components/footer.component.tsx
View File

@@ -1,5 +1,5 @@
import Link from "next/link";
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const FooterComponent = () => {
@@ -10,7 +10,7 @@ const FooterComponent = () => {
<div className="col-lg-3 col-md-4 col-sm-6 col-xs-12 d-lg-block d-none">
<div className="footer_logo">
<Link href="/index.html" className="text-decoration-none">
<figure className="mb-0"><Image src="/assets/images/footer_logo.png" alt=""
<figure className="mb-0"><YogaImageComponent src="/assets/images/footer_logo.png" alt=""
className="img-fluid"/></figure>
</Link>
</div>
@@ -83,7 +83,7 @@ const FooterComponent = () => {
</div>
</div>
<div className="footer_shape right_shape">
<figure className="mb-0"><Image src="/assets/images/footer_shape.png" alt="" className="img-fluid"/>
<figure className="mb-0"><YogaImageComponent src="/assets/images/footer_shape.png" alt="" className="img-fluid"/>
</figure>
</div>
</section>

14
yoga-app/src/components/header.component.tsx
View File

@@ -1,4 +1,4 @@
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const HeaderComponent = () => {
return (
@@ -7,7 +7,7 @@ const HeaderComponent = () => {
<div className="main_header">
<div className="container-fluid">
<nav className="navbar navbar-expand-lg navbar-light p-0">
<a className="navbar-brand" href="/index"><figure className="mb-0"><Image src="/assets/images/yogastic_logo.png" alt=""/></figure></a>
<a className="navbar-brand" href="/index"><figure className="mb-0"><YogaImageComponent src="/assets/images/yogastic_logo.png" alt=""/></figure></a>
<button className="navbar-toggler collapsed" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon"></span>
<span className="navbar-toggler-icon"></span>
@@ -122,22 +122,22 @@ const HeaderComponent = () => {
<div className="col-lg-6 col-md-6 col-sm-12 col-xs-12">
<div className="banner-section-image">
<figure className="mb-0">
<Image src="/assets/images/banner_right_image.png" alt="" />
<YogaImageComponent src="/assets/images/banner_right_image.png" alt="" />
</figure>
</div>
</div>
</div>
<figure className="banner_left_top_shape left_shape mb-0">
<Image src="/assets/images/banner_left_top_shape.png" alt="" className="img-fluid" />
<YogaImageComponent src="/assets/images/banner_left_top_shape.png" alt="" className="img-fluid" />
</figure>
<figure className="banner_left_bottom_shape left_shape mb-0">
<Image src="/assets/images/banner_left_bottom_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/banner_left_bottom_shape.png" alt="" className="img-fluid"/>
</figure>
<figure className="banner_right_top_shape right_shape mb-0">
<Image src="/assets/images/banner_right_top_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/banner_right_top_shape.png" alt="" className="img-fluid"/>
</figure>
<figure className="banner_right_bottom_shape right_shape mb-0">
<Image src="/assets/images/banner_right_bottom_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/banner_right_bottom_shape.png" alt="" className="img-fluid"/>
</figure>
</div>
</section>

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

@@ -1,4 +1,4 @@
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const OurServiceComponent = () => {
return (
@@ -18,7 +18,7 @@ const OurServiceComponent = () => {
<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"><Image src="/assets/images/services_img_1.png" alt=""
<figure className="mb-0"><YogaImageComponent src="/assets/images/services_img_1.png" alt=""
className="img-fluid"/></figure>
</div>
<div className="services_box_lower_portion">
@@ -34,7 +34,7 @@ const OurServiceComponent = () => {
<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"><Image src="/assets/images/services_img_2.png" alt=""
<figure className="mb-0"><YogaImageComponent src="/assets/images/services_img_2.png" alt=""
className="img-fluid"/></figure>
</div>
<div className="services_box_lower_portion">
@@ -50,7 +50,7 @@ const OurServiceComponent = () => {
<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"><Image src="/assets/images/services_img_3.png" alt=""
<figure className="mb-0"><YogaImageComponent src="/assets/images/services_img_3.png" alt=""
className="img-fluid"/></figure>
</div>
<div className="services_box_lower_portion">
@@ -66,7 +66,7 @@ const OurServiceComponent = () => {
<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"><Image src="/assets/images/services_img_4.png" alt=""
<figure className="mb-0"><YogaImageComponent src="/assets/images/services_img_4.png" alt=""
className="img-fluid"/></figure>
</div>
<div className="services_box_lower_portion">
@@ -81,7 +81,7 @@ const OurServiceComponent = () => {
</div>
</div>
<figure className="services_left_shape left_shape mb-0">
<Image src="/assets/images/services_left_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/services_left_shape.png" alt="" className="img-fluid"/>
</figure>
</div>
</section>

10
yoga-app/src/components/our.specialities.component.tsx
View File

@@ -1,4 +1,4 @@
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const OurSpecialitiesComponent = () => {
@@ -35,13 +35,13 @@ const OurSpecialitiesComponent = () => {
<p className="specialties_paragraph">Neque orro quisquam est raui dolorem</p>
</div>
<figure className="specialties_left_line mb-0">
<Image src="/assets/images/specialties_left_line.png" alt="" className="img-fluid" />
<YogaImageComponent src="/assets/images/specialties_left_line.png" alt="" className="img-fluid" />
</figure>
</div>
</div>
<div className="col-lg-6 col-md-4 col-sm-6 col-xs-12 d-md-block d-none">
<figure className="specialties_image mb-0">
<Image src="/assets/images/specialties_image.png" alt="" className="img-fluid" />
<YogaImageComponent src="/assets/images/specialties_image.png" alt="" className="img-fluid" />
</figure>
</div>
<div className="col-lg-3 col-md-4 col-sm-6 col-xs-12" data-aos="fade-right">
@@ -63,13 +63,13 @@ const OurSpecialitiesComponent = () => {
<p className="specialties_paragraph">Neque orro quisquam est raui dolorem</p>
</div>
<figure className="specialties_right_line mb-0">
<Image src="/assets/images/specialties_right_line.png" alt="" className="img-fluid" />
<YogaImageComponent src="/assets/images/specialties_right_line.png" alt="" className="img-fluid" />
</figure>
</div>
</div>
</div>
<figure className="our_specialties_right_shape right_shape mb-0">
<Image src="/assets/images/our_specialties_right_shape.png" alt="" className="img-fluid" />
<YogaImageComponent src="/assets/images/our_specialties_right_shape.png" alt="" className="img-fluid" />
</figure>
</div>
</section>

14
yoga-app/src/components/pricing.component.tsx
View File

@@ -1,4 +1,4 @@
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const PricingComponent = () => {
@@ -20,11 +20,11 @@ const PricingComponent = () => {
<div className="pricing_plans_box_content">
<div className="pricing_plans_box_upper_portion">
<figure className="pricing_plans_image mb-0">
<Image src="/assets/images/pricing_plan_1.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/pricing_plan_1.png" alt="" className="img-fluid"/>
</figure>
<div className="pricing_plans_box_image_content">
<figure className="mb-0">
<Image src="/assets/images/pricing_plan_icon_1.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/pricing_plan_icon_1.png" alt="" className="img-fluid"/>
</figure>
</div>
</div>
@@ -54,11 +54,11 @@ const PricingComponent = () => {
<div className="pricing_plans_box_content">
<div className="pricing_plans_box_upper_portion">
<figure className="pricing_plans_image mb-0">
<Image src="/assets/images/pricing_plan_2.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/pricing_plan_2.png" alt="" className="img-fluid"/>
</figure>
<div className="pricing_plans_box_image_content">
<figure className="mb-0">
<Image src="/assets/images/pricing_plan_icon_2.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/pricing_plan_icon_2.png" alt="" className="img-fluid"/>
</figure>
</div>
</div>
@@ -87,11 +87,11 @@ const PricingComponent = () => {
<div className="pricing_plans_box_content">
<div className="pricing_plans_box_upper_portion">
<figure className="pricing_plans_image mb-0">
<Image src="/assets/images/pricing_plan_3.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/pricing_plan_3.png" alt="" className="img-fluid"/>
</figure>
<div className="pricing_plans_box_image_content">
<figure className="mb-0">
<Image src="/assets/images/pricing_plan_icon_3.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/pricing_plan_icon_3.png" alt="" className="img-fluid"/>
</figure>
</div>
</div>

10
yoga-app/src/components/quotes.component.tsx
View File

@@ -1,4 +1,4 @@
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const QuotesComponent = () => {
@@ -19,7 +19,7 @@ const QuotesComponent = () => {
exercita ionem ullam corporis suscitnis officiis debitis aut rerum
necessitatibus saepe
evenietut aer voluptates”</p>
<figure><Image src="/assets/images/testimonial_image.png" alt=""
<figure><YogaImageComponent src="/assets/images/testimonial_image.png" alt=""
className="img-fluid"/></figure>
<p className="testimonial_person_name">Himala Joerge</p>
<span>Happy client</span>
@@ -35,7 +35,7 @@ const QuotesComponent = () => {
exercita ionem ullam corporis suscitnis officiis debitis aut rerum
necessitatibus saepe
evenietut aer voluptates”</p>
<figure><Image src="/assets/images/testimonial_image.png" alt=""
<figure><YogaImageComponent src="/assets/images/testimonial_image.png" alt=""
className="img-fluid"/></figure>
<p className="testimonial_person_name">Himala Joerge</p>
<span>Happy client</span>
@@ -56,10 +56,10 @@ const QuotesComponent = () => {
</div>
</div>
<figure className="testimonial_left_shape left_shape mb-0">
<Image src="/assets/images/testimonial_left_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/testimonial_left_shape.png" alt="" className="img-fluid"/>
</figure>
<figure className="testimonial_right_shape right_shape mb-0">
<Image src="/assets/images/testimonial_right_shape.png" alt="" className="img-fluid"/>
<YogaImageComponent src="/assets/images/testimonial_right_shape.png" alt="" className="img-fluid"/>
</figure>
</div>
</div>

4
yoga-app/src/components/subscribe.component.tsx
View File

@@ -1,4 +1,4 @@
import Image from "next/image";
import YogaImageComponent from "@/components/yoga.image.component";
const SubscribeComponent = () => {
return (
@@ -23,7 +23,7 @@ const SubscribeComponent = () => {
</div>
<div className="col-lg-5 col-md-5 col-sm-6 col-xs-12">
<figure className="subscribe_image mb-0">
<Image src="/assets/images/subscribe_image.png" alt=""/>
<YogaImageComponent src="/assets/images/subscribe_image.png" alt=""/>
</figure>
</div>
</div>

18
yoga-app/src/components/yoga.image.component.tsx Normal file
View File

@@ -0,0 +1,18 @@
import clsx from "clsx";
import {CSSProperties} from "react";
export interface Properties {
src: string;
alt?: string;
className?: string;
style?: CSSProperties;
}
const YogaImageComponent = ( {src,alt,className,style}: Properties ) => {
return (
<img src={src} alt={alt || ""} className={ clsx( className )} style={style} />
);
}
export default YogaImageComponent;