Skip to content

chore: setup Tailwind prettier plugin #1879

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Dec 19, 2024
Merged

chore: setup Tailwind prettier plugin #1879

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .prettierrc
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,5 +18,5 @@
}
}
],
"plugins": ["prettier-plugin-pkg"]
"plugins": ["prettier-plugin-pkg", "prettier-plugin-tailwindcss"]
}
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,7 @@
"eslint-plugin-tailwindcss": "3.17.5",
"prettier": "3.4.2",
"prettier-plugin-pkg": "^0.18.1",
"prettier-plugin-tailwindcss": "^0.6.9",
"remark-frontmatter": "5.0.0",
"remark-lint-first-heading-level": "3.1.2",
"remark-lint-heading-increment": "3.1.2",
Expand Down
61 changes: 61 additions & 0 deletions pnpm-lock.yaml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion src/app/conf/2023/faq/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ export default function FAQPage() {
<>
<div className="bg-[#f4f6f8]">
<div className="container">
<div className="prose lg:prose-lg conf-block prose-a:text-primary max-w-4xl mx-auto">
<div className="conf-block prose mx-auto max-w-4xl lg:prose-lg prose-a:text-primary">
<FAQ />
</div>
</div>
Expand Down
10 changes: 5 additions & 5 deletions src/app/conf/2023/gallery/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,15 +23,15 @@ export default function GalleryPage() {

return (
<div className="bg-[#f4f6f8]">
<div className="container conf-block">
<div className="conf-block container">
{currentImages.map((c, i) => {
function getCard(index: number) {
return (
c[index] && (
<Zoom>
<NextImage
alt="Gallery"
className="object-cover aspect-video w-full hover:opacity-75 rounded-md"
className="aspect-video w-full rounded-md object-cover hover:opacity-75"
src={c[index]}
/>
</Zoom>
Expand All @@ -40,15 +40,15 @@ export default function GalleryPage() {
}

return (
<div key={i} className="grid lg:grid-cols-2 gap-2 mb-2">
<div className="gap-2 flex flex-col">
<div key={i} className="mb-2 grid gap-2 lg:grid-cols-2">
<div className="flex flex-col gap-2">
<div className="grid grid-cols-2 gap-2">
{getCard(0)}
{getCard(1)}
</div>
{getCard(2)}
</div>
<div className="gap-2 flex flex-col">
<div className="flex flex-col gap-2">
{getCard(3)}
<div className="grid grid-cols-2 gap-2">
{getCard(4)}
Expand Down
12 changes: 6 additions & 6 deletions src/app/conf/2023/layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,10 +49,10 @@ export default function ConfLayout({
logo={
<NextLink
href="/conf/2023"
className="text-white flex gap-2 items-center nextra-logo"
className="nextra-logo flex items-center gap-2 text-white"
>
<GraphQLConf className="h-6" />
<span className="text-xl/none select-none">2023</span>
<span className="select-none text-xl/none">2023</span>
</NextLink>
}
links={[
Expand All @@ -72,12 +72,12 @@ export default function ConfLayout({
{children}
<Footer
logo={
<NextLink href="/conf/2023" className="text-white nextra-logo">
<div className="flex gap-2 items-center">
<NextLink href="/conf/2023" className="nextra-logo text-white">
<div className="flex items-center gap-2">
<GraphQLConf className="h-6" />
<span className="text-xl/none select-none">2023</span>
<span className="select-none text-xl/none">2023</span>
</div>
<HostedByGraphQLFoundation className="h-5 mt-2" />
<HostedByGraphQLFoundation className="mt-2 h-5" />
</NextLink>
}
links={[
Expand Down
14 changes: 7 additions & 7 deletions src/app/conf/2023/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,20 +24,20 @@ export default function ConfPage() {

function Hero() {
return (
<div className="text-white max-md:text-base bg-[url('/img/conf/graphql-conf-bg.png')] bg-cover bg-blend-multiply bg-black/20">
<div className="bg-black/20 bg-[url('/img/conf/graphql-conf-bg.png')] bg-cover text-white bg-blend-multiply max-md:text-base">
<div className="container py-16 md:py-20">
<div className="flex gap-6 items-center">
<div className="flex items-center gap-6">
<GraphQLConf className="h-14" />
<span className="text-5xl select-none">2023</span>
<span className="select-none text-5xl">2023</span>
</div>
<HostedByGraphQLFoundation className="h-10 mt-5" />
<div className="flex md:items-center max-md:gap-3 gap-5 mt-5 max-md:flex-col">
<div className="flex items-center max-md:gap-3 gap-5">
<HostedByGraphQLFoundation className="mt-5 h-10" />
<div className="mt-5 flex gap-5 max-md:flex-col max-md:gap-3 md:items-center">
<div className="flex items-center gap-5 max-md:gap-3">
<CalendarIcon className="h-6" />
<span>September 19-21, 2023</span>
</div>
<span />
<div className="flex items-center max-md:gap-3 gap-5">
<div className="flex items-center gap-5 max-md:gap-3">
<GlobeIcon className="size-6" />
<span>San Francisco Bay Area, CA</span>
</div>
Expand Down
14 changes: 7 additions & 7 deletions src/app/conf/2023/schedule/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,13 @@ export default function SchedulePage() {
return (
<>
<div className="container">
<div className="prose lg:prose-lg py-10 text-white max-w-full">
<div className="prose max-w-full py-10 text-white lg:prose-lg">
<h1 className="text-white">GraphQLConf 2023 Schedule</h1>
<section className="px-0 mx-0 my-8">
<div className="flex gap-8 mb-1.5">
<section className="mx-0 my-8 px-0">
<div className="mb-1.5 flex gap-8">
<span className="flex items-center">
<svg
className="mr-3 mb-0.5"
className="mb-0.5 mr-3"
width={20}
height={20}
xmlns="http://www.w3.org/2000/svg"
Expand All @@ -31,7 +31,7 @@ export default function SchedulePage() {
</span>
<span className="flex items-center">
<svg
className="mr-3 mb-0.5"
className="mb-0.5 mr-3"
width="20px"
height="20px"
xmlns="http://www.w3.org/2000/svg"
Expand All @@ -54,13 +54,13 @@ export default function SchedulePage() {
</div>
</div>

<div className="bg-[#f4f6f8] conf-block">
<div className="conf-block bg-[#f4f6f8]">
<div className="container">
<a
href="https://graphqlconf23.sched.com"
target="_blank"
rel="noreferrer"
className="underline-offset-2 underline"
className="underline underline-offset-2"
>
🔗 Bookmark sessions & plan your days on Sched
</a>
Expand Down
24 changes: 12 additions & 12 deletions src/app/conf/2023/sessions/[id]/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,8 @@ const Tag = ({
!text ? null : (
<span
className={clsx(
"border border-solid border-[#333333] font-semibold text-sm px-3 py-1 h-max rounded-full whitespace-nowrap",
featured ? "bg-[#F8779D] border-[#F8779D] border-2 text-white" : "",
"h-max whitespace-nowrap rounded-full border border-solid border-[#333333] px-3 py-1 text-sm font-semibold",
featured ? "border-2 border-[#F8779D] bg-[#F8779D] text-white" : "",
)}
>
{text}
Expand Down Expand Up @@ -86,12 +86,12 @@ export default function SessionPage({ params }: SessionProps) {
<div className="bg-[#f4f6f8]">
<div className="container">
<div className="py-10">
<section className="text-[#333333] min-h-[80vh] flex-col mx-auto px-2 xs:px-0 lg:justify-between justify-center md:container">
<section className="xs:px-0 mx-auto min-h-[80vh] flex-col justify-center px-2 text-[#333333] md:container lg:justify-between">
<div className="flex flex-col lg:px-0">
<BackLink year="2023" kind="sessions" />
{recordingTitle.rating > 0.5 && (
<iframe
className="aspect-video max-w-[1000px] mx-auto size-full rounded-md"
className="mx-auto aspect-video size-full max-w-[1000px] rounded-md"
src={`https://youtube.com/embed/${
videos.find(e => e.title === recordingTitle.target)?.id
}`}
Expand All @@ -101,14 +101,14 @@ export default function SessionPage({ params }: SessionProps) {
/>
)}

<div className="mt-10 flex flex-col self-center prose lg:prose-lg sm:space-y-4">
<div className="prose mt-10 flex flex-col self-center lg:prose-lg sm:space-y-4">
<div className="space-y-5">
<div className="flex gap-3 flex-wrap">
<div className="flex flex-wrap gap-3">
<Tag text={eventType} featured />
<Tag text={event.audience} />
<Tag text={event.event_subtype} />
</div>
<h1 className="mt-0 text-2xl lg:text-3xl font-medium mb-5">
<h1 className="mb-5 mt-0 text-2xl font-medium lg:text-3xl">
{eventTitle}
</h1>
<span className="text-[#333333]">
Expand All @@ -119,22 +119,22 @@ export default function SessionPage({ params }: SessionProps) {
- {format(parseISO(event.event_end), "hh:mmaaaa 'PDT'")}
</span>
</div>
<div className="flex lg:flex-row flex-col sm:gap-5">
<div className="flex flex-col sm:gap-5 lg:flex-row">
{event.speakers!.map(speaker => (
<div
className="flex items-center gap-3"
key={speaker.username}
>
<Avatar
className="lg:size-[120px] size-[100px] rounded-full"
className="size-[100px] rounded-full lg:size-[120px]"
avatar={speaker.avatar}
name={speaker.name}
/>

<div className="flex flex-col lg:gap-1 gap-1.5">
<div className="flex flex-col gap-1.5 lg:gap-1">
<a
href={`/conf/2023/speakers/${speaker.username}`}
className="text-xl mt-0 font-bold text-[#333333] underline"
className="mt-0 text-xl font-bold text-[#333333] underline"
>
{speaker.name}
</a>
Expand Down Expand Up @@ -178,7 +178,7 @@ export default function SessionPage({ params }: SessionProps) {
<div key={path}>
<a href={path} target="_blank" rel="noreferrer">
View Full PDF{" "}
<span className="font-sans font-light text-2xl">
<span className="font-sans text-2xl font-light">
↗
</span>
</a>
Expand Down
2 changes: 1 addition & 1 deletion src/app/conf/2023/sessions/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export const metadata: Metadata = {
export default function SessionsPage() {
return (
<div className="bg-[#f4f6f8]">
<div className="container conf-block">
<div className="conf-block container">
<SessionList
year="2023"
eventsColors={eventsColors}
Expand Down
10 changes: 5 additions & 5 deletions src/app/conf/2023/speakers/[id]/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,17 +54,17 @@ export default function SpeakerPage({ params }: SpeakerProps) {

return (
<div className="bg-[#f4f6f8] py-14 text-conf-black">
<section className="flex flex-col container">
<section className="container flex flex-col">
<div className="flex flex-col">
<NextLink
href="/conf/2023/speakers"
className="text-conf-black flex items-center text-lg hover:text-primary gap-2 transition-colors"
className="flex items-center gap-2 text-lg text-conf-black transition-colors hover:text-primary"
>
<ChevronLeftIcon className="size-5" /> Back to Speakers
</NextLink>

<div className="max-w-5xl self-center">
<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">
<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">
<div className="flex flex-col items-start gap-y-5">
<h1 className="conf-heading">{speaker.name}</h1>

Expand All @@ -85,7 +85,7 @@ export default function SpeakerPage({ params }: SpeakerProps) {
href={social.url}
target="_blank"
rel="noreferrer"
className="flex items-center w-max"
className="flex w-max items-center"
>
<SocialMediaIcon
service={
Expand All @@ -100,7 +100,7 @@ export default function SpeakerPage({ params }: SpeakerProps) {
</div>

<Avatar
className="self-center sm:self-start size-[280px] rounded-full"
className="size-[280px] self-center rounded-full sm:self-start"
avatar={speaker.avatar}
name={speaker.name}
/>
Expand Down
6 changes: 3 additions & 3 deletions src/app/conf/2023/speakers/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ export const metadata: Metadata = {
export default function Page() {
return (
<>
<div className="w-full flex justify-center">
<div className="prose lg:prose-lg py-20 md:container px-2 xs:px-0">
<div className="flex w-full justify-center">
<div className="xs:px-0 prose px-2 py-20 md:container lg:prose-lg">
<h1 className="text-white">GraphQLConf 2023 Speakers</h1>
<p className="text-white sm:w-2/3">
Meet the unique lineup of insightful speakers we've carefully
Expand All @@ -20,7 +20,7 @@ export default function Page() {
</div>
</div>
<div className="bg-white">
<section className="container flex gap-8 flex-wrap lg:justify-between justify-center conf-block">
<section className="conf-block container flex flex-wrap justify-center gap-8 lg:justify-between">
{speakers.map(speaker => (
<Speaker key={speaker.username} {...speaker} year="2023" />
))}
Expand Down
Loading
Loading