Merge pull request #474 from StampyAI/stampy-redesign-419-QA

QA requests
StampyAI · Mar 14, 2024 · b2fef5c · b2fef5c
2 parents 21c213b + d2a83c0
commit b2fef5c
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/app/components/CategoriesNav/Menu.tsx b/app/components/CategoriesNav/Menu.tsx
@@ -4,6 +4,7 @@ import {SearchInput} from '../SearchInput/Input'
 import {Tag as TagType} from '~/server-utils/stampy'
 import {tagUrl} from '~/routesMapper'
 import './menu.css'
+import useIsMobile from '~/hooks/isMobile'
 
 interface CategoriesNavProps {
   /**
@@ -22,9 +23,10 @@ interface CategoriesNavProps {
 
 export const CategoriesNav = ({categories, activeCategoryId, className}: CategoriesNavProps) => {
   const [search, onSearch] = useState('')
+  const mobile = useIsMobile()
   return (
     <div className={['categoriesGroup bordered col-4-5', className].join(' ')}>
-      <h4>Categories</h4>
+      {mobile ? <h1>Categories</h1> : <p className={'small-bold'}>Categories</p>}
       <div>
         <SearchInput onChange={onSearch} placeholderText="Filter by keyword" />
       </div>

diff --git a/app/components/CategoriesNav/menu.css b/app/components/CategoriesNav/menu.css
@@ -30,6 +30,7 @@
   .categoriesGroup {
     width: 100%;
     height: 100%;
+    padding: 0px;
   }
   .categoriesGroup.bordered {
     border: 0;
@@ -38,4 +39,7 @@
   .categoryTitle.selected {
     background: inherit;
   }
+  .categoriesGroup > * {
+    padding: var(--spacing-16) var(--spacing-8);
+  }
 }