-
Notifications
You must be signed in to change notification settings - Fork 39
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
11 changed files
with
153 additions
and
140 deletions.
There are no files selected for viewing
8 changes: 1 addition & 7 deletions
8
examples/ecommerce-jewellery-store/src/components/BackgroundImage.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
6 changes: 1 addition & 5 deletions
6
examples/ecommerce-jewellery-store/src/components/CardsList.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
59 changes: 59 additions & 0 deletions
59
examples/ecommerce-jewellery-store/src/components/CategoryList.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,59 @@ | ||
|
|
||
| import { useNavigate } from "react-router-dom"; | ||
| import { CategoryListProps } from "../data/types"; | ||
| import { Button } from "@progress/kendo-react-buttons"; | ||
| import { CardDescriptor } from "../data/types"; | ||
|
|
||
| export const CategoryList = (props: CategoryListProps) => { | ||
| const navigate = useNavigate(); | ||
| const onNavigate = (card: CardDescriptor) => { | ||
| if(card.collectionText === "AURELIA"){ | ||
| navigate("/category") | ||
| } | ||
| } | ||
|
|
||
| return ( | ||
| <> | ||
| <div className="k-h2 k-font-bold k-text-black k-col-span-12 k-text-center"> | ||
| Our Collections | ||
| </div> | ||
| <div | ||
| className="k-font-size-xl k-p-5 k-col-span-12 k-text-center" | ||
| style={{ | ||
| paddingBottom: "1rem", | ||
| }} | ||
| > | ||
| Enjoy an excellent selection of fine jewelry | ||
| </div> | ||
| <div className="k-d-grid k-grid-cols-12 k-col-span-12"> | ||
| {props.data.map((card, index) => { | ||
| return ( | ||
| <div key={index} className="k-col-span-4 k-text-center"> | ||
| <img | ||
| width={"360px"} | ||
| height={"319px"} | ||
| style={{ | ||
| minWidth: "360px", | ||
| paddingBottom: "1rem", | ||
| }} | ||
| src={card.img} | ||
| /> | ||
| <span className="k-pt-md"> | ||
| Collection "{card.collectionText}" | ||
| </span> | ||
| <div | ||
| style={{ | ||
| paddingTop: "1rem", | ||
| }} | ||
| > | ||
| <Button themeColor={"primary"} size={"large"} onClick={() => onNavigate(card)}> | ||
| Buy Now | ||
| </Button> | ||
| </div> | ||
| </div> | ||
| ); | ||
| })} | ||
| </div> | ||
| </> | ||
| ); | ||
| } |
8 changes: 2 additions & 6 deletions
8
examples/ecommerce-jewellery-store/src/components/CustomizedSection.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,11 +1,7 @@ | ||
| export type SectionProps = { | ||
| children: React.ReactNode | ||
| } | ||
|
|
||
| import { SectionProps } from "../data/types"; | ||
|
|
||
| export const CustomSection = (props: SectionProps) => { | ||
| return <section className="k-d-grid k-grid-cols-12 k-col-span-12 k-justify-content-center k-align-items-center"> | ||
| {props.children} | ||
| </section> | ||
| }; | ||
| // k-d-grid k-grid-cols-12 k-col-span-12 k-justify-content-center | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
10 changes: 1 addition & 9 deletions
10
examples/ecommerce-jewellery-store/src/components/OrderedImageCard.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
6 changes: 1 addition & 5 deletions
6
examples/ecommerce-jewellery-store/src/components/SizedParent.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,53 @@ | ||
| export type CardDescriptor = { | ||
| img: string; | ||
| collectionText: string; | ||
| }; | ||
|
|
||
| export type DataModel = { | ||
| text: string; | ||
| } | ||
|
|
||
| export type ListDataDescriptor = { | ||
| img: string | null; | ||
| status: string | null; | ||
| title: string; | ||
| category: "Bracelets" | "Earrings" | "Rings" | "Watches" | "Necklaces"; | ||
| material: "Silver" | "Gold"; | ||
| oldPrice: number | null; | ||
| newPrice: number; | ||
| }; | ||
|
|
||
| export type BackgroundImageProps = { | ||
| title: string; | ||
| subtitle: string; | ||
| buttonText: string; | ||
| img: string; | ||
| }; | ||
|
|
||
| export type CardListProps = { | ||
| data: any[]; | ||
| } | ||
|
|
||
| export type SectionProps = { | ||
| children: React.ReactNode | ||
| } | ||
|
|
||
| export type LayoutProps = { | ||
| children: React.ReactNode | ||
| } | ||
|
|
||
| export type OrderedImgTextProps = { | ||
| title: string; | ||
| subtitle: string; | ||
| contentText: string; | ||
| img: string; | ||
| order: string; | ||
| }; | ||
|
|
||
| export type SizedParentProps = { | ||
| children: React.ReactNode; | ||
| }; | ||
|
|
||
| export type CategoryListProps = { | ||
| data: any[]; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.