Britton/next-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

some responsive changes

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files
src/components/InfoCard.tsx
+1 -1
View File
@@ -47,7 +47,7 @@ const InfoCard: React.FC<InfoCardProps> = (
})}> })}>
<div className={classnames({ <div className={classnames({
"hidden" : !invert, "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("flex flex-col w-7/12")}>
<div className={classnames( <div className={classnames(
src/components/LandingPage.tsx
+1 -11
View File
@@ -26,18 +26,8 @@ const LandingPage: React.FC<LandingPageProps> = ({
<div className={classnames( <div className={classnames(
"relative h-full border-l-6 rounded-out-br-4xl bg-bluetang border-atmosphere" "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> </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>
<div className="w-full flex justify-start items-end pt-30"> <div className="w-full flex justify-start items-end pt-30">
<div className="w-1/24 h-full flex justify-end"> <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="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 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>
<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")}> <div className={classnames("text-4xl pb-8")}>
Quick Access to Your Services Quick Access to Your Services
</div> </div>
src/pages/dashboard/member/index.tsx
+14 -12
View File
@@ -18,11 +18,10 @@ const font = Schibsted_Grotesk({ subsets: ['latin'] })
export default function Member() { export default function Member() {
return ( 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="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-full -mb-[2px] flex justify-start">
<div className="w-31 bg-atmosphere border-b-2 border-copper" /> <div className="w-23/24 h-20 border-b-2 border-copper" />
<div className="w-21/24 h-20 border-b-2 border-copper" />
</div> </div>
<div className="w-1/24 h-full flex justify-start"> <div className="w-1/24 h-full flex justify-start">
<div className="w-[calc(50%+6px)] flex flex-col"> <div className="w-[calc(50%+6px)] flex flex-col">
@@ -33,9 +32,11 @@ export default function Member() {
</div> </div>
</div> </div>
<div className="w-full h-full flex flex-col justify-start items-center"> <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="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 <Image
src="/images/bbstpa-forsite.png" src="/images/bbstpa-forsite.png"
alt="Britton Logo" alt="Britton Logo"
@@ -43,7 +44,8 @@ export default function Member() {
height={60} height={60}
/> />
</div> </div>
<div className="-mr-[55px] z-1"> </div>
<div className="z-1 pr-20">
<AccountDropdown userRole="member" /> <AccountDropdown userRole="member" />
</div> </div>
</div> </div>
@@ -72,7 +74,7 @@ export default function Member() {
Benefits Documents Benefits Documents
</a> </a>
</div> </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="w-full flex flex-col justify-start">
<div className={classnames( <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" "-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>
<div className="flex items-center"> <div className="flex items-center">
<div className={classnames( <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>
<div className="w-1/24 h-full flex justify-end"> <div className="w-1/21 h-full flex justify-end 2xl:pr-7.5">
<div className="w-[calc(50%+10px)] flex flex-col justify-start z-1 bg-deepcove"> <div className="w-[calc(50%+6px)] 2xl:w-[calc(100%-6px)] flex flex-col justify-start z-1 bg-deepcove">
<div className={classnames( <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( <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>
</div> </div>