Skip to content

Commit

Permalink
fixed grid system
Browse files Browse the repository at this point in the history
  • Loading branch information
@jeffcheema
jeffcheema committed Dec 7, 2023
1 parent bc48e85 commit a0fb4c8
Show file tree
Hide file tree
Showing 4 changed files with 115 additions and 115 deletions.
4 changes: 2 additions & 2 deletions src/pages/AddDog/AddDog.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,10 +30,10 @@ import AdopterAddressSchema from './Form/FormSchemas/AdopterAddressSchema';
import DogInfoSchema from './Form/FormSchemas/DogInfoSchema';
import NotesSchema from './Form/FormSchemas/NotesSchema';
import FacilityInfoSchema from './Form/FormSchemas/FacilityInfoSchema';

import FinancialInfoSchema from './Form/FormSchemas/FinancialInfoSchema';
import ShowTags from './ShowTags';
import { useForm } from 'react-hook-form';

const AddDog = () => {
const { backend } = useBackend();
const Navigate = useNavigate();
Expand Down Expand Up @@ -128,7 +128,7 @@ const AddDog = () => {
</MenuButton>
<MenuList>
<TagSetup tagBoolean={serviceTag} tagName="Service" setTag={setServiceTag} />
<TagSetup tagBoolean={therapyTag} tagName="Therapy" setTag={setTherapyTag} />
<TagSetup tagBoolean={therapyTag} tagName="Pets" setTag={setTherapyTag} />
<TagSetup tagBoolean={staffAdoptionTag} tagName="Stf Adpt" setTag={setStaffAdoptionTag} />
<TagSetup tagBoolean={specialTag} tagName="Other" setTag={setSpecialTag} />
<TagSetup tagBoolean={deceasedTag} tagName="Decsd" setTag={setDeceasedTag} />
Expand Down
2 changes: 0 additions & 2 deletions src/pages/AddDog/AddDog.yup.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
import * as yup from 'yup';

export default yup.object().shape({
// dogid
// Dog Info Section
dogname: yup.string().required('Dog name is required'),
age: yup.number().required('Age is required'),
breed: yup.string().required('Breed is required'),
Expand Down
222 changes: 112 additions & 110 deletions src/pages/Dogs/AdoptionLogFacilityCards.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,121 +29,123 @@ const AdoptionLogFacilityCards = ({

// const { shelter } = info;
return (
<SimpleGrid columns={[1, 2, null, 3]} spacing={10} mt={10} mb={10}>
{dogs.map(
({
dogid,
dogname,
graddate,
age,
breed,
adoptername,
adoptemail,
adopterphone,
addrline,
adoptcity,
adoptstate,
zip,
image,
...rest
}) => {
const tags = Object.keys(possibleDogTags).filter(tag => rest[tag]);
return (
<Card maxW="md" key={dogid}>
<CardHeader>
<Flex direction="column">
<Flex justifyContent="space-between">
<Flex direction="row" gap={1}>
<Image
boxSize={10}
borderRadius="500px"
src={image || 'http://via.placeholder.com/250x250'}
alt="Segun Adebayo"
/>
<Flex direction="column">
<Text fontWeight="bold" fontSize="md">
{dogname}
</Text>
<Text fontSize="sm" color="gray.500">
Grad Age: {calculateDogAgeAtGraduation(graddate, age)}
</Text>
<Text fontSize="sm" color="gray.500">
Breed: {breed}
</Text>
<Flex justifyContent="center" alignItems="center" width="100%">
<SimpleGrid minChildWidth={225} spacing={3} mt={10} mb={10} width="100%">
{dogs.map(
({
dogid,
dogname,
graddate,
age,
breed,
adoptername,
adoptemail,
adopterphone,
addrline,
adoptcity,
adoptstate,
zip,
image,
...rest
}) => {
const tags = Object.keys(possibleDogTags).filter(tag => rest[tag]);
return (
<Card width={225} key={dogid} marginX="auto">
<CardHeader>
<Flex direction="column">
<Flex justifyContent="space-between">
<Flex direction="row" gap={1}>
<Image
boxSize={10}
borderRadius="500px"
src={image || 'http://via.placeholder.com/250x250'}
alt="Segun Adebayo"
/>
<Flex direction="column">
<Text fontWeight="bold" fontSize="md">
{dogname}
</Text>
<Text fontSize="sm" color="gray.500">
Grad Age: {calculateDogAgeAtGraduation(graddate, age)}
</Text>
<Text fontSize="sm" color="gray.500">
Breed: {breed}
</Text>
</Flex>
</Flex>
<Checkbox
marginBottom="auto"
isChecked={selected.includes(dogid)}
onChange={e => {
e.stopPropagation();
toggleCheck(dogid);
}}
/>
</Flex>
<Checkbox
marginBottom="auto"
isChecked={selected.includes(dogid)}
onChange={e => {
e.stopPropagation();
toggleCheck(dogid);
}}
/>
<SimpleGrid minChildWidth={30} spacing={1}>
{tags.map(tag => (
<Tag
maxW={70}
textAlign="center"
key={tag}
size="sm"
variant="solid"
color="white"
bg={possibleDogTags[tag].color}
>
{possibleDogTags[tag].display}
</Tag>
))}
</SimpleGrid>
</Flex>
<SimpleGrid minChildWidth={30} spacing={1}>
{tags.map(tag => (
<Tag
maxW={70}
textAlign="center"
key={tag}
size="sm"
variant="solid"
color="white"
bg={possibleDogTags[tag].color}
>
{possibleDogTags[tag].display}
</Tag>
))}
</SimpleGrid>
</Flex>
</CardHeader>
<CardBody borderTopWidth={1}>
<VStack spacing={1} align="stretch">
<Stack direction="row">
<Text fontWeight="bold" fontSize="md" textDecoration="underline">
Facility:
</CardHeader>
<CardBody borderTopWidth={1}>
<VStack spacing={1} align="stretch">
<Stack direction="row">
<Text fontWeight="bold" fontSize="md" textDecoration="underline">
Facility:
</Text>
<Text fontSize="md" margin="auto">
{facilityName}
</Text>
</Stack>
<Text fontSize="md" textDecoration="underline">
Adopter
</Text>
<Text fontSize="sm" color="gray.500">
Name: {adoptername}
</Text>
<Text fontSize="sm" color="gray.500">
Email: {adoptemail}
</Text>
<Text fontSize="sm" color="gray.500">
Phone: {adopterphone}
</Text>
<Text fontSize="md" margin="auto">
{facilityName}
<Text fontSize="sm" color="gray.500">
Address: {addrline}, {adoptcity}, {adoptstate} {zip}
</Text>
</Stack>
<Text fontSize="md" textDecoration="underline">
Adopter
</Text>
<Text fontSize="sm" color="gray.500">
Name: {adoptername}
</Text>
<Text fontSize="sm" color="gray.500">
Email: {adoptemail}
</Text>
<Text fontSize="sm" color="gray.500">
Phone: {adopterphone}
</Text>
<Text fontSize="sm" color="gray.500">
Address: {addrline}, {adoptcity}, {adoptstate} {zip}
</Text>
</VStack>
</CardBody>
<CardFooter>
<Button
marginLeft="auto"
size="sm"
onClick={e => {
e.stopPropagation();
Navigate(`/dog/${dogid}`);
}}
bg="#319795"
color="white"
>
View More
</Button>
</CardFooter>
</Card>
);
},
)}
</SimpleGrid>
</VStack>
</CardBody>
<CardFooter>
<Button
marginLeft="auto"
size="sm"
onClick={e => {
e.stopPropagation();
Navigate(`/dog/${dogid}`);
}}
bg="#319795"
color="white"
>
View More
</Button>
</CardFooter>
</Card>
);
},
)}
</SimpleGrid>
</Flex>
);
};

Expand Down
2 changes: 1 addition & 1 deletion src/pages/ViewDog/ViewDog.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -188,7 +188,7 @@ const AddDog = () => {
</MenuButton>
<MenuList>
<TagSetup tagBoolean={serviceTag} tagName="Service" setTag={setServiceTag} />
<TagSetup tagBoolean={therapyTag} tagName="Therapy" setTag={setTherapyTag} />
<TagSetup tagBoolean={therapyTag} tagName="Pets" setTag={setTherapyTag} />
<TagSetup tagBoolean={staffAdoptionTag} tagName="Stf Adpt" setTag={setStaffAdoptionTag} />
<TagSetup tagBoolean={specialTag} tagName="Other" setTag={setSpecialTag} />
<TagSetup tagBoolean={deceasedTag} tagName="Decsd" setTag={setDeceasedTag} />
Expand Down

0 comments on commit a0fb4c8

Please sign in to comment.