Merge pull request #63 from AI4Bharat/v1.0

UI Changes
AI4Bharat · Sep 11, 2024 · 9ab760b · 9ab760b
2 parents d823f87 + 0bf1387
commit 9ab760b
Show file tree

Hide file tree

Showing 5 changed files with 34 additions and 38 deletions.
diff --git a/frontend/components/Dynamic/Area.tsx b/frontend/components/Dynamic/Area.tsx
@@ -116,7 +116,7 @@ export default function AreaComponent({ slug }: { slug: string }) {
                 href={`${imagePrefix}/areas/model/${slug.toUpperCase()}/${latest}`}
               >
                 <Button
-                  rounded={"full"}
+                  borderRadius={10}
                   size={"lg"}
                   fontWeight={"normal"}
                   px={6}

diff --git a/frontend/components/Features.tsx b/frontend/components/Features.tsx
@@ -52,15 +52,16 @@ const Card = ({ heading, description, icon, href }: CardProps) => {
             {description}
           </Text>
         </Box>
-        <Link href={href}>
-          {href !== "" ? (
+
+        {href !== "" ? (
+          <Link href={href}>
             <Button variant={"link"} colorScheme={"orange"}>
               Learn more
             </Button>
-          ) : (
-            <Text textColor={"a4borange"}>Coming Soon</Text>
-          )}
-        </Link>
+          </Link>
+        ) : (
+          <Text textColor={"a4borange"}>Coming Soon</Text>
+        )}
       </Stack>
     </Box>
   );
@@ -69,12 +70,17 @@ const Card = ({ heading, description, icon, href }: CardProps) => {
 export default function Features() {
   return (
     <Container maxW={"7xl"}>
-      <Stack
-        align={"center"}
-        spacing={{ base: 4, md: 5 }}
-        py={{ base: 10, md: 14 }}
-        direction={{ base: "column", md: "row" }}
-      >
+      <Stack spacing={{ base: 4, md: 5 }} py={{ base: 10, md: 14 }}>
+        <Stack spacing={4}>
+          <Heading
+            fontSize={{ base: "3xl", sm: "4xl", lg: "6xl" }}
+            fontWeight={"bold"}
+          >
+            <Text textColor={"a4borange"}>Cutting-edge work</Text>
+            <Text textColor={"a4bred"}>across areas.</Text>
+          </Heading>
+        </Stack>
+        <br />
         <SimpleGrid>
           <Flex flexWrap="wrap" gridGap={6} justify="center">
             <Card
@@ -153,7 +159,7 @@ export default function Features() {
               href={`${imagePrefix}/areas/tts`}
             />
             <Card
-              heading={"OCR"}
+              heading={"Optical Character Recognition"}
               icon={
                 <Image
                   src={`${imagePrefix}/assets/icons/ocr.png`}
@@ -169,15 +175,6 @@ export default function Features() {
             />
           </Flex>
         </SimpleGrid>
-        <Stack spacing={4} textAlign={"center"}>
-          <Heading
-            fontSize={{ base: "3xl", sm: "4xl", lg: "6xl" }}
-            fontWeight={"bold"}
-          >
-            <Text textColor={"a4borange"}>Cutting-edge work</Text>
-            <Text textColor={"a4bred"}>across areas.</Text>
-          </Heading>
-        </Stack>
       </Stack>
     </Container>
     // <Box p={4}>

diff --git a/frontend/components/Hero.tsx b/frontend/components/Hero.tsx
@@ -64,7 +64,7 @@ export default function Hero() {
             <Button
               as="a"
               href={`${imagePrefix}/areas/xlit`}
-              rounded={"full"}
+              borderRadius={10}
               size={"lg"}
               fontWeight={"normal"}
               px={6}
@@ -77,7 +77,7 @@ export default function Hero() {
             <Button
               as="a"
               href={`${imagePrefix}/areas/nmt`}
-              rounded={"full"}
+              borderRadius={10}
               size={"lg"}
               fontWeight={"normal"}
               px={6}
@@ -90,7 +90,7 @@ export default function Hero() {
             <Button
               as="a"
               href={`${imagePrefix}/areas/asr`}
-              rounded={"full"}
+              borderRadius={10}
               size={"lg"}
               fontWeight={"normal"}
               px={6}
@@ -103,7 +103,7 @@ export default function Hero() {
             <Button
               as="a"
               href={`${imagePrefix}/areas/tts`}
-              rounded={"full"}
+              borderRadius={10}
               size={"lg"}
               fontWeight={"normal"}
               px={6}
@@ -116,7 +116,7 @@ export default function Hero() {
             <Button
               as="a"
               href={`${imagePrefix}/areas/llm`}
-              rounded={"full"}
+              borderRadius={10}
               size={"lg"}
               fontWeight={"normal"}
               px={6}

diff --git a/frontend/components/People.tsx b/frontend/components/People.tsx
@@ -110,13 +110,12 @@ const Card = ({ first_name, last_name, role, gradYear, photo }: CardProps) => {
             borderRadius="full"
             objectFit="cover"
             boxSize="150px"
-            bgColor={"a4borange"}
             alt="Profile Photo"
           />
         ) : (
           <></>
         )}
-        <Box mt={2}>
+        <Box justifyItems={"center"} mt={2}>
           <Heading size="md">{first_name + " " + last_name}</Heading>
           <Text mt={1} fontSize={"sm"}>
             {role}

diff --git a/frontend/components/Sponsors.tsx b/frontend/components/Sponsors.tsx
@@ -24,50 +24,50 @@ export default function Sponsors() {
       </Stack>
 
       <Box mt={12}>
-        <Wrap justify={"center"} gap={10}>
-          <Card w={200} h={75}>
+        <Wrap justify={"center"} spacing={50}>
+          <Card shadow={"none"} w={200} h={75}>
             <Image
               src={`${imagePrefix}/assets/logos/meity.svg`}
               alt="LLM"
               fill={true}
             />
           </Card>
-          <Card w={200} h={75}>
+          <Card shadow={"none"} w={200} h={75}>
             <Image
               src={`${imagePrefix}/assets/logos/nilekani.png`}
               alt="LLM"
               fill={true}
             />
           </Card>
-          <Card w={200} h={75}>
+          <Card shadow={"none"} w={200} h={75}>
             <Image
               src={`${imagePrefix}/assets/logos/ekstep.png`}
               alt="LLM"
               fill={true}
             />
           </Card>
-          <Card w={200} h={75}>
+          <Card shadow={"none"} w={200} h={75}>
             <Image
               src={`${imagePrefix}/assets/logos/C-DAC.png`}
               alt="LLM"
               fill={true}
             />
           </Card>
-          <Card w={200} h={75}>
+          <Card shadow={"none"} w={200} h={75}>
             <Image
               src={`${imagePrefix}/assets/logos/microsoft.png`}
               alt="LLM"
               fill={true}
             />
           </Card>
-          <Card w={200} h={75}>
+          <Card shadow={"none"} w={200} h={75}>
             <Image
               src={`${imagePrefix}/assets/logos/google.png`}
               alt="LLM"
               fill={true}
             />
           </Card>
-          <Card w={200} h={75}>
+          <Card shadow={"none"} w={200} h={75}>
             <Image
               src={`${imagePrefix}/assets/logos/yotta.png`}
               alt="LLM"