more fixes

ckwilde · ckwilde · commit 566d5c5b40c2 · 2023-08-08T18:09:10.000+01:00
diff --git a/src/app/dash/layout.tsx b/src/app/dash/layout.tsx
@@ -53,7 +53,6 @@ export default function RootLayout({children}: Props) {
       <StyleSheet/>
     </head>
     <body className={inter.className}>
-    <Common.Navbar />
     <Container>
       <Dash.Sidebar />
       <Common.Box css={{
diff --git a/src/components/common/SearchDocumentation.tsx b/src/components/common/SearchDocumentation.tsx
@@ -8,6 +8,7 @@ import * as Form from '@/components/common/form';
 const SearchWrap = styled('div', {
   position: 'relative',
   flexGrow: 1,
+  margin: '0 16px',
 
   '@media (max-width: 512px)': {
     width: '100%',
@@ -17,16 +18,18 @@ const SearchWrap = styled('div', {
 const SearchResults = styled('div', {
   position: 'absolute',
   top: '49px',
-  left: '16px',
   borderBottomLeftRadius: theme.radii.medium,
   borderBottomRightRadius: theme.radii.medium,
   background: theme.colors.neutral100,
   border: '1px solid',
   borderColor: theme.colors.neutral300,
-  maxWidth: '512px',
-  width: '100vw',
+  width: '100%',
   borderTopColor: theme.colors.neutral500,
 
+  '@media (min-width: 600px)': {
+    maxWidth: '512px',
+  },
+
   '& > a': {
     display: 'flex',
     justifyContent: 'space-between',
@@ -60,9 +63,9 @@ export function SearchDocumentation() {
     <SearchWrap>
       {display &&
           <SearchResults>
-              <Link href='/'>How to do x cool thing with Hookla</Link>
-              <Link href='/'>How to do x cool thing with Hookla</Link>
-              <Link href='/'>How to do x cool thing with Hookla</Link>
+              <Link href='/'>Result</Link>
+              <Link href='/'>Result</Link>
+              <Link href='/'>Result</Link>
           </SearchResults>
       }
       <Form.Search placeholder='Search documentation' type='search' onFocus={() => setDisplay(true)} onBlur={() => setDisplay(false)} />
diff --git a/src/components/common/form/Search.tsx b/src/components/common/form/Search.tsx
@@ -7,19 +7,22 @@ export const Search = styled(Input, {
   textOverflow: 'ellipsis',
   fontSize: theme.fontSizes.xsmall,
   borderColor: theme.colors.neutral500,
-  margin: '0 auto 0 16px',
   backgroundImage: 'url(/search.svg)',
   backgroundRepeat: 'no-repeat',
   backgroundPosition: '16px center',
   paddingLeft: '40px',
-  maxWidth: '156px',
   width: '100%',
 
+  '&:focus': {
+    borderBottomLeftRadius: 0,
+    borderBottomRightRadius: 0,
+  },
+
   '@media (min-width: 600px)': {
+    maxWidth: '156px',
+
     '&:focus': {
       maxWidth: '512px !important',
-      borderBottomLeftRadius: 0,
-      borderBottomRightRadius: 0,
     },
   },
 
