Skip to content

Commit

Permalink
fixup
Browse files Browse the repository at this point in the history
  • Loading branch information
@rebeccahongsf
rebeccahongsf committed Apr 19, 2024
1 parent 610f2ca commit b2e5698
Show file tree
Hide file tree
Showing 7 changed files with 166 additions and 144 deletions.
172 changes: 88 additions & 84 deletions src/components/config-pages/local-footer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,13 @@ import LockupP from "@components/elements/lockup/lockup-p";
import LockupR from "@components/elements/lockup/lockup-r";
import LockupS from "@components/elements/lockup/lockup-s";
import LockupT from "@components/elements/lockup/lockup-t";
import {JSX} from "react";
import {H2} from "@components/elements/headers";
import { JSX } from "react";
import { H2 } from "@components/elements/headers";
import TwitterIcon from "@components/elements/icons/TwitterIcon";
import YoutubeIcon from "@components/elements/icons/YoutubeIcon";
import FacebookIcon from "@components/elements/icons/FacebookIcon";
import { Maybe, StanfordLocalFooter} from "@lib/gql/__generated__/drupal.d";
import {buildUrl} from "@lib/drupal/utils";
import { Maybe, StanfordLocalFooter } from "@lib/gql/__generated__/drupal.d";
import { buildUrl } from "@lib/drupal/utils";
import InstagramIcon from "@components/elements/icons/InstagramIcon";
import LinkedInIcon from "@components/elements/icons/LinkedInIcon";

Expand Down Expand Up @@ -57,62 +57,63 @@ const LocalFooter = ({
line3: suLocalFootLine3,
line4: suLocalFootLine4,
line5: suLocalFootLine5,
logoUrl: !suLocalFootUseLogo && suLocalFootLocImg?.url ? buildUrl(suLocalFootLocImg?.url).toString() : undefined,
}
logoUrl:
!suLocalFootUseLogo && suLocalFootLocImg?.url
? buildUrl(suLocalFootLocImg?.url).toString()
: undefined,
};

return (
<div className="local-footer bg-foggy-light py-20">
<div className="centered">
<div className="grid grid-cols-6 md:grid-cols-12 gap-32 md:gap-y-0 [&_a]:font-semibold [&_a]:no-underline [&_a:hover]:underline [&_a:focus]:underline [&_a]:transition">

<div className="col-span-6 md:col-span-7 2xl:col-span-5 md:col-start-1 2xl:col-start-2 md:col-span-5 md:rs-mb-4">
<FooterLockup {...lockupProps} />
</div>

<div className="col-span-6 md:col-span-7 2xl:col-span-5 md:col-start-1 2xl:col-start-2 md:col-span-5">
{suLocalFootAddress && <Address {...suLocalFootAddress} />}

{suLocalFootAddress &&
<Address {...suLocalFootAddress}/>
}

{suLocalFootAction &&
{suLocalFootAction && (
<ul className="list-unstyled">
{suLocalFootAction.map((link, index) => {
if (!link.url) return;
return (
<li key={`footer-action-link-${index}`}>
<Link href={link.url}>
{link.title}
</Link>
<Link href={link.url}>{link.title}</Link>
</li>
)
);
})}
</ul>
}
)}

<Wysiwyg html={suLocalFootPrCo?.processed} className="text-archway"/>
<Wysiwyg
html={suLocalFootPrCo?.processed}
className="text-archway"
/>

{suLocalFootSocial &&
{suLocalFootSocial && (
<ul className="rs-mt-4 list-unstyled flex gap-11 items-center children:mb-0">
{suLocalFootSocial.map((link, index) => {
if (!link.url) return;
return (
<li key={`footer-action-link-${index}`}>
<Link href={link.url} className="text-archway">
<SocialIcon url={link.url}/>
<SocialIcon url={link.url} />
<span className="sr-only">{link.title}</span>
</Link>
</li>
)
);
})}
</ul>
}
)}
</div>

<div className="col-span-6 sm:col-span-3 md:col-span-2 md:col-start-8 2xl:col-start-7 font-roboto">
{suLocalFootPrimeH &&
<H2 className="text-m1 font-normal">{suLocalFootPrimeH}</H2>}
{suLocalFootPrimary &&
{suLocalFootPrimeH && (
<H2 className="text-m1 font-normal">{suLocalFootPrimeH}</H2>
)}
{suLocalFootPrimary && (
<ul className="list-unstyled">
{suLocalFootPrimary.map((link, index) => {
if (!link.url) return;
Expand All @@ -122,19 +123,19 @@ const LocalFooter = ({
{link.title}
</Link>
</li>
)
);
})}
</ul>
}
<Wysiwyg html={suLocalFootSeCo?.processed}/>

)}
<Wysiwyg html={suLocalFootSeCo?.processed} />
</div>

<div className="col-span-6 sm:col-span-3 md:col-start-10 2xl:col-start-9 font-roboto">
{suLocalFootSecondH &&
<H2 className="text-m1 font-normal">{suLocalFootSecondH}</H2>}
{suLocalFootSecondH && (
<H2 className="text-m1 font-normal">{suLocalFootSecondH}</H2>
)}

{suLocalFootSecond &&
{suLocalFootSecond && (
<ul className="list-unstyled">
{suLocalFootSecond.map((link, index) => {
if (!link.url) return;
Expand All @@ -144,112 +145,115 @@ const LocalFooter = ({
{link.title}
</Link>
</li>
)
);
})}
</ul>
}

<Wysiwyg html={suLocalFootTr2Co?.processed}/>
)}

<Wysiwyg html={suLocalFootTr2Co?.processed} />
</div>

<Wysiwyg html={suLocalFootTrCo?.processed}/>

<Wysiwyg html={suLocalFootTrCo?.processed} />
</div>
</div>
</div>
)
}

const SocialIcon = ({url}: { url: string }) => {
if (url.includes("facebook")) return <FacebookIcon />
if (url.includes("linkedin")) return <LinkedInIcon />
if (url.includes("twitter.com")) return <TwitterIcon />
if (url.includes("instagram.com")) return <InstagramIcon />
if (url.includes("youtube.com")) return <YoutubeIcon/>
);
};

const SocialIcon = ({ url }: { url: string }) => {
if (url.includes("facebook")) return <FacebookIcon />;
if (url.includes("linkedin")) return <LinkedInIcon />;
if (url.includes("twitter.com")) return <TwitterIcon />;
if (url.includes("instagram.com")) return <InstagramIcon />;
if (url.includes("youtube.com")) return <YoutubeIcon />;
return null;
}
};

export interface FooterLockupProps {
useDefault?: Maybe<boolean>
siteName?: Maybe<string>
lockupOption?: Maybe<string>
line1?: Maybe<string>
line2?: Maybe<string>
line3?: Maybe<string>
line4?: Maybe<string>
line5?: Maybe<string>
logoUrl?: Maybe<string>
useDefault?: Maybe<boolean>;
siteName?: Maybe<string>;
lockupOption?: Maybe<string>;
line1?: Maybe<string>;
line2?: Maybe<string>;
line3?: Maybe<string>;
line4?: Maybe<string>;
line5?: Maybe<string>;
logoUrl?: Maybe<string>;
}

const FooterLockup = ({useDefault = true, siteName, lockupOption, ...props}: FooterLockupProps): JSX.Element => {
const FooterLockup = ({
useDefault = true,
siteName,
lockupOption,
...props
}: FooterLockupProps): JSX.Element => {
const lockupProps = {
...props
}
...props,
};

lockupOption = useDefault ? "default" : lockupOption
lockupOption = useDefault ? "default" : lockupOption;

switch (lockupOption) {
case "none":
return (
<div className="py-10">
<Link href="/"
className="flex flex-row gap-4 no-underline font-roboto">
<LockupLogo {...lockupProps}/>
<Link
href="/"
className="flex flex-row gap-4 no-underline font-roboto"
>
<LockupLogo {...lockupProps} />
</Link>
</div>
)
);

case "a":
return <LockupA {...lockupProps}/>;
return <LockupA {...lockupProps} />;

case "b":
return <LockupB {...lockupProps}/>;
return <LockupB {...lockupProps} />;

case "d":
return <LockupD {...lockupProps}/>;
return <LockupD {...lockupProps} />;

case "e":
return <LockupE {...lockupProps}/>;
return <LockupE {...lockupProps} />;

case "h":
return <LockupH {...lockupProps}/>;
return <LockupH {...lockupProps} />;

case "i":
return <LockupI {...lockupProps}/>;
return <LockupI {...lockupProps} />;

case "m":
return <LockupM {...lockupProps}/>;
return <LockupM {...lockupProps} />;

case "o":
return <LockupO {...lockupProps}/>;
return <LockupO {...lockupProps} />;

case "p":
return <LockupP {...lockupProps}/>;
return <LockupP {...lockupProps} />;

case "r":
return <LockupR {...lockupProps}/>;
return <LockupR {...lockupProps} />;

case "s":
return <LockupS {...lockupProps}/>;
return <LockupS {...lockupProps} />;

case "t":
return <LockupT {...lockupProps}/>;
return <LockupT {...lockupProps} />;
}


return (
<div className="py-10">
<Link href="/" className="flex flex-row gap-4 no-underline">
<LockupLogo {...lockupProps}/>
<LockupLogo {...lockupProps} />

<div className="w-[1px] bg-black shrink-0"/>
<div className="w-[1px] bg-black shrink-0" />
<div className="font-normal text-black text-m2 leading-none">
{siteName || "University"}
</div>
</Link>
</div>
)

}
export default LocalFooter;
);
};
export default LocalFooter
6 changes: 3 additions & 3 deletions src/components/elements/action-link.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,15 @@ type Props = HtmlHTMLAttributes<HTMLAnchorElement> & {
/**
* Link url.
*/
href: string;
href: string
};

const ActionLink = ({ children, ...props }: Props) => {
return (
<Link {...props} className={twMerge("relative", props.className)}>
{children}
<ArrowRightIcon width={20} className='ml-2 inline-block' />
<ArrowRightIcon width={20} className="ml-2 inline-block" />
</Link>
);
};
export default ActionLink;
export default ActionLink
24 changes: 12 additions & 12 deletions src/components/elements/button.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,39 +9,39 @@ type Props = HtmlHTMLAttributes<HTMLAnchorElement | HTMLButtonElement> & {
/**
* Link URL.
*/
href?: Maybe<string>;
href?: Maybe<string>
/**
* If the element should be a <button>, default is <a>.
*/
buttonElem?: boolean;
buttonElem?: boolean
/**
* Display a larger button.
*/
big?: boolean;
big?: boolean
/**
* Display a secondary styled button.
*/
secondary?: boolean;
secondary?: boolean
/**
* Center the button in the container.
*/
centered?: boolean;
centered?: boolean
/**
* Click handler, mostly when using a button element.
*/
onClick?: MouseEventHandler;
onClick?: MouseEventHandler
/**
* Next.js prefetch functionality.
*/
prefetch?: boolean;
prefetch?: boolean
/**
* Type of button: submit, reset, or button.
*/
type?: HTMLButtonElement["type"];
type?: HTMLButtonElement["type"]
/**
* Disabled button element.
*/
disabled?: boolean;
disabled?: boolean
};

export const Button = ({
Expand Down Expand Up @@ -71,7 +71,7 @@ export const Button = ({
return (
<button
className={twMerge(standardClasses, className)}
type='button'
type="button"
{...props}
>
{children}
Expand All @@ -86,9 +86,9 @@ export const Button = ({
{...props}
>
{children}
<ArrowRightIcon width={20} className='ml-2 inline-block' />
<ArrowRightIcon width={20} className="ml-2 inline-block" />
</Link>
);
};

export default Button;
export default Button
Loading

0 comments on commit b2e5698

Please sign in to comment.