Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit105f4e1

Browse files
committed
Use layout component
1 parentcab94e2 commit105f4e1

File tree

8 files changed

+204
-220
lines changed

8 files changed

+204
-220
lines changed

‎frontend/src/components/Layout.tsx‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
importNavbarfrom'./Navbar';
2+
importFooterfrom'./Footer';
3+
4+
constLayout=({ children}:{children:React.ReactNode})=>{
5+
return(
6+
<sectionclassName="flex flex-col min-h-screen justify-between py-8 xl:px-24 md:px-10 px-5 relative overflow-hidden">
7+
<Navbar/>
8+
{children}
9+
<Footer/>
10+
</section>
11+
);
12+
};
13+
14+
exportdefaultLayout;

‎frontend/src/components/Navbar.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ const Navbar = () => {
2121
height={200}
2222
draggable={false}
2323
/>
24-
<pclassName="font-mono mt-3text-sfont-bold">
24+
<pclassName="font-mono mt-3 font-bold">
2525
<spanclassName="text-green-500">csesoc@unsw</span>
2626
<span>:</span>
2727
<spanclassName="text-blue-500">~{path.map(segment=>'/'+segment.toLowerCase())}</span>

‎frontend/src/components/Resources/index.tsx‎

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

‎frontend/src/components/Sponsors/SponsorLinks.tsx‎

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

‎frontend/src/pages/contact-us.tsx‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
11
importContactsfrom'@/components/Contacts';
2-
importFooterfrom'@/components/Footer';
3-
importNavbarfrom'@/components/Navbar';
2+
importLayoutfrom'@/components/Layout';
43

54
exportdefaultfunctionContactUs(){
65
return(
7-
<sectionclassName="flex flex-col min-h-screen justify-between py-8 xl:px-24 md:px-10 px-5 relative overflow-hidden">
8-
<Navbar/>
6+
<Layout>
97
<sectionclassName="py-8 xl:px-24 sm:px-10 px-5"id="contact-us">
108
<divclassName="text-center my-10">
119
<h1className="font-bold text-6xl">CONTACT US</h1>
@@ -66,7 +64,6 @@ export default function ContactUs() {
6664
</div>
6765
</div>
6866
</section>
69-
<Footer/>
70-
</section>
67+
</Layout>
7168
);
7269
}

‎frontend/src/pages/events.tsx‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
importNavbarfrom'@/components/Navbar';
2-
importFooterfrom'@/components/Footer';
1+
importLayoutfrom'@/components/Layout';
32
importaxiosfrom'axios';
43

54
exportdefaultfunctionEventsPage(){
@@ -13,10 +12,8 @@ export default function EventsPage() {
1312
};
1413

1514
return(
16-
<sectionclassName="flex flex-col min-h-screen justify-between py-8 xl:px-24 md:px-10 px-5 relative overflow-hidden">
17-
<Navbar/>
15+
<Layout>
1816
<buttononClick={()=>pingBackend()}>Ping backend</button>
19-
<Footer/>
20-
</section>
17+
</Layout>
2118
);
2219
}

‎frontend/src/pages/resources.tsx‎

Lines changed: 98 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,103 @@
1-
importNavbarfrom'@/components/Navbar';
2-
importFooterfrom'@/components/Footer';
3-
importResourcesfrom'@/components/Resources';
1+
importLayoutfrom'@/components/Layout';
2+
importImagefrom'next/image';
3+
import{resourceCards,stage1,stage2,stage3}from'@/../public/data/resourceCards';
44

55
exportdefaultfunctionResourcesPage(){
6+
constboxStyling=
7+
'border border-[#595F6D] rounded-lg hover:border-[#788093] hover:bg-[#070034] hover:bg-opacity-75 transition-all duration-300';
8+
69
return(
7-
<sectionclassName="flex flex-col min-h-screen justify-between py-8 xl:px-24 md:px-10 px-5 relative overflow-hidden">
8-
<Navbar/>
9-
<Resources/>
10-
<Footer/>
11-
</section>
10+
<Layout>
11+
<sectionclassName="bg-no-repeat bg-center py-8 px-15 min-h-screen flex justify-center items-center">
12+
<divclassName="2xl:w-[90rem] xl:w-[75rem] w-[90%]">
13+
<divclassName="relative">
14+
<Imagesrc="assets/resources_bg.svg"alt="Background"className="-z-50 absolute"fill/>
15+
<divclassName="text-center my-10">
16+
<h2className="font-bold text-6xl">RESOURCES</h2>
17+
</div>
18+
19+
<divclassName="py-8 bg-no-repeat bg-center">
20+
<divclassName="grid grid-cols-4 1 gap-x-9 gap-y-5">
21+
{stage1.map((item:resourceCards)=>{
22+
return(
23+
<a
24+
key={item.id}
25+
href={item.href}
26+
target="_blank"
27+
className={`col-span-4 p-5${boxStyling} flex`}
28+
>
29+
<divclassName="flex justify-center align-middle items-center pl-2 pr-10">
30+
<Image
31+
src={item.svg}
32+
alt={item.alt}
33+
draggable="false"
34+
width={item.width}
35+
height={item.height}
36+
/>
37+
</div>
38+
<div>
39+
<h2className="mt-5 text-3xl font-extrabold">{item.title}</h2>
40+
<pclassName="mt-7 text-lg mb-5">{item.desc}</p>
41+
</div>
42+
</a>
43+
);
44+
})}
45+
46+
{stage2.map((item:resourceCards)=>{
47+
return(
48+
<a
49+
key={item.id}
50+
href={item.href}
51+
target="_blank"
52+
className={`xl:col-span-1 col-span-4 p-5${boxStyling}`}
53+
>
54+
<divclassName="flex align-middle items-center pt-2 pb-4">
55+
<Image
56+
src={item.svg}
57+
alt={item.alt}
58+
draggable="false"
59+
width={item.width}
60+
height={item.height}
61+
/>
62+
</div>
63+
<div>
64+
<h2className="mt-5 text-3xl font-extrabold">{item.title}</h2>
65+
<pclassName="mt-7 text-lg mb-5">{item.desc}</p>
66+
</div>
67+
</a>
68+
);
69+
})}
70+
71+
{stage3.map((item:resourceCards)=>{
72+
return(
73+
<a
74+
key={item.id}
75+
href={item.href}
76+
target="_blank"
77+
className={`md:col-span-2 col-span-4 p-5${boxStyling} flex`}
78+
>
79+
<divclassName="flex align-middle items-center pt-2 pb-4 pr-10">
80+
<Image
81+
src={item.svg}
82+
alt={item.alt}
83+
draggable="false"
84+
width={item.width}
85+
height={item.height}
86+
className="rounded-md"
87+
/>
88+
</div>
89+
<div>
90+
<h2className="mt-5 text-3xl font-extrabold">{item.title}</h2>
91+
<pclassName="mt-7 text-lg mb-5">{item.desc}</p>
92+
</div>
93+
</a>
94+
);
95+
})}
96+
</div>
97+
</div>
98+
</div>
99+
</div>
100+
</section>
101+
</Layout>
12102
);
13103
}

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp