Skip to content

Commit

Permalink
Merge pull request #86 from tskaigi/feature/add-formater
Browse files Browse the repository at this point in the history
フォーマッタの追加
  • Loading branch information
oku-44 authored Mar 5, 2024
2 parents 036f042 + 5d48e93 commit 8969829
Show file tree
Hide file tree
Showing 23 changed files with 1,243 additions and 482 deletions.
119 changes: 73 additions & 46 deletions app/call-for-proposals/page.tsx
Original file line number Diff line number Diff line change
@@ -1,42 +1,50 @@
import type { Metadata } from 'next'
import { selectionCommittee } from '@/app/lib/data';
import { getTitleByIndex, getDescriptionByIndex } from '../lib/utils'
import type { Metadata } from "next";
import { selectionCommittee } from "@/app/lib/data";
import { getTitleByIndex, getDescriptionByIndex } from "../lib/utils";
import { HiExternalLink } from "react-icons/hi";
import Qa from '@/app/ui/qa';
import Card from '../ui/card';
import Cta from '../ui/cta';
import Container from '../ui/container';
import { NavigateAnchorOnFirstRender } from '../functional/navigate-anchor-on-first-render';
import Image from 'next/image';
import Qa from "@/app/ui/qa";
import Card from "../ui/card";
import Cta from "../ui/cta";
import Container from "../ui/container";
import { NavigateAnchorOnFirstRender } from "../functional/navigate-anchor-on-first-render";
import Image from "next/image";

const targetIndex = 3;
const pageAnchors = {
overview: 'overview',
proposalOverview: 'proposal-overview',
judges: 'judges',
qAndA: 'questions-and-answers'
}
overview: "overview",
proposalOverview: "proposal-overview",
judges: "judges",
qAndA: "questions-and-answers",
};

export const metadata: Metadata = {
title: getTitleByIndex(targetIndex),
description: getDescriptionByIndex(targetIndex)
}
description: getDescriptionByIndex(targetIndex),
};

export default function Page() {
return (
<>
<NavigateAnchorOnFirstRender />
<Container>
<h1 className="text-2xl lg:text-4xl my-10">TSKaigi 2024のプロポーザル募集について <span className='text-xl text-error'>*現在、募集期間は終了しています</span></h1>
<h1 className="text-2xl lg:text-4xl my-10">
TSKaigi 2024のプロポーザル募集について{" "}
<span className="text-xl text-error">*現在、募集期間は終了しています</span>
</h1>
<div>
<h2 id={pageAnchors.overview} className="text-xl lg:text-3xl my-10 border-l-4 pl-2 scroll-mt-20">
<a href={`#${pageAnchors.overview}`}>
TSKaigi 2024概要
</a>
<h2
id={pageAnchors.overview}
className="text-xl lg:text-3xl my-10 border-l-4 pl-2 scroll-mt-20"
>
<a href={`#${pageAnchors.overview}`}>TSKaigi 2024概要</a>
</h2>
<div className="grid md:grid-cols-2 gap-8 my-12">
<div className="m-auto">
<img className="rounded-lg aspect-[4/3] md:aspect-video object-cover max-h-64" src="https://www.nakano-centralpark.jp/conference/wp-content/themes/company_renewal3/images/location_img_new.png" alt="tskaigi logo" />
<img
className="rounded-lg aspect-[4/3] md:aspect-video object-cover max-h-64"
src="https://www.nakano-centralpark.jp/conference/wp-content/themes/company_renewal3/images/location_img_new.png"
alt="tskaigi logo"
/>
</div>
<div>
<p>日程: 2024年5月11日(土)</p>
Expand Down Expand Up @@ -66,21 +74,30 @@ export default function Page() {
</div>
</div>
<p className="md:px-10">
TSKaigiは、節目となる発表の場を通じてエンジニアのアウトプットを促進して、日本のTypeScriptコミュニティを盛り上げるTypeScriptカンファレンスです!<br />
私たちの願いは、フロントエンドからバックエンド、インフラに至るまで、多様な分野のTypeScriptエンジニアたちが集い、普段は交流の少ないエンジニアたちが、それぞれの得意分野や最新の知見を交換し合う交流の場を創り出すことです。<br />
TSKaigiは、節目となる発表の場を通じてエンジニアのアウトプットを促進して、日本のTypeScriptコミュニティを盛り上げるTypeScriptカンファレンスです!
<br />
私たちの願いは、フロントエンドからバックエンド、インフラに至るまで、多様な分野のTypeScriptエンジニアたちが集い、普段は交流の少ないエンジニアたちが、それぞれの得意分野や最新の知見を交換し合う交流の場を創り出すことです。
<br />
<br />
経験のある方も初めて登壇される方にとっても、このカンファレンスが人生の新たな節目になることを願っています。
<br />
あなたの発表が、誰かのキャリア、あるいはプロジェクトに新たな光をもたらすかもしれません。
<br />
経験のある方も初めて登壇される方にとっても、このカンファレンスが人生の新たな節目になることを願っています。<br />
あなたの発表が、誰かのキャリア、あるいはプロジェクトに新たな光をもたらすかもしれません。<br />
ぜひ一緒に日本のTypeScriptコミュニティを盛り上げましょう!
</p>
<h2 id={pageAnchors.proposalOverview} className="text-xl lg:text-3xl my-10 border-l-4 pl-2 scroll-mt-20">
<a href={`#${pageAnchors.proposalOverview}`}>
プロポーザル募集概要
</a>
<h2
id={pageAnchors.proposalOverview}
className="text-xl lg:text-3xl my-10 border-l-4 pl-2 scroll-mt-20"
>
<a href={`#${pageAnchors.proposalOverview}`}>プロポーザル募集概要</a>
</h2>
<div className="grid md:grid-cols-2 gap-8 my-12">
<div className="m-auto">
<img src="/banner.jpg" className="object-cover h-48 md:h-56 lg:h-80 rounded-lg " alt="tskaigi logo" />
<img
src="/banner.jpg"
className="object-cover h-48 md:h-56 lg:h-80 rounded-lg "
alt="tskaigi logo"
/>
</div>
<div>
<p>応募締切: 2024年2月29日(木)</p>
Expand All @@ -97,10 +114,18 @@ export default function Page() {
<div className="divider divider-neutral my-0"></div>
<p>複数応募: 可</p>
<div className="divider divider-neutral my-0"></div>
<p>応募方法: 
<a className="link link-primary" href="https://docs.google.com/forms/d/e/1FAIpQLScYM2r5EKCY7rK45-fPSo0IQpoHKc5dgLg82y1PAr12QIFPYQ/viewform" rel="noopener noreferrer" target="_blank" >こちらのフォーム
<HiExternalLink className="inline-block ml-2" />
</a>から応募
<p>
応募方法: 
<a
className="link link-primary"
href="https://docs.google.com/forms/d/e/1FAIpQLScYM2r5EKCY7rK45-fPSo0IQpoHKc5dgLg82y1PAr12QIFPYQ/viewform"
rel="noopener noreferrer"
target="_blank"
>
こちらのフォーム
<HiExternalLink className="inline-block ml-2" />
</a>
から応募
</p>
<div className="divider divider-neutral my-0"></div>
</div>
Expand All @@ -113,24 +138,26 @@ export default function Page() {
subLink="mailto:[email protected]"
subLinkText="お問い合わせ"
/>
<h2 id={pageAnchors.judges} className="text-xl lg:text-3xl my-10 border-l-4 pl-2 scroll-mt-20">
<a href={`#${pageAnchors.judges}`}>
審査員紹介
</a>
<h2
id={pageAnchors.judges}
className="text-xl lg:text-3xl my-10 border-l-4 pl-2 scroll-mt-20"
>
<a href={`#${pageAnchors.judges}`}>審査員紹介</a>
</h2>
<p className="md:px-10 text-xl leading-relaxed">
以下のTypeScriptコミュニティの方々に審査員として参加していただいています。
</p>
<div className="md:px-10">
<Card cardData={selectionCommittee} />
</div>
<h2 id={pageAnchors.qAndA} className="text-xl lg:text-3xl mt-24 lg:mt-28 mb-10 border-l-4 pl-2 scroll-mt-20">
<a href={`#${pageAnchors.qAndA}`}>
Q&A よくある質問
</a>
</h2>
<h2
id={pageAnchors.qAndA}
className="text-xl lg:text-3xl mt-24 lg:mt-28 mb-10 border-l-4 pl-2 scroll-mt-20"
>
<a href={`#${pageAnchors.qAndA}`}>Q&A よくある質問</a>
</h2>
<Qa categoryName="CfP" />
</Container>
</>
)
}
);
}
105 changes: 47 additions & 58 deletions app/components/SponsorLogosSection.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import React from 'react'
import { sponsorList } from '../lib/data';
import Link from 'next/link';
import { SponsorData, SponsorList } from '../lib/definitions';
import React from "react";
import { sponsorList } from "../lib/data";
import Link from "next/link";
import { SponsorData, SponsorList } from "../lib/definitions";

const sponsorVariants = {
Platinum: {
Expand Down Expand Up @@ -46,86 +46,75 @@ const sponsorVariants = {
},
} as const;


type SponsorLogosSectionProps = {
showDraft: boolean;
anchor: string
}
anchor: string;
};

export const SponsorLogosSection = ({showDraft, anchor}: SponsorLogosSectionProps) => {
export const SponsorLogosSection = ({ showDraft, anchor }: SponsorLogosSectionProps) => {
return (
<div className="py-20">
<div className="max-w-4xl mx-auto">
<h2 id={anchor} className="text-2xl font-bold text-center text-accent lg:text-3xl mb-20 scroll-mt-20">
<a href="#sponsor">TSKaigi 2024 スポンサー各社</a>
</h2>
</div>
<div className="mx-auto pb-20">
{(["Platinum", "Gold", "Silver"] as const).map((plan) => {
const list = sponsorList[plan].filter(sponsor => showDraft || !sponsor.draft)
<div className="py-20">
<div className="max-w-4xl mx-auto">
<h2
id={anchor}
className="text-2xl font-bold text-center text-accent lg:text-3xl mb-20 scroll-mt-20"
>
<a href="#sponsor">TSKaigi 2024 スポンサー各社</a>
</h2>
</div>
<div className="mx-auto pb-20">
{(["Platinum", "Gold", "Silver"] as const).map((plan) => {
const list = sponsorList[plan].filter((sponsor) => showDraft || !sponsor.draft);
if (list.length === 0) {
return null;
}
return <PlanSponsors key={plan} plan={plan} sponsors={list} />;
})}
<div className="grid grid-cols-2 gap-4">
{(["Event Platform", "Refreshment", "Coffee", "Beer"] as const).map((plan) => {
const list = sponsorList[plan].filter((sponsor) => showDraft || !sponsor.draft);
if (list.length === 0) {
return null
return null;
}
return (
<PlanSponsors
key={plan}
plan={plan}
sponsors={list}
/>
)}
)}
<div className="grid grid-cols-2 gap-4">
{(["Event Platform", "Refreshment", "Coffee", "Beer"] as const).map(plan => {
const list = sponsorList[plan].filter(sponsor => showDraft || !sponsor.draft)
if (list.length === 0) {
return null
}
return (
<PlanSponsors
key={plan}
plan={plan}
sponsors={list}
isOptionalPlan
/>
)}
)}
</div>
<PlanSponsors
plan="Bronze"
sponsors={sponsorList.Bronze.filter(sponsor => showDraft || !sponsor.draft)}
/>
return <PlanSponsors key={plan} plan={plan} sponsors={list} isOptionalPlan />;
})}
</div>
<PlanSponsors
plan="Bronze"
sponsors={sponsorList.Bronze.filter((sponsor) => showDraft || !sponsor.draft)}
/>
</div>

)
}

</div>
);
};

const PlanSponsors = ({
plan,
sponsors,
isOptionalPlan
isOptionalPlan,
}: {
plan: keyof SponsorList;
sponsors: SponsorData[]
isOptionalPlan?: boolean
sponsors: SponsorData[];
isOptionalPlan?: boolean;
}) => {
return (
<div>
<h3 className={`text-2xl font-bold divider ${sponsorVariants[plan].divider}`}>
{`${plan}${!isOptionalPlan ? " Sponsors" : ""}`}
</h3>
<div className={`grid my-8 px-4 sm:px-6 lg:px-8 mt-8 mb-12 grid-cols-1 ${sponsorVariants[plan].gridSize}`}>
<div
className={`grid my-8 px-4 sm:px-6 lg:px-8 mt-8 mb-12 grid-cols-1 ${sponsorVariants[plan].gridSize}`}
>
{sponsors.map((sponsor) => (
<Link
key={sponsor.name}
href={sponsor.logoLink}
rel="noopener noreferrer"
target="_blank"
>
>
<div
key={sponsor.name}
className={`text-sm my-auto rounded-md md:rounded-lg bg-white mb-4 hover:opacity-80 hover:shadow-md transition duration-300 ease-in-out overflow-hidden ${sponsorVariants[plan].height} ${["Platinum", "Gold"].includes(plan) ? (sponsor.addPadding ? "p-8" : "p-2") : (sponsor.addPadding ? "p-2" : "p-1")}`}
className={`text-sm my-auto rounded-md md:rounded-lg bg-white mb-4 hover:opacity-80 hover:shadow-md transition duration-300 ease-in-out overflow-hidden ${sponsorVariants[plan].height} ${["Platinum", "Gold"].includes(plan) ? (sponsor.addPadding ? "p-8" : "p-2") : sponsor.addPadding ? "p-2" : "p-1"}`}
>
<img
className="p-4 h-full w-full object-contain"
Expand All @@ -137,5 +126,5 @@ const PlanSponsors = ({
))}
</div>
</div>
)
}
);
};
Loading

0 comments on commit 8969829

Please sign in to comment.