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

Commitf67be4d

Browse files
committed
match widths of sections
1 parent642954e commitf67be4d

File tree

2 files changed

+66
-64
lines changed

2 files changed

+66
-64
lines changed

‎components/About/index.tsx‎

Lines changed: 65 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -2,80 +2,82 @@ import Image from "next/image";
22

33
constAbout=()=>{
44
return(
5-
<sectionclassName="py-8 xl:px-24 px-10"id="about">
5+
<sectionclassName="py-8 xl:px-24sm:px-10 px-5"id="about">
66
<divclassName="text-center my-10">
77
<pclassName="text-[#3977F8] font-game text-xl">01</p>
88
<h1className="font-bold text-6xl">ABOUT</h1>
99
</div>
10-
<divclassName="lg:grid grid-cols-6 flex-1">
11-
{/* LEFT SIDE */}
12-
<divclassName="col-span-2 xl:mx-10 md:mx-5">
13-
<divclassName="flex items-center justify-center">
14-
<Imagesrc="/assets/csesoc_icon.svg"alt="CSESoc Icon"width={150}height={150}/>
15-
</div>
16-
<h1className="mt-10 text-3xl font-extrabold">CSESoc</h1>
17-
<pclassName="text-[#727B8C] font-medium">unsw-computer-science-soc</p>
18-
<buttonclassName="bg-[#444F6F] w-full my-5 py-2 rounded">Follow</button>
19-
<p>We are one of the biggest and most active societies at UNSW, catering to over 3500 CSE students spanning across degrees in Computer Science, Software Engineering, Bioinformatics and Computer Engineering.</p>
20-
<divclassName="my-4 flex gap-5">
21-
<Imagesrc="/assets/people_icon.svg"alt="People"width={20}height={20}/>
22-
<div>
23-
432<spanclassName="text-[#727B8C]">members</span> · 342<spanclassName="text-[#727B8C]">subcom</span>
10+
<divclassName="flex justify-center items-center">
11+
<divclassName="lg:grid grid-cols-6 flex-1 max-w-[90rem]">
12+
{/* LEFT SIDE */}
13+
<divclassName="col-span-2 md:mx-5">
14+
<divclassName="flex items-center justify-center">
15+
<Imagesrc="/assets/csesoc_icon.svg"alt="CSESoc Icon"width={150}height={150}/>
16+
</div>
17+
<h1className="mt-10 text-3xl font-extrabold">CSESoc</h1>
18+
<pclassName="text-[#727B8C] font-medium">unsw-computer-science-soc</p>
19+
<buttonclassName="bg-[#444F6F] w-full my-5 py-2 rounded">Follow</button>
20+
<p>We are one of the biggest and most active societies at UNSW, catering to over 3500 CSE students spanning across degrees in Computer Science, Software Engineering, Bioinformatics and Computer Engineering.</p>
21+
<divclassName="my-4 flex gap-5">
22+
<Imagesrc="/assets/people_icon.svg"alt="People"width={20}height={20}/>
23+
<div>
24+
432<spanclassName="text-[#727B8C]">members</span> · 342<spanclassName="text-[#727B8C]">subcom</span>
25+
</div>
26+
</div>
27+
<divclassName="my-4 flex gap-5">
28+
<Imagesrc="/assets/location_icon.svg"alt="Location"width={20}height={20}/>
29+
Sydney, Australia
30+
</div>
31+
<divclassName="flex gap-5">
32+
<Imagesrc="/assets/mail_icon.svg"alt="Mail"width={20}height={20}/>
33+
info@csesoc.org.au
2434
</div>
2535
</div>
26-
<divclassName="my-4 flex gap-5">
27-
<Imagesrc="/assets/location_icon.svg"alt="Location"width={20}height={20}/>
28-
Sydney, Australia
29-
</div>
30-
<divclassName="flex gap-5">
31-
<Imagesrc="/assets/mail_icon.svg"alt="Mail"width={20}height={20}/>
32-
info@csesoc.org.au
33-
</div>
34-
</div>
35-
{/* RIGHT SIDE */}
36-
<divclassName="col-span-4 lg:mt-0 mt-10">
37-
<divclassName="rounded border border-[#595F6D] p-5 2xl:h-80 xl:h-64 lg:h-48 sm:h-36 h-32 h-full">
38-
<pclassName="text-xs">
39-
csesoc/README<spanclassName="text-[#7A8192]">.md</span>
40-
</p>
41-
<pclassName="mt-5">Lorem Ipsum</p>
42-
</div>
43-
<divclassName="mt-10">
44-
Pinned
45-
<divclassName="sm:flex my-5">
46-
<divclassName="p-5 border border-[#595F6D] flex-1 rounded-lg mr-5 w-full sm:mb-0 mb-5">
47-
<divclassName="flex text-[#3A76F8]">
48-
<Imagesrc="/assets/book_icon.svg"alt="Book"width={20}height={20}/>
49-
csesoc.unsw.edu.au/<spanclassName="font-semibold">events</span>
36+
{/* RIGHT SIDE */}
37+
<divclassName="col-span-4 lg:mt-0 mt-10">
38+
<divclassName="rounded border border-[#595F6D] p-5 2xl:h-80 xl:h-64 lg:h-48 sm:h-36 h-32 h-full">
39+
<pclassName="text-xs">
40+
csesoc/README<spanclassName="text-[#7A8192]">.md</span>
41+
</p>
42+
<pclassName="mt-5">Lorem Ipsum</p>
43+
</div>
44+
<divclassName="mt-10">
45+
Pinned
46+
<divclassName="sm:flex my-5">
47+
<divclassName="p-5 border border-[#595F6D] flex-1 rounded-lg mr-5 w-full sm:mb-0 mb-5">
48+
<divclassName="flex text-[#3A76F8]">
49+
<Imagesrc="/assets/book_icon.svg"alt="Book"width={20}height={20}/>
50+
csesoc.unsw.edu.au/<spanclassName="font-semibold">events</span>
51+
</div>
52+
<divclassName="my-5">CSESoc's recent events</div>
53+
<divclassName="rounded-full bg-[#CC5421] w-3 h-3"/>
5054
</div>
51-
<divclassName="my-5">CSESoc's recent events</div>
52-
<divclassName="rounded-full bg-[#CC5421] w-3 h-3"/>
53-
</div>
54-
<divclassName="p-5 border border-[#595F6D] flex-1 rounded-lg w-full">
55-
<divclassName="flex text-[#3A76F8]">
56-
<Imagesrc="/assets/book_icon.svg"alt="Book"width={20}height={20}/>
57-
csesoc.unsw.edu.au/<spanclassName="font-semibold">socials</span>
55+
<divclassName="p-5 border border-[#595F6D] flex-1 rounded-lg w-full">
56+
<divclassName="flex text-[#3A76F8]">
57+
<Imagesrc="/assets/book_icon.svg"alt="Book"width={20}height={20}/>
58+
csesoc.unsw.edu.au/<spanclassName="font-semibold">socials</span>
59+
</div>
60+
<divclassName="my-5">Follow us on all socials</div>
61+
<divclassName="rounded-full bg-[#566ACE] w-3 h-3"/>
5862
</div>
59-
<divclassName="my-5">Follow us on all socials</div>
60-
<divclassName="rounded-full bg-[#566ACE] w-3 h-3"/>
6163
</div>
62-
</div>
63-
<divclassName="sm:flex">
64-
<divclassName="p-5 border border-[#595F6D] flex-1 rounded-lg mr-5 w-full sm:mb-0 mb-5">
65-
<divclassName="flex text-[#3A76F8]">
66-
<Imagesrc="/assets/book_icon.svg"alt="Book"width={20}height={20}/>
67-
csesoc.unsw.edu.au/<spanclassName="font-semibold">join-us</span>
64+
<divclassName="sm:flex">
65+
<divclassName="p-5 border border-[#595F6D] flex-1 rounded-lg mr-5 w-full sm:mb-0 mb-5">
66+
<divclassName="flex text-[#3A76F8]">
67+
<Imagesrc="/assets/book_icon.svg"alt="Book"width={20}height={20}/>
68+
csesoc.unsw.edu.au/<spanclassName="font-semibold">join-us</span>
69+
</div>
70+
<divclassName="my-5">Get involved!</div>
71+
<divclassName="rounded-full bg-[#E7E923] w-3 h-3"/>
6872
</div>
69-
<divclassName="my-5">Get involved!</div>
70-
<divclassName="rounded-full bg-[#E7E923] w-3 h-3"/>
71-
</div>
72-
<divclassName="p-5 border border-[#595F6D] flex-1 rounded-lg w-full">
73-
<divclassName="flex text-[#3A76F8]">
74-
<Imagesrc="/assets/book_icon.svg"alt="Book"width={20}height={20}/>
75-
csesoc.unsw.edu.au/<spanclassName="font-semibold">contact</span>
73+
<divclassName="p-5 border border-[#595F6D] flex-1 rounded-lg w-full">
74+
<divclassName="flex text-[#3A76F8]">
75+
<Imagesrc="/assets/book_icon.svg"alt="Book"width={20}height={20}/>
76+
csesoc.unsw.edu.au/<spanclassName="font-semibold">contact</span>
77+
</div>
78+
<divclassName="my-5">Contact us via email</div>
79+
<divclassName="rounded-full bg-[#CC5421] w-3 h-3"/>
7680
</div>
77-
<divclassName="my-5">Contact us via email</div>
78-
<divclassName="rounded-full bg-[#CC5421] w-3 h-3"/>
7981
</div>
8082
</div>
8183
</div>

‎components/ResourcesAndContacts/index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ const socialsBoxStyling = "xl:col-span-1 col-span-3 flex justify-center pt-2 pb-
77
constResourcesAndContacts=()=>{
88
return(
99
<sectionclassName="bg-no-repeat bg-center py-8 px-15 min-h-screen flex justify-center items-center">
10-
<divclassName="2xl:w-[90rem] xl:w-[75rem]md:w-[40rem] sm:w-[30rem]w-[90%]">
10+
<divclassName="2xl:w-[90rem] xl:w-[75rem] w-[90%]">
1111
<divclassName="relative">
1212
<Imagesrc="assets/resources_bg.svg"alt="Background"className="-z-50 absolute"fill/>
1313

0 commit comments

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