-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Updated opportunities and publication displays
- Loading branch information
Showing
18 changed files
with
3,400 additions
and
939 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
26 changes: 26 additions & 0 deletions
26
src/components/nodes/cards/stanford-opportunity/stanford-opportunity-card.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,26 @@ | ||
import Link from "@components/elements/link" | ||
import {H2, H3} from "@components/elements/headers" | ||
import {HtmlHTMLAttributes} from "react" | ||
import {NodeStanfordOpportunity} from "@lib/gql/__generated__/drupal.d" | ||
import ImageCard from "@components/patterns/image-card" | ||
import Wysiwyg from "@components/elements/wysiwyg" | ||
|
||
type Props = HtmlHTMLAttributes<HTMLDivElement> & { | ||
node: NodeStanfordOpportunity | ||
headingLevel?: "h2" | "h3" | ||
} | ||
|
||
const StanfordOpportunityCard = ({node, headingLevel, ...props}: Props) => { | ||
const image = node.suOppImage?.mediaImage | ||
const Heading = headingLevel === "h3" ? H3 : H2 | ||
|
||
return ( | ||
<ImageCard {...props} aria-labelledby={node.id} imageUrl={image?.url} isArticle> | ||
<Heading className="[&_a]:text-black" id={node.id}> | ||
<Link href={node.suOppSource?.url || node.path}>{node.title}</Link> | ||
</Heading> | ||
<Wysiwyg html={node.suOppSummary?.processed || node.body?.summary} /> | ||
</ImageCard> | ||
) | ||
} | ||
export default StanfordOpportunityCard |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
49 changes: 49 additions & 0 deletions
49
src/components/nodes/list-item/stanford-opportunity/stanford-opportunity-list-item.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
import Image from "next/image" | ||
import Link from "@components/elements/link" | ||
import {H2, H3} from "@components/elements/headers" | ||
import {HtmlHTMLAttributes} from "react" | ||
import {NodeStanfordOpportunity} from "@lib/gql/__generated__/drupal.d" | ||
import twMerge from "@lib/utils/twMerge" | ||
import Wysiwyg from "@components/elements/wysiwyg" | ||
|
||
type Props = HtmlHTMLAttributes<HTMLDivElement> & { | ||
node: NodeStanfordOpportunity | ||
headingLevel?: "h2" | "h3" | ||
} | ||
|
||
const StanfordOpportunityListItem = ({node, headingLevel, ...props}: Props) => { | ||
const image = node.suOppImage?.mediaImage | ||
const Heading = headingLevel === "h3" ? H3 : H2 | ||
|
||
return ( | ||
<article {...props} aria-labelledby={node.id} className={twMerge("@container", props.className)}> | ||
<div className="flex w-full flex-col justify-between @3xl:flex-row"> | ||
<div className="order-2 @3xl:order-1"> | ||
<Heading className="font-bold" id={node.id}> | ||
<Link | ||
href={node.suOppSource?.url || node.path} | ||
className="order-2 text-digital-red no-underline hocus:text-black hocus:underline" | ||
> | ||
{node.title} | ||
</Link> | ||
</Heading> | ||
|
||
<Wysiwyg html={node.suOppSummary?.processed || node.body?.summary} /> | ||
</div> | ||
|
||
{image?.url && ( | ||
<div className="relative order-1 mb-10 aspect-[16/9] shrink-0 @3xl:order-2 @3xl:mb-0 @3xl:w-1/4"> | ||
<Image | ||
className="ed11y-ignore object-cover" | ||
src={image.url} | ||
alt="" | ||
fill | ||
sizes="(max-width: 768px) 100vw, (max-width: 900px) 75vw, 1000px" | ||
/> | ||
</div> | ||
)} | ||
</div> | ||
</article> | ||
) | ||
} | ||
export default StanfordOpportunityListItem |
50 changes: 23 additions & 27 deletions
50
src/components/nodes/list-item/stanford-publication/stanford-publication-list-item.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,39 +1,35 @@ | ||
import Link from "@components/elements/link" | ||
import {H2, H3} from "@components/elements/headers" | ||
import {HtmlHTMLAttributes} from "react" | ||
import {NodeStanfordPublication} from "@lib/gql/__generated__/drupal.d" | ||
import twMerge from "@lib/utils/twMerge" | ||
import ReverseVisualOrder from "@components/elements/reverse-visual-order" | ||
import Wysiwyg from "@components/elements/wysiwyg" | ||
import Link from "@components/elements/link" | ||
|
||
type Props = HtmlHTMLAttributes<HTMLDivElement> & { | ||
node: NodeStanfordPublication | ||
headingLevel?: "h2" | "h3" | ||
apa?: boolean | ||
chicago?: boolean | ||
} | ||
|
||
const StanfordPublicationListItem = ({node, headingLevel, ...props}: Props) => { | ||
const citationUrl = node.suPublicationCitation?.suUrl?.url | ||
const Heading = headingLevel === "h3" ? H3 : H2 | ||
return ( | ||
<article | ||
{...props} | ||
aria-labelledby={node.id} | ||
className={twMerge("mx-auto w-full max-w-[500px] border border-black-20 p-10 shadow-xl", props.className)} | ||
> | ||
<ReverseVisualOrder> | ||
<Heading id={node.id}> | ||
<Link href={citationUrl || node.path}>{node.title}</Link> | ||
</Heading> | ||
<div className="font-bold">Publication</div> | ||
</ReverseVisualOrder> | ||
const StanfordPublicationListItem = ({node, apa, chicago, ...props}: Props) => { | ||
const citation = apa ? node.suPublicationCitation?.apa : node.suPublicationCitation?.chicago | ||
|
||
{node.suPublicationTopics && ( | ||
<div> | ||
{node.suPublicationTopics.map(topic => ( | ||
<div key={topic.id}>{topic.name}</div> | ||
))} | ||
</div> | ||
return ( | ||
<div {...props}> | ||
{citation && ( | ||
<Wysiwyg | ||
html={apa ? node.suPublicationCitation?.apa : node.suPublicationCitation?.chicago} | ||
className="ml-12 -indent-12 [&_a]:text-digital-red [&_a]:no-underline [&_a]:hocus:text-black [&_a]:hocus:underline" | ||
/> | ||
)} | ||
{!citation && ( | ||
<Link | ||
className="text-digital-red no-underline hocus:text-black hocus:underline" | ||
href={node.path} | ||
prefetch={false} | ||
> | ||
{node.title} | ||
</Link> | ||
)} | ||
</article> | ||
</div> | ||
) | ||
} | ||
export default StanfordPublicationListItem |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
13 changes: 13 additions & 0 deletions
13
src/components/nodes/pages/stanford-opportunity/stanford-opportunity-metadata.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
import {NodeStanfordOpportunity} from "@lib/gql/__generated__/drupal.d" | ||
import {getCleanDescription, getFirstText} from "@lib/utils/text-tools" | ||
import NodePageMetadata from "@components/nodes/pages/node-page-metadata" | ||
|
||
type Props = { | ||
node: NodeStanfordOpportunity | ||
} | ||
const StanfordOpportunityMetadata = ({node}: Props) => { | ||
const description = getCleanDescription(node.suOppSummary?.processed, 2) || getFirstText(node.suOppComponents) | ||
const image = node.suOppImage?.mediaImage | ||
return <NodePageMetadata pageTitle={node.title} description={description} image={image} /> | ||
} | ||
export default StanfordOpportunityMetadata |
70 changes: 70 additions & 0 deletions
70
src/components/nodes/pages/stanford-opportunity/stanford-opportunity-page.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,70 @@ | ||
import Rows from "@components/paragraphs/rows/rows" | ||
import {H1} from "@components/elements/headers" | ||
import {HtmlHTMLAttributes} from "react" | ||
import {NodeStanfordOpportunity} from "@lib/gql/__generated__/drupal.d" | ||
import StanfordOpportunityMetadata from "@components/nodes/pages/stanford-opportunity/stanford-opportunity-metadata" | ||
import Wysiwyg from "@components/elements/wysiwyg" | ||
import Image from "next/image" | ||
|
||
type Props = HtmlHTMLAttributes<HTMLDivElement> & { | ||
node: NodeStanfordOpportunity | ||
headingLevel?: "h2" | "h3" | ||
} | ||
|
||
const StanfordOpportunityPage = ({node, ...props}: Props) => { | ||
const image = node.suOppImage?.mediaImage | ||
return ( | ||
<article className="centered mt-32" {...props}> | ||
<StanfordOpportunityMetadata node={node} /> | ||
<H1>{node.title}</H1> | ||
|
||
<div className="grid grid-cols-3-1 gap-20"> | ||
<div className="space-y-20"> | ||
<Wysiwyg html={node.suOppSummary?.processed} /> | ||
<Wysiwyg html={node.body?.processed} /> | ||
</div> | ||
|
||
<div className="space-y-10"> | ||
{image?.url && ( | ||
<div className="relative order-1 mb-10 aspect-[16/9] shrink-0 @3xl:order-2 @3xl:mb-0 @3xl:w-1/4"> | ||
<Image | ||
className="ed11y-ignore object-cover" | ||
src={image.url} | ||
alt="" | ||
fill | ||
sizes="(max-width: 768px) 100vw, (max-width: 900px) 75vw, 1000px" | ||
/> | ||
</div> | ||
)} | ||
|
||
{node.suOppType && ( | ||
<div className="font-semibold"> | ||
{node.suOppType.map(oppType => ( | ||
<div key={oppType.id}>{oppType.name}</div> | ||
))} | ||
</div> | ||
)} | ||
|
||
{node.suOppApplicationDeadline && ( | ||
<div>Application Deadline: {new Date(node.suOppApplicationDeadline.time).toLocaleString()}</div> | ||
)} | ||
{node.suOppEligibility && ( | ||
<div> | ||
Eligibility: <Wysiwyg html={node.suOppEligibility.processed} /> | ||
</div> | ||
)} | ||
{node.suOppStartDate && <div>Start Date: {new Date(node.suOppStartDate.time).toLocaleDateString()}</div>} | ||
{node.suOppCourseCode && ( | ||
<div> | ||
{node.suOppCourseCode.map((code, i) => ( | ||
<div key={`course-code-${i}`}>{code}</div> | ||
))} | ||
</div> | ||
)} | ||
</div> | ||
</div> | ||
<Rows components={node.suOppComponents} className="mx-auto lg:w-8/12" /> | ||
</article> | ||
) | ||
} | ||
export default StanfordOpportunityPage |
Oops, something went wrong.