chore: use legacy image component for now

Author: ascorbic

demos/default/pages/broken-image.tsx

@@ -1,4 +1,4 @@
-import Image from 'next/image'
+import Image from 'next/legacy/image'
 
 // This should cause an error, because broken-domain is not part of the configured next.config.js image domains
 const Images = () => (

demos/default/pages/image.js

@@ -1,4 +1,4 @@
-import Image from 'next/image'
+import Image from 'next/legacy/image'
 import img from './unsplash.jpg'
 import logo from './logomark.svg'
 

demos/static-root/pages/index.js

@@ -1,5 +1,5 @@
 import Head from 'next/head'
-import Image from 'next/image'
+import Image from 'next/legacy/image'
 import { useRouter } from 'next/router'
 import styles from '../styles/Home.module.css'
 
@@ -21,8 +21,7 @@ export default function Home() {
         <p>The current locale is {locale}</p>
 
         <p className={styles.description}>
-          Get started by editing{' '}
-          <code className={styles.code}>pages/index.js</code>
+          Get started by editing <code className={styles.code}>pages/index.js</code>
         </p>
 
         <div className={styles.grid}>
@@ -36,17 +35,12 @@ export default function Home() {
             <p>Learn about Next.js in an interactive course with quizzes!</p>
           </a>
 
-          <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
-            className={styles.card}
-          >
+          <a href="https://github.com/vercel/next.js/tree/master/examples" className={styles.card}>
             <h2>Examples &rarr;</h2>
             <p>Discover and deploy boilerplate example Next.js projects.</p>
           </a>
         </div>
       </main>
-
-
     </div>
   )
 }