Skip to content

Commit 874c8ec

Browse files
initial commit
1 parent 1c40b28 commit 874c8ec

32 files changed

+745
-232
lines changed

Images/landingPic.jpg

15.4 KB
Loading

Styles/CategoryCard.module.css

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
.CategoryCard{
2+
object-fit: fill;
3+
margin: 1rem 1.5rem 0rem 1.5rem;
4+
}
5+
6+
.CC_img{
7+
filter: brightness(0.8);
8+
}
9+
.CC_content{
10+
cursor: pointer;
11+
}
12+
.CC_text{
13+
position: relative;
14+
top: -13rem;
15+
left: 5rem;
16+
width: 150px;
17+
color: white;
18+
}

Styles/Collections.module.css

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
.Collections_List{
2+
width: 70%;
3+
display: flex;
4+
flex-direction: row;
5+
flex-wrap: wrap;
6+
justify-content: flex-start;
7+
margin: 0rem auto;
8+
}
9+
.CollectionsHead{
10+
width: 100%;
11+
text-align: center;
12+
margin: 2rem auto;
13+
}

Styles/Footer.module.css

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
.Footer{
2+
display: flex;
3+
flex-direction: row;
4+
justify-content: space-evenly;
5+
padding: 2rem 5rem;
6+
background-color: rgb(214, 214, 214);
7+
border-bottom: 0.1px solid rgb(189, 189, 189);
8+
}
9+
.footer_s1btn{
10+
background-color: hsl(331, 80%, 86%);
11+
padding: 1rem 2rem;
12+
font-size: 1em;
13+
border: none;
14+
outline: none;
15+
cursor: pointer;
16+
color: white;
17+
}
18+
.footer_s1btn:hover{
19+
background-color: hotpink;
20+
}
21+
.footer_s1input{
22+
padding: 1rem 2rem;
23+
width: 300px;
24+
font-size: 1em;
25+
border: 1px solid grey;
26+
}
27+
.Footer_list{
28+
display: flex;
29+
flex-direction: row;
30+
}
31+
.Footer_list_item{
32+
color: grey !important;
33+
margin-right: 1em;
34+
}
35+
.Footer_bottom{
36+
/* width: 100%; */
37+
height: 100px;
38+
background-color: rgb(214, 214, 214);
39+
display: flex;
40+
flex-direction: column;
41+
align-items: flex-end;
42+
padding:2rem 5rem;
43+
}
44+
.fa-instagram{
45+
font-size: 2rem;
46+
}

Styles/Navbar.module.css

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
.Navbar{
2+
height: 80px;
3+
font-family: Arapey, serif;
4+
background-color: white;
5+
width: 100%;
6+
display: flex;
7+
border: 1px solid grey;
8+
color: rgb(80, 80, 80);
9+
flex-direction: row;
10+
align-items: center;
11+
justify-content: space-between;
12+
}
13+
.section1{
14+
cursor: pointer;
15+
}
16+
.section1logo{
17+
margin: 0rem 1.5rem;
18+
}
19+
.Navbar_item_active{
20+
color: black;
21+
margin-right: 1rem;
22+
padding: 0.2rem 0.5rem;
23+
}
24+
.Navbar_item{
25+
margin-right: 1rem;
26+
padding: 0.2rem 0.5rem;
27+
}
28+
.Navbar_item:hover , .Navbar_item_active:hover{
29+
text-decoration: underline;
30+
}
31+
.Navbar_list{
32+
display: flex;
33+
flex-direction: row;
34+
}
35+
.Navbar_list_right{
36+
margin-right: 1rem;
37+
padding: 0.2rem 0.5rem;
38+
}
39+
.Navbar_list_right:hover{
40+
color: grey;
41+
}

Styles/Styles.global.css

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css");
2+
@import url('https://fonts.googleapis.com/css2?family=Arapey&display=swap');
3+
body{
4+
margin: 0px;
5+
padding: 0px;
6+
font-family: 'Arapey',serif;
7+
max-width: 100%;
8+
overflow-x: hidden;
9+
}
10+
li{
11+
list-style: none;
12+
}
13+
a{
14+
text-decoration: none;
15+
color: grey;
16+
}

Styles/contact.module.css

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
.contact{
2+
display: flex;
3+
height: 400px;
4+
flex-direction: column;
5+
align-items: center;
6+
justify-content: center;
7+
padding: 2rem 1rem;
8+
}

Styles/home.module.css

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
.hometop_banner {
2+
background-color: #292626;
3+
color: white;
4+
top: 0;
5+
margin-top: 0px;
6+
font-size: 0.5em;
7+
width: 100%;
8+
height: fit-content;
9+
padding: 0.3em 0em ;
10+
text-align: center;
11+
}
12+
.LandingSection {
13+
width: 100%;
14+
height: 800px;
15+
overflow: hidden;
16+
object-fit: none;
17+
}
18+
.Landingimg {
19+
filter: brightness(0.8);
20+
}
21+
.LandingInnerSection {
22+
position: absolute;
23+
top: 40%;
24+
left: 30%;
25+
text-align: center;
26+
}
27+
.Landingimgtext {
28+
font-size: 4em;
29+
color: rgb(255, 255, 255);
30+
}
31+
.Landingbtn {
32+
padding: 1rem 2rem;
33+
border: none;
34+
background-color: hsl(330, 100%, 84%);
35+
color: white;
36+
font-size: 1em;
37+
cursor: pointer;
38+
}
39+
.Landingbtn:hover {
40+
background-color: hotpink;
41+
}
42+
.section3 {
43+
display: flex;
44+
flex-direction: row;
45+
justify-content: space-evenly;
46+
padding: 5rem 5rem;
47+
}
48+
.s3s1 {
49+
width: 400px;
50+
}
51+
.s3s2 {
52+
width: 400px;
53+
font-size: 1.3em;
54+
}

Styles/product.module.css

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
.productList{
2+
width: 100%;
3+
margin: 0.2rem auto;
4+
}
5+
.productListbar{
6+
padding: 0rem 10rem;
7+
display: flex;
8+
flex-direction: row;
9+
justify-content: space-between;
10+
border: 0.5px solid rgb(192, 192, 192);
11+
border-left: none;
12+
border-right: none;
13+
}
14+
.productListSections1{
15+
display: flex;
16+
flex-direction: row;
17+
justify-content: space-evenly;
18+
}
19+
.productList_dropdown{
20+
outline: none;
21+
border: none;
22+
}
23+
.productListsection{
24+
height: fit-content;
25+
display: flex;
26+
flex-direction: row;
27+
margin: 2rem auto;
28+
/* border: 1px solid grey; */
29+
flex-wrap: wrap;
30+
width: 71.5%;
31+
}

Styles/productCard.module.css

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
.productCard{
2+
width: 280px;
3+
height: 400px;
4+
cursor: pointer;
5+
object-fit: contain;
6+
margin: 1rem 2.5rem;
7+
}
8+
.soldout{
9+
padding: 0.5rem;
10+
width: 50px;
11+
font-size: 0.7em;
12+
background-color: white;
13+
border: 1px solid black;
14+
}

components/CategoryCard.tsx

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import Link from "next/link";
2+
import { Fragment } from "react";
3+
import styles from "../Styles/CategoryCard.module.css";
4+
type CategoryCardProps = {
5+
key: number;
6+
name: string;
7+
path: string;
8+
img: string;
9+
};
10+
const CategoryCard = ({ key, name, path, img }: CategoryCardProps) => {
11+
return (
12+
<Fragment>
13+
<div key={key} className={styles.CategoryCard}>
14+
<Link href={`/Collections/${path}`}>
15+
<div className={styles.CC_content}>
16+
<img
17+
src={img}
18+
width="300px"
19+
height="320px"
20+
className={styles.CC_img}
21+
alt="card picture"
22+
/>
23+
<h1 className={styles.CC_text}>{name}</h1>
24+
</div>
25+
</Link>
26+
</div>
27+
</Fragment>
28+
);
29+
};
30+
31+
export default CategoryCard;

components/Footer.tsx

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import Link from "next/link";
2+
import styles from "../Styles/Footer.module.css";
3+
4+
function Footer() {
5+
return (
6+
<>
7+
<div className={styles.Footer}>
8+
<div className={styles.footer_s1}>
9+
<p>Newsletter</p>
10+
<input
11+
className={styles.footer_s1input}
12+
type="text"
13+
placeholder="Email Address"
14+
/>
15+
<button className={styles.footer_s1btn}>SUBSCRIBE</button>
16+
</div>
17+
<div className={styles.footer_s2}>
18+
<p>Quick links</p>
19+
<ul className={styles.Footer_list}>
20+
<li className={styles.Footer_list_item}>
21+
<Link href="/Search">Search</Link>
22+
</li>
23+
<li className={styles.Footer_list_item}>
24+
<Link href="/Terms&Conditions">Terms & Conditions</Link>
25+
</li>
26+
<li className={styles.Footer_list_item}>
27+
<Link href="/StorePolicy">Store Policy</Link>
28+
</li>
29+
<li className={styles.Footer_list_item}>
30+
<Link href="/PrivacyPolicy">Privacy Policy</Link>
31+
</li>
32+
</ul>
33+
</div>
34+
</div>
35+
<div className={styles.Footer_bottom}>
36+
<i className="fab fa-instagram"></i>
37+
<p>© 2021, ShiThrone</p>
38+
</div>
39+
</>
40+
);
41+
}
42+
43+
export default Footer;

components/Layout.tsx

Lines changed: 0 additions & 41 deletions
This file was deleted.

components/List.tsx

Lines changed: 0 additions & 19 deletions
This file was deleted.

0 commit comments

Comments
 (0)