[showcase][s]-link page from homepage (#4)

pages/@myorg/myDataset.tsx

@@ -45,7 +45,7 @@ export default function Showcase() {
           <a href="#data-cli" className="border border-black text-black py-4 px-4 rounded-sm">Developers</a>
         </div>
         <div className="my-16">
-          <h2 className="text-3xl" id="data">Data Files</h2>
+          <h2 className="text-3xl pb-2" id="data">Data Files</h2>
           <p>Download files in this dataset</p>
           <table className="table-auto">
             <thead>
@@ -57,7 +57,7 @@ export default function Showcase() {
             </thead>
             <tbody>
               <tr className="bg-gray-100 text-sm">
-                <td className="pr-10 py-4">
+                <td className="pr-10 py-4 text-orange-500">
                   <i className="far fa-file-alt"></i> <a href="#" className="anchor-link">Dataset Metadata</a>
                 </td>
                 <td className="px-10 py-4">
@@ -68,14 +68,14 @@ export default function Showcase() {
                 <td className="px-10 py-4" title="{{ item.resource.modified }}">
                   Invalid Date
                 </td>
-                <td className="download truncate px-10 py-4">
+                <td className="px-10 py-4 text-orange-500">
                   <a href="#">
                     Text
                   </a>
                 </td>
               </tr>
               <tr className="text-sm">
-                <td className="pr-10 py-4">
+                <td className="pr-10 py-4 text-orange-500">
                   <i className="far fa-file-alt"></i> <a href="#" className="anchor-link">Dataset Metadata</a>
                 </td>
                 <td className="px-10 py-4">
@@ -86,27 +86,27 @@ export default function Showcase() {
                 <td className="px-10 py-4" title="{{ item.resource.modified }}">
                   Invalid Date
                 </td>
-                <td className="px-10 py-4">
+                <td className="px-10 py-4 text-orange-500">
                   <a href="#">
-                    Text
+                    Xls
                   </a>
                 </td>
               </tr>
               <tr className="bg-gray-100 text-sm">
-                <td className="pr-10 py-4">
+                <td className="pr-10 py-4 text-orange-500">
                   <i className="far fa-file-alt"></i> <a href="#" className="anchor-link">Dataset Metadata</a>
                 </td>
                 <td className="px-10 py-4">
                   Dataset's Metadata
                 </td>
-                <td className="px-10 py-4" title="{{ item.resource.sizeFormatted }}">
+                <td className="px-10 py-4">
                 </td>
-                <td className="px-10 py-4" title="{{ item.resource.modified }}">
+                <td className="px-10 py-4">
                   Invalid Date
                 </td>
-                <td className="download truncate px-10 py-4">
+                <td className="px-10 py-4 text-orange-500">
                   <a href="#">
-                    Text
+                    Data File
                   </a>
                 </td>
               </tr>
@@ -114,33 +114,6 @@ export default function Showcase() {
           </table>
         </div>
       </div>
-      <style jsx>{` 
-        .logo {
-          height: 1em;
-        }
-
-        @media (max-width: 600px) {
-          .grid {
-            width: 100%;
-            flex-direction: column;
-          }
-        }
-      `}</style>
-
-      <style jsx global>{`
-        html,
-        body {
-          padding: 0;
-          margin: 0;
-          font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
-            Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue,
-            sans-serif;
-        }
-
-        * {
-          box-sizing: border-box;
-        }
-      `}</style>
     </div>
   )
 }

pages/index.tsx

@@ -2,7 +2,7 @@ import Head from 'next/head'
 
 export default function Home() {
   return (
-    <div className="container">
+    <div className="container mx-auto">
       <Head>
         <title>Create Next App</title>
         <link rel="icon" href="/favicon.ico" />
@@ -18,22 +18,9 @@ export default function Home() {
         </p>
 
         <div className="grid">
-          <a href="https://nextjs.org/docs" className="card">
+          <a href="/@myorg/myDataset" className="card">
-            <h3>Documentation &rarr;</h3>
+            <h3>Showcase &rarr;</h3>
-            <p>Find in-depth information about Next.js features and API.</p>
+            <p>Find Mocked Data Page of frontend v3 Project.</p>
-          </a>
-
-          <a href="https://nextjs.org/learn" className="card">
-            <h3>Learn &rarr;</h3>
-            <p>Learn about Next.js in an interactive course with quizzes!</p>
-          </a>
-
-          <a
-            href="https://github.com/zeit/next.js/tree/master/examples"
-            className="card"
-          >
-            <h3>Examples &rarr;</h3>
-            <p>Discover and deploy boilerplate example Next.js projects.</p>
           </a>
 
           <a
@@ -129,15 +116,6 @@ export default function Home() {
           font-size: 1.5rem;
         }
         
-        code {
-          background: #fafafa;
-          border-radius: 5px;
-          padding: 0.75rem;
-          font-size: 1.1rem;
-          font-family: Menlo, Monaco, Lucida Console, Liberation Mono,
-            DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
-        }
-
         .grid {
           display: flex;
           align-items: center;