fix(example): add netlify badge

Yazawazi · Sep 22, 2022 · 60d1cc7 · 60d1cc7
1 parent 7ae3ccb
commit 60d1cc7
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 3 deletions.
diff --git a/examples/basic/next.config.js b/examples/basic/next.config.js
@@ -3,7 +3,7 @@ const nextConfig = {
   reactStrictMode: true,
   optimizeFonts: true,
   images: {
-    domains: ['i.imgur.com']
+    domains: ['i.imgur.com', 'www.netlify.com']
   },
   experimental: {
     externalDir: true

diff --git a/examples/basic/pages/index.tsx b/examples/basic/pages/index.tsx
@@ -1,9 +1,10 @@
 import {
+  AppBar,
   FormControl,
   InputLabel,
   MenuItem,
   Select,
-  TextField
+  TextField, Toolbar, Typography
 } from '@mui/material'
 import {
   applyValue,
@@ -103,6 +104,27 @@ const IndexPage: React.FC = () => {
   }, [])
   return (
     <div>
+      <AppBar>
+        <Toolbar>
+          <Typography
+            variant='h6'
+            noWrap
+            component='div'
+            sx={{ flexGrow: 1, display: { xs: 'none', sm: 'block' } }}
+          >
+            JSON viewer
+          </Typography>
+          <a href='https://www.netlify.com' target='_blank' rel='noreferrer'>
+            <Image
+              width={114}
+              height={51}
+              src='https://www.netlify.com/v3/img/components/netlify-color-accent.svg'
+              alt='Deploys by Netlify'
+            />
+          </a>
+        </Toolbar>
+      </AppBar>
+      <Toolbar/>
       <TextField
         label='indentWidth'
         value={indent}
@@ -161,7 +183,8 @@ const IndexPage: React.FC = () => {
             is: (value): value is string => typeof value === 'string' &&
               value.startsWith('https://i.imgur.com'),
             Component: (props) => {
-              return <Image height={50} width={50} src={props.value} alt={props.value}/>
+              return <Image height={50} width={50} src={props.value}
+                            alt={props.value}/>
             }
           }
         ]}