feat(subject listing page): change grey color and remove breadcrumbs …

…and add middle size max-width
oaknational · Dec 1, 2022 · 75e7a1e · 75e7a1e
1 parent 7e3de7c
commit 75e7a1e
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 21 deletions.
diff --git a/src/components/Card/SubjectCardLink.tsx b/src/components/Card/SubjectCardLink.tsx
@@ -58,11 +58,11 @@ const SummaryAvailable: FC<SummaryAvailableProps> = ({
       </Heading>
       <Typography
         $font={"body-2"}
-        $color={"grey4"}
+        $color={"oakGrey4"}
       >{`${totalUnits} units`}</Typography>
       <Typography
         $font={"body-2"}
-        $color={"grey4"}
+        $color={"oakGrey4"}
       >{`${totalLessons} lessons`}</Typography>
     </>
   );

diff --git a/src/components/pages/SubjectListing/index.tsx b/src/components/pages/SubjectListing/index.tsx
@@ -33,7 +33,7 @@ const SubjectListingPage: FC<SubjectListingProps> = (props) => {
   const { subjectListData, unavailableSubjectListData } = props.keyStageData;
   return (
     <Flex $flexDirection={"column"}>
-      <MaxWidth $ph={[12]}>
+      <MaxWidth $ph={[12]} $maxWidth={[480, 840, 1280]}>
         <Flex $pv={20}>
           <Typography $font={"body-2"}>
             {subjectListData.length} subjects

diff --git a/src/pages/beta/key-stages/[keyStageSlug].tsx b/src/pages/beta/key-stages/[keyStageSlug].tsx
@@ -18,8 +18,6 @@ import {
 import { SubjectCardLinkProps } from "../../../components/Card/SubjectCardLink";
 import SubjectListingPage from "../../../components/pages/SubjectListing";
 import MaxWidth from "../../../components/MaxWidth/MaxWidth";
-import Breadcrumbs from "../../../components/Breadcrumbs";
-import Flex from "../../../components/Flex";
 
 export type KeyStageProps = {
   keyStageData: {
@@ -38,23 +36,8 @@ const KeyStageListPage: NextPage<KeyStageProps> = (props) => {
       })}
       $background="white"
     >
-      <MaxWidth>
-        <Flex $pv={48}>
-          {" "}
-          <Breadcrumbs
-            breadcrumbs={[
-              { href: "/beta/teachers", label: "Home" },
-              {
-                href: `/beta/key-stages/${props.keyStageData.url}`,
-                label: `${props.keyStageData.url?.split("-").join(" ")}`,
-              },
-            ]}
-          />
-        </Flex>
-      </MaxWidth>
-
       {props.keyStageData.url && (
-        <MaxWidth $ph={[0, 12]}>
+        <MaxWidth $ph={12} $pt={48} $maxWidth={[480, 840, 1280]}>
           <Heading tag={"h1"} $font={"heading-4"}>
             Key stage{" "}
             {props.keyStageData.url[props.keyStageData.url.length - 1]}