Skip to content

Commit

Permalink
style: added responsive support
Browse files Browse the repository at this point in the history
  • Loading branch information
@xgovernor
xgovernor committed Jan 18, 2024
1 parent a0aed30 commit dbb9dbd
Show file tree
Hide file tree
Showing 12 changed files with 30 additions and 69 deletions.
49 changes: 5 additions & 44 deletions src/app/blood-requests/new/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,57 +26,18 @@ const PageNewBloodRequest: React.FC = () => {
title="Add new request"
icon={<PeopleAdd24Regular />}
>
<section
style={{
width: "100%",
height: "100%",
padding: "22px",
display: "flex",
flexDirection: "row",
flexWrap: "nowrap",
alignItems: "start",
justifyContent: "start",
}}
>
<div
style={{
width: "100%",
height: "100%",
}}
>
<div
style={{
width: "100%",
maxWidth: "100%",
height: "100%",
paddingRight: "22px",
}}
>
<section className="flex h-full w-full flex-row max-md:flex-wrap flex-nowrap items-start justify-start p-[22px]">
<div className="h-full w-full">
<div className="h-full w-full max-w-full md:pe-[22px]">
{/* Alerts Area */}
<div
style={{
width: "100%",
height: "100%",
}}
>
<div className="h-full w-full">
{/* <Alert title="New member added" /> */}
</div>

<BloodRequestForm />
</div>
</div>
<div
style={{
width: "100%",
maxWidth: "289px",
height: "100%",
display: "flex",
flexDirection: "column",
flexWrap: "nowrap",
alignItems: "start",
justifyContent: "start",
}}
></div>
<div className="flex h-full w-full max-w-[289px] flex-col flex-nowrap items-start justify-start"></div>
</section>
</Layout>
);
Expand Down
4 changes: 2 additions & 2 deletions src/app/clubs/new/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,9 @@ const PageNewMember: React.FC = () => {
title="Add new club"
icon={<PeopleTeam24Regular />}
>
<section className="flex h-full w-full flex-row flex-nowrap items-start justify-start p-[22px]">
<section className="flex h-full w-full flex-row max-md:flex-wrap flex-nowrap items-start justify-start p-[22px]">
<div className="h-full w-full">
<div className="h-full w-full max-w-full pe-[22px]">
<div className="h-full w-full max-w-full md:pe-[22px]">
<ClubForm />
</div>
</div>
Expand Down
6 changes: 3 additions & 3 deletions src/app/contacts/new/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,12 +22,12 @@ const PageNewContact: React.FC = () => {
return (
<Layout
breadcrumb={BREADCRUMB_MENU}
title="Add new club"
title="Add new contact"
icon={<PeopleTeam24Regular />}
>
<section className="flex h-full w-full flex-row flex-nowrap items-start justify-start p-[22px]">
<section className="flex h-full w-full flex-row max-md:flex-wrap flex-nowrap items-start justify-start p-[22px]">
<div className="h-full w-full">
<div className="h-full w-full max-w-full pe-[22px]">
<div className="h-full w-full max-w-full md:pe-[22px]">
<NewContactForm />
</div>
</div>
Expand Down
6 changes: 3 additions & 3 deletions src/app/donations/new/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,12 @@ const PageNewMember: React.FC = () => {
return (
<Layout
breadcrumb={BREADCRUMB_MENU}
title="Add new request"
title="Add new donation"
icon={<PeopleAdd24Regular />}
>
<section className="flex h-full w-full flex-row flex-nowrap items-start justify-start p-[22px]">
<section className="flex h-full w-full flex-row max-md:flex-wrap flex-nowrap items-start justify-start p-[22px]">
<div className="h-full w-full">
<div className="h-full w-full max-w-full pe-[22px]">
<div className="h-full w-full max-w-full md:pe-[22px]">
{/* Alerts Area */}
<div className="h-full w-full">
{/* <Alert title="New member added" /> */}
Expand Down
4 changes: 2 additions & 2 deletions src/app/members/new/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,9 +26,9 @@ const PageNewMember: React.FC = () => {
title="Add new request"
icon={<PeopleAdd24Regular />}
>
<section className="flex h-full w-full flex-row flex-nowrap items-start justify-start p-[22px]">
<section className="flex h-full w-full flex-row max-md:flex-wrap flex-nowrap items-start justify-start p-[22px]">
<div className="h-full w-full">
<div className="h-full w-full max-w-full pe-[22px]">
<div className="h-full w-full max-w-full md:pe-[22px]">
{/* Alerts Area */}
<div className="h-full w-full">
{/* <Alert title="New member added" /> */}
Expand Down
6 changes: 3 additions & 3 deletions src/app/team/new/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,12 +22,12 @@ const PageNewMember: React.FC = () => {
return (
<Layout
breadcrumb={BREADCRUMB_MENU}
title="Add new club"
title="Add new team member"
icon={<PeopleTeam24Regular />}
>
<section className="flex h-full w-full flex-row flex-nowrap items-start justify-start p-[22px]">
<section className="flex h-full w-full flex-row max-md:flex-wrap flex-nowrap items-start justify-start p-[22px]">
<div className="h-full w-full">
<div className="h-full w-full max-w-full pe-[22px]">
<div className="h-full w-full max-w-full md:pe-[22px]">
<TeamMemberForm />
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions src/components/blood-request/BloodRequestForm/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,8 +46,8 @@ interface TRequestForm {
}

const FORM: TFormBuilderForm = {
sectionClassName: "w-full grid grid-cols-2 gap-x-[3.25rem] gap-y-3",
fieldClassName: "flex flex-row items-start justify-between gap-4 w-full",
sectionClassName: "w-full grid max-md:grid-cols-1 grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex max-md:flex-col max-md:gap-1 flex-row items-start justify-between gap-4 w-full",
labelClassName:
"w-full max-w-[150px] min-w-[125px] text-[13px] leading-[32px] font-medium",
inputClassName: "w-full",
Expand Down
4 changes: 2 additions & 2 deletions src/components/clubs/ClubForm/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,8 +93,8 @@ const useStyles = makeStyles({
});

const FORM: TFormBuilderForm = {
sectionClassName: "w-full grid grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex flex-row items-start justify-between gap-4 w-full",
sectionClassName: "w-full grid max-md:grid-cols-1 grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex max-md:flex-col max-md:gap-1 flex-row items-start justify-between gap-4 w-full",
labelClassName:
"w-full max-w-[150px] min-w-[125px] text-[13px] leading-[32px] font-medium",
inputClassName: "w-full",
Expand Down
4 changes: 2 additions & 2 deletions src/components/contacts/NewContactForm/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,8 +94,8 @@ const useStyles = makeStyles({
});

const FORM: TFormBuilderForm = {
sectionClassName: "w-full grid grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex flex-row items-start justify-between gap-4 w-full",
sectionClassName: "w-full grid max-md:grid-cols-1 grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex max-md:flex-col max-md:gap-1 flex-row items-start justify-between gap-4 w-full",
labelClassName:
"w-full max-w-[150px] min-w-[125px] text-[13px] leading-[32px] font-medium",
inputClassName: "w-full",
Expand Down
4 changes: 2 additions & 2 deletions src/components/donations/DonationForm/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,8 +103,8 @@ const useStyles = makeStyles({
});

const FORM: TFormBuilderForm = {
sectionClassName: "w-full grid grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex flex-row items-start justify-between gap-4 w-full",
sectionClassName: "w-full grid max-md:grid-cols-1 grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex max-md:flex-col max-md:gap-1 flex-row items-start justify-between gap-4 w-full",
labelClassName:
"w-full max-w-[150px] min-w-[125px] text-[13px] leading-[32px] font-medium",
inputClassName: "w-full",
Expand Down
4 changes: 2 additions & 2 deletions src/components/members/MemberForm/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,8 +103,8 @@ const useStyles = makeStyles({
});

const FORM: TFormBuilderForm = {
sectionClassName: "w-full grid grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex flex-row items-start justify-between gap-4 w-full",
sectionClassName: "w-full grid max-md:grid-cols-1 grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex max-md:flex-col max-md:gap-1 flex-row items-start justify-between gap-4 w-full",
labelClassName:
"w-full max-w-[150px] min-w-[125px] text-[13px] leading-[32px] font-medium",
inputClassName: "w-full",
Expand Down
4 changes: 2 additions & 2 deletions src/components/team/TeamMemberForm/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -71,8 +71,8 @@ const useStyles = makeStyles({
});

const FORM: TFormBuilderForm = {
sectionClassName: "w-full grid grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex flex-row items-start justify-between gap-4 w-full",
sectionClassName: "w-full grid max-md:grid-cols-1 grid-cols-2 gap-x-13 gap-y-3",
fieldClassName: "flex max-md:flex-col max-md:gap-1 flex-row items-start justify-between gap-4 w-full",
labelClassName:
"w-full max-w-[150px] min-w-[125px] text-[13px] leading-[32px] font-medium",
inputClassName: "w-full",
Expand Down

1 comment on commit dbb9dbd

@vercel
Copy link

@vercel vercel bot commented on dbb9dbd Jan 18, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

simbio-experimental – ./

simbio-experimental-abuthermuhammad.vercel.app
simbio-experimental.vercel.app
simbio-experimental-git-main-abuthermuhammad.vercel.app
simbio.dot9.dev

Please sign in to comment.