feat: swap heading

louiejakebell · louiejakebell · commit eab3252198da · 2024-09-03T09:40:39.000+01:00
diff --git a/components/PackageFunctionList.tsx b/components/PackageFunctionList.tsx
@@ -1,3 +1,4 @@
+import { Heading } from '@datacamp/waffles/heading';
 import { mediaQuery } from '@datacamp/waffles/helpers';
 import { Input } from '@datacamp/waffles/input';
 import styled from '@emotion/styled';
@@ -19,7 +20,7 @@ type Props = {
   packageVersion: string;
 };
 
-const FlexContainer = styled.div({
+const Flex = styled.div({
   [mediaQuery.aboveMedium]: {
     alignItems: 'center',
     display: 'flex',
@@ -28,11 +29,6 @@ const FlexContainer = styled.div({
   display: 'block',
 });
 
-const Heading = styled.h2({
-  fontSize: '1.5rem',
-  fontWeight: 'bold',
-});
-
 const InputWrapper = styled.div({
   [mediaQuery.aboveMedium]: {
     marginTop: 0,
@@ -75,11 +71,11 @@ export default function PackageFunctionList({
   return (
     <div>
       <CourseAds />
-      <FlexContainer>
+      <Flex>
         <Heading>{`Functions in ${packageName} (${packageVersion})`}</Heading>
         <InputWrapper>
           <label className="sr-only" htmlFor="functionSearch">
-            Search functions
+            Search all functions
           </label>
           <Input
             id="functionSearch"
@@ -89,7 +85,7 @@ export default function PackageFunctionList({
             value={searchInput}
           />
         </InputWrapper>
-      </FlexContainer>
+      </Flex>
       <GridContainer>
         {filteredFunctions.map((fn) => (
           <ClickableCard
