Skip to content

Commit 32457a6

Browse files
saihajsaihaj
authored
chore: setup Tailwind prettier plugin (#1879)
1 parent a277570 commit 32457a6

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

70 files changed

+421
-359
lines changed

‎.prettierrc

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,5 +18,5 @@
1818
}
1919
}
2020
],
21-
"plugins": ["prettier-plugin-pkg"]
21+
"plugins": ["prettier-plugin-pkg", "prettier-plugin-tailwindcss"]
2222
}

‎package.json

+1
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,7 @@
7878
"eslint-plugin-tailwindcss": "3.17.5",
7979
"prettier": "3.4.2",
8080
"prettier-plugin-pkg": "^0.18.1",
81+
"prettier-plugin-tailwindcss": "^0.6.9",
8182
"remark-frontmatter": "5.0.0",
8283
"remark-lint-first-heading-level": "3.1.2",
8384
"remark-lint-heading-increment": "3.1.2",

‎pnpm-lock.yaml

+61
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/app/conf/2023/faq/page.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default function FAQPage() {
1212
<>
1313
<div className="bg-[#f4f6f8]">
1414
<div className="container">
15-
<div className="prose lg:prose-lg conf-block prose-a:text-primary max-w-4xl mx-auto">
15+
<div className="conf-block prose mx-auto max-w-4xl lg:prose-lg prose-a:text-primary">
1616
<FAQ />
1717
</div>
1818
</div>

‎src/app/conf/2023/gallery/page.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -23,15 +23,15 @@ export default function GalleryPage() {
2323

2424
return (
2525
<div className="bg-[#f4f6f8]">
26-
<div className="container conf-block">
26+
<div className="conf-block container">
2727
{currentImages.map((c, i) => {
2828
function getCard(index: number) {
2929
return (
3030
c[index] && (
3131
<Zoom>
3232
<NextImage
3333
alt="Gallery"
34-
className="object-cover aspect-video w-full hover:opacity-75 rounded-md"
34+
className="aspect-video w-full rounded-md object-cover hover:opacity-75"
3535
src={c[index]}
3636
/>
3737
</Zoom>
@@ -40,15 +40,15 @@ export default function GalleryPage() {
4040
}
4141

4242
return (
43-
<div key={i} className="grid lg:grid-cols-2 gap-2 mb-2">
44-
<div className="gap-2 flex flex-col">
43+
<div key={i} className="mb-2 grid gap-2 lg:grid-cols-2">
44+
<div className="flex flex-col gap-2">
4545
<div className="grid grid-cols-2 gap-2">
4646
{getCard(0)}
4747
{getCard(1)}
4848
</div>
4949
{getCard(2)}
5050
</div>
51-
<div className="gap-2 flex flex-col">
51+
<div className="flex flex-col gap-2">
5252
{getCard(3)}
5353
<div className="grid grid-cols-2 gap-2">
5454
{getCard(4)}

‎src/app/conf/2023/layout.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -49,10 +49,10 @@ export default function ConfLayout({
4949
logo={
5050
<NextLink
5151
href="/conf/2023"
52-
className="text-white flex gap-2 items-center nextra-logo"
52+
className="nextra-logo flex items-center gap-2 text-white"
5353
>
5454
<GraphQLConf className="h-6" />
55-
<span className="text-xl/none select-none">2023</span>
55+
<span className="select-none text-xl/none">2023</span>
5656
</NextLink>
5757
}
5858
links={[
@@ -72,12 +72,12 @@ export default function ConfLayout({
7272
{children}
7373
<Footer
7474
logo={
75-
<NextLink href="/conf/2023" className="text-white nextra-logo">
76-
<div className="flex gap-2 items-center">
75+
<NextLink href="/conf/2023" className="nextra-logo text-white">
76+
<div className="flex items-center gap-2">
7777
<GraphQLConf className="h-6" />
78-
<span className="text-xl/none select-none">2023</span>
78+
<span className="select-none text-xl/none">2023</span>
7979
</div>
80-
<HostedByGraphQLFoundation className="h-5 mt-2" />
80+
<HostedByGraphQLFoundation className="mt-2 h-5" />
8181
</NextLink>
8282
}
8383
links={[

‎src/app/conf/2023/page.tsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -24,20 +24,20 @@ export default function ConfPage() {
2424

2525
function Hero() {
2626
return (
27-
<div className="text-white max-md:text-base bg-[url('/img/conf/graphql-conf-bg.png')] bg-cover bg-blend-multiply bg-black/20">
27+
<div className="bg-black/20 bg-[url('/img/conf/graphql-conf-bg.png')] bg-cover text-white bg-blend-multiply max-md:text-base">
2828
<div className="container py-16 md:py-20">
29-
<div className="flex gap-6 items-center">
29+
<div className="flex items-center gap-6">
3030
<GraphQLConf className="h-14" />
31-
<span className="text-5xl select-none">2023</span>
31+
<span className="select-none text-5xl">2023</span>
3232
</div>
33-
<HostedByGraphQLFoundation className="h-10 mt-5" />
34-
<div className="flex md:items-center max-md:gap-3 gap-5 mt-5 max-md:flex-col">
35-
<div className="flex items-center max-md:gap-3 gap-5">
33+
<HostedByGraphQLFoundation className="mt-5 h-10" />
34+
<div className="mt-5 flex gap-5 max-md:flex-col max-md:gap-3 md:items-center">
35+
<div className="flex items-center gap-5 max-md:gap-3">
3636
<CalendarIcon className="h-6" />
3737
<span>September 19-21, 2023</span>
3838
</div>
3939
<span />
40-
<div className="flex items-center max-md:gap-3 gap-5">
40+
<div className="flex items-center gap-5 max-md:gap-3">
4141
<GlobeIcon className="size-6" />
4242
<span>San Francisco Bay Area, CA</span>
4343
</div>

‎src/app/conf/2023/schedule/page.tsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,13 @@ export default function SchedulePage() {
1212
return (
1313
<>
1414
<div className="container">
15-
<div className="prose lg:prose-lg py-10 text-white max-w-full">
15+
<div className="prose max-w-full py-10 text-white lg:prose-lg">
1616
<h1 className="text-white">GraphQLConf 2023 Schedule</h1>
17-
<section className="px-0 mx-0 my-8">
18-
<div className="flex gap-8 mb-1.5">
17+
<section className="mx-0 my-8 px-0">
18+
<div className="mb-1.5 flex gap-8">
1919
<span className="flex items-center">
2020
<svg
21-
className="mr-3 mb-0.5"
21+
className="mb-0.5 mr-3"
2222
width={20}
2323
height={20}
2424
xmlns="http://www.w3.org/2000/svg"
@@ -31,7 +31,7 @@ export default function SchedulePage() {
3131
</span>
3232
<span className="flex items-center">
3333
<svg
34-
className="mr-3 mb-0.5"
34+
className="mb-0.5 mr-3"
3535
width="20px"
3636
height="20px"
3737
xmlns="http://www.w3.org/2000/svg"
@@ -54,13 +54,13 @@ export default function SchedulePage() {
5454
</div>
5555
</div>
5656

57-
<div className="bg-[#f4f6f8] conf-block">
57+
<div className="conf-block bg-[#f4f6f8]">
5858
<div className="container">
5959
<a
6060
href="https://graphqlconf23.sched.com"
6161
target="_blank"
6262
rel="noreferrer"
63-
className="underline-offset-2 underline"
63+
className="underline underline-offset-2"
6464
>
6565
🔗 Bookmark sessions & plan your days on Sched
6666
</a>

‎src/app/conf/2023/sessions/[id]/page.tsx

+12-12
Original file line numberDiff line numberDiff line change
@@ -50,8 +50,8 @@ const Tag = ({
5050
!text ? null : (
5151
<span
5252
className={clsx(
53-
"border border-solid border-[#333333] font-semibold text-sm px-3 py-1 h-max rounded-full whitespace-nowrap",
54-
featured ? "bg-[#F8779D] border-[#F8779D] border-2 text-white" : "",
53+
"h-max whitespace-nowrap rounded-full border border-solid border-[#333333] px-3 py-1 text-sm font-semibold",
54+
featured ? "border-2 border-[#F8779D] bg-[#F8779D] text-white" : "",
5555
)}
5656
>
5757
{text}
@@ -86,12 +86,12 @@ export default function SessionPage({ params }: SessionProps) {
8686
<div className="bg-[#f4f6f8]">
8787
<div className="container">
8888
<div className="py-10">
89-
<section className="text-[#333333] min-h-[80vh] flex-col mx-auto px-2 xs:px-0 lg:justify-between justify-center md:container">
89+
<section className="xs:px-0 mx-auto min-h-[80vh] flex-col justify-center px-2 text-[#333333] md:container lg:justify-between">
9090
<div className="flex flex-col lg:px-0">
9191
<BackLink year="2023" kind="sessions" />
9292
{recordingTitle.rating > 0.5 && (
9393
<iframe
94-
className="aspect-video max-w-[1000px] mx-auto size-full rounded-md"
94+
className="mx-auto aspect-video size-full max-w-[1000px] rounded-md"
9595
src={`https://youtube.com/embed/${
9696
videos.find(e => e.title === recordingTitle.target)?.id
9797
}`}
@@ -101,14 +101,14 @@ export default function SessionPage({ params }: SessionProps) {
101101
/>
102102
)}
103103

104-
<div className="mt-10 flex flex-col self-center prose lg:prose-lg sm:space-y-4">
104+
<div className="prose mt-10 flex flex-col self-center lg:prose-lg sm:space-y-4">
105105
<div className="space-y-5">
106-
<div className="flex gap-3 flex-wrap">
106+
<div className="flex flex-wrap gap-3">
107107
<Tag text={eventType} featured />
108108
<Tag text={event.audience} />
109109
<Tag text={event.event_subtype} />
110110
</div>
111-
<h1 className="mt-0 text-2xl lg:text-3xl font-medium mb-5">
111+
<h1 className="mb-5 mt-0 text-2xl font-medium lg:text-3xl">
112112
{eventTitle}
113113
</h1>
114114
<span className="text-[#333333]">
@@ -119,22 +119,22 @@ export default function SessionPage({ params }: SessionProps) {
119119
- {format(parseISO(event.event_end), "hh:mmaaaa 'PDT'")}
120120
</span>
121121
</div>
122-
<div className="flex lg:flex-row flex-col sm:gap-5">
122+
<div className="flex flex-col sm:gap-5 lg:flex-row">
123123
{event.speakers!.map(speaker => (
124124
<div
125125
className="flex items-center gap-3"
126126
key={speaker.username}
127127
>
128128
<Avatar
129-
className="lg:size-[120px] size-[100px] rounded-full"
129+
className="size-[100px] rounded-full lg:size-[120px]"
130130
avatar={speaker.avatar}
131131
name={speaker.name}
132132
/>
133133

134-
<div className="flex flex-col lg:gap-1 gap-1.5">
134+
<div className="flex flex-col gap-1.5 lg:gap-1">
135135
<a
136136
href={`/conf/2023/speakers/${speaker.username}`}
137-
className="text-xl mt-0 font-bold text-[#333333] underline"
137+
className="mt-0 text-xl font-bold text-[#333333] underline"
138138
>
139139
{speaker.name}
140140
</a>
@@ -178,7 +178,7 @@ export default function SessionPage({ params }: SessionProps) {
178178
<div key={path}>
179179
<a href={path} target="_blank" rel="noreferrer">
180180
View Full PDF{" "}
181-
<span className="font-sans font-light text-2xl">
181+
<span className="font-sans text-2xl font-light">
182182
↗
183183
</span>
184184
</a>

‎src/app/conf/2023/sessions/page.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export const metadata: Metadata = {
1111
export default function SessionsPage() {
1212
return (
1313
<div className="bg-[#f4f6f8]">
14-
<div className="container conf-block">
14+
<div className="conf-block container">
1515
<SessionList
1616
year="2023"
1717
eventsColors={eventsColors}

‎src/app/conf/2023/speakers/[id]/page.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -54,17 +54,17 @@ export default function SpeakerPage({ params }: SpeakerProps) {
5454

5555
return (
5656
<div className="bg-[#f4f6f8] py-14 text-conf-black">
57-
<section className="flex flex-col container">
57+
<section className="container flex flex-col">
5858
<div className="flex flex-col">
5959
<NextLink
6060
href="/conf/2023/speakers"
61-
className="text-conf-black flex items-center text-lg hover:text-primary gap-2 transition-colors"
61+
className="flex items-center gap-2 text-lg text-conf-black transition-colors hover:text-primary"
6262
>
6363
<ChevronLeftIcon className="size-5" /> Back to Speakers
6464
</NextLink>
6565

6666
<div className="max-w-5xl self-center">
67-
<div className="pt-14 pb-20 flex flex-col sm:flex-row gap-0 sm:gap-10 gap-y-5 justify-between max-lg:flex-col-reverse">
67+
<div className="flex flex-col justify-between gap-0 gap-y-5 pb-20 pt-14 max-lg:flex-col-reverse sm:flex-row sm:gap-10">
6868
<div className="flex flex-col items-start gap-y-5">
6969
<h1 className="conf-heading">{speaker.name}</h1>
7070

@@ -85,7 +85,7 @@ export default function SpeakerPage({ params }: SpeakerProps) {
8585
href={social.url}
8686
target="_blank"
8787
rel="noreferrer"
88-
className="flex items-center w-max"
88+
className="flex w-max items-center"
8989
>
9090
<SocialMediaIcon
9191
service={
@@ -100,7 +100,7 @@ export default function SpeakerPage({ params }: SpeakerProps) {
100100
</div>
101101

102102
<Avatar
103-
className="self-center sm:self-start size-[280px] rounded-full"
103+
className="size-[280px] self-center rounded-full sm:self-start"
104104
avatar={speaker.avatar}
105105
name={speaker.name}
106106
/>

‎src/app/conf/2023/speakers/page.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ export const metadata: Metadata = {
99
export default function Page() {
1010
return (
1111
<>
12-
<div className="w-full flex justify-center">
13-
<div className="prose lg:prose-lg py-20 md:container px-2 xs:px-0">
12+
<div className="flex w-full justify-center">
13+
<div className="xs:px-0 prose px-2 py-20 md:container lg:prose-lg">
1414
<h1 className="text-white">GraphQLConf 2023 Speakers</h1>
1515
<p className="text-white sm:w-2/3">
1616
Meet the unique lineup of insightful speakers we've carefully
@@ -20,7 +20,7 @@ export default function Page() {
2020
</div>
2121
</div>
2222
<div className="bg-white">
23-
<section className="container flex gap-8 flex-wrap lg:justify-between justify-center conf-block">
23+
<section className="conf-block container flex flex-wrap justify-center gap-8 lg:justify-between">
2424
{speakers.map(speaker => (
2525
<Speaker key={speaker.username} {...speaker} year="2023" />
2626
))}

0 commit comments

Comments
 (0)