some responsive changes

This commit is contained in:
Jason Jordan
2025-07-25 10:56:20 -04:00
parent 234a02f783
commit d1ebd100b5
3 changed files with 27 additions and 35 deletions
+1 -1
View File
@@ -47,7 +47,7 @@ const InfoCard: React.FC<InfoCardProps> = (
})}>
<div className={classnames({
"hidden" : !invert,
"after:absolute after:bottom-0 after:right-0 after:w-full after:h-114 after:rounded-2xl after:shadow-[8px_8px_6px,2px_2px_2px_-1px] after:shadow-copper/90" : invert,
"after:absolute after:bottom-0 after:right-0 after:w-full after:h-[calc(100%-(var(--spacing)*23.5))] after:rounded-2xl after:shadow-[8px_8px_6px,2px_2px_2px_-1px] after:shadow-copper/90" : invert,
})}/>
<div className={classnames("flex flex-col w-7/12")}>
<div className={classnames(
+1 -11
View File
@@ -26,18 +26,8 @@ const LandingPage: React.FC<LandingPageProps> = ({
<div className={classnames(
"relative h-full border-l-6 rounded-out-br-4xl bg-bluetang border-atmosphere"
)} />
{/* <div className={classnames(
"h-9 rounded-bl-4xl border-b-6 border-l-6",
stripeColor, `border-${underlineBorder}`
)} /> */}
</div>
</div>
{/* <div className="w-11/12 flex justify-start">
<div className={classnames(
"w-full h-9 border-b-6 rounded-br-4xl",
stripeColor, `border-${underlineBorder}`
)} />
</div> */}
</div>
<div className="w-full flex justify-start items-end pt-30">
<div className="w-1/24 h-full flex justify-end">
@@ -68,7 +58,7 @@ const LandingPage: React.FC<LandingPageProps> = ({
<div className="absolute flex flex-col justify-center left-0 bottom-0 w-full h-full">
<div className={classnames("relative h-80 w-full rounded-r-2xl rounded-out-lt-3xl rounded-out-lb-3xl border-r-2 bg-bluetang border-atmosphere")} />
</div>
<div className={classnames("w-3/5 flex flex-col justify-center z-2")}>
<div className={classnames("w-3/5 flex flex-col justify-center text-platinum z-2")}>
<div className={classnames("text-4xl pb-8")}>
Quick Access to Your Services
</div>
+14 -12
View File
@@ -18,11 +18,10 @@ const font = Schibsted_Grotesk({ subsets: ['latin'] })
export default function Member() {
return (
<div className="relative w-full h-200">
<div className="relative w-full h-full">
<div className="absolute bottom-0 right-0 flex flex-col justify-end items-end w-full h-full">
<div className="w-full -mb-[2px] flex justify-start">
<div className="w-31 bg-atmosphere border-b-2 border-copper" />
<div className="w-21/24 h-20 border-b-2 border-copper" />
<div className="w-23/24 h-20 border-b-2 border-copper" />
</div>
<div className="w-1/24 h-full flex justify-start">
<div className="w-[calc(50%+6px)] flex flex-col">
@@ -33,9 +32,11 @@ export default function Member() {
</div>
</div>
<div className="w-full h-full flex flex-col justify-start items-center">
<div className="w-21/24">
<div className="w-full">
<div className="h-20 flex justify-between items-center">
<div className={classnames('-ml-[1px] z-1')}>
<div className={classnames('flex items-center')}>
<div className="w-31 h-20 bg-atmosphere" />
<div className="-ml-8.5">
<Image
src="/images/bbstpa-forsite.png"
alt="Britton Logo"
@@ -43,7 +44,8 @@ export default function Member() {
height={60}
/>
</div>
<div className="-mr-[55px] z-1">
</div>
<div className="z-1 pr-20">
<AccountDropdown userRole="member" />
</div>
</div>
@@ -72,7 +74,7 @@ export default function Member() {
Benefits Documents
</a>
</div>
<div className="flex w-21/24 ml-8 pt-4">
<div className="flex w-21/24 2xl:w-11/12 ml-8 pt-5 2xl:pt-7">
<div className="w-full flex flex-col justify-start">
<div className={classnames(
"-mb-[34px] text-4xl text-left z-2 text-bluemana font-semibold text-shadow-[1px_1px_0,-1px_1px_0,-1px_-1px_0,1px_-1px_0] text-shadow-deepcove"
@@ -81,16 +83,16 @@ export default function Member() {
</div>
<div className="flex items-center">
<div className={classnames(
"w-full h-[6px] rounded-s bg-atmosphere z-1 -mr-[20px]"
"w-full h-[6px] rounded-s bg-atmosphere z-1 -mr-[26px] 2xl:-mr-[16px]"
)}>
</div>
<div className="w-1/24 h-full flex justify-end">
<div className="w-[calc(50%+10px)] flex flex-col justify-start z-1 bg-deepcove">
<div className="w-1/21 h-full flex justify-end 2xl:pr-7.5">
<div className="w-[calc(50%+6px)] 2xl:w-[calc(100%-6px)] flex flex-col justify-start z-1 bg-deepcove">
<div className={classnames(
"h-9 -mb-[3px] relative border-b-6 border-r-6 rounded-br-4xl rounded-out-bl-4xl bg-copper border-atmosphere"
"h-9 w-full -mb-[3px] relative border-b-6 border-r-6 rounded-br-4xl rounded-out-bl-4xl bg-copper border-atmosphere"
)} />
<div className={classnames(
"h-9 -mt-[3px] relative border-t-6 border-r-6 rounded-tr-4xl rounded-out-tl-4xl bg-copper border-atmosphere"
"h-9 w-full -mt-[3px] relative border-t-6 border-r-6 rounded-tr-4xl rounded-out-tl-4xl bg-copper border-atmosphere"
)} />
</div>
</div>