diff --git a/app/favicon.ico b/app/favicon.ico deleted file mode 100644 index 718d6fe..0000000 Binary files a/app/favicon.ico and /dev/null differ diff --git a/app/globals.css b/app/globals.css index fd81e88..bd6213e 100644 --- a/app/globals.css +++ b/app/globals.css @@ -1,27 +1,3 @@ @tailwind base; @tailwind components; -@tailwind utilities; - -:root { - --foreground-rgb: 0, 0, 0; - --background-start-rgb: 214, 219, 220; - --background-end-rgb: 255, 255, 255; -} - -@media (prefers-color-scheme: dark) { - :root { - --foreground-rgb: 255, 255, 255; - --background-start-rgb: 0, 0, 0; - --background-end-rgb: 0, 0, 0; - } -} - -body { - color: rgb(var(--foreground-rgb)); - background: linear-gradient( - to bottom, - transparent, - rgb(var(--background-end-rgb)) - ) - rgb(var(--background-start-rgb)); -} +@tailwind utilities; \ No newline at end of file diff --git a/app/layout.js b/app/layout.js index c93f806..4b51f80 100644 --- a/app/layout.js +++ b/app/layout.js @@ -1,17 +1,9 @@ import './globals.css' -import { Inter } from 'next/font/google' - -const inter = Inter({ subsets: ['latin'] }) - -export const metadata = { - title: 'Create Next App', - description: 'Generated by create next app', -} export default function RootLayout({ children }) { return ( - {children} + {children} ) } diff --git a/app/page.js b/app/page.js index 801ec13..75e86d3 100644 --- a/app/page.js +++ b/app/page.js @@ -1,113 +1,84 @@ -import Image from 'next/image' +"use client"; +import React, { useState } from "react"; -export default function Home() { - return ( -
-
-

- Get started by editing  - app/page.js -

-
- - By{' '} - Vercel Logo - -
-
- -
- Next.js Logo -
+const page = () => { + const [title, setTitle] = useState(""); + const [desc, setDesc] = useState(""); + const [mainTask, setMainTask] = useState([]); -
- -

- Docs{' '} - - -> - -

-

- Find in-depth information about Next.js features and API. -

- + // submiting the form + const submitHandler = (e) => { + e.preventDefault(); // prevent the form from submitting + setMainTask([...mainTask, { title, desc }]); + console.log(mainTask); + setTitle(""); + setDesc(""); + }; - -

- Learn{' '} - - -> - -

-

- Learn about Next.js in an interactive course with quizzes! -

- + // delete the task + const deleteHandler = (i) => { + let copyTask = [...mainTask]; + copyTask.splice(i, 1); + setMainTask(copyTask); + }; - -

- Templates{' '} - - -> - -

-

- Explore the Next.js 13 playground. -

- + // displaying the task + let renderTask =

No task available

; + if (mainTask.length > 0) { + renderTask = mainTask.map((t, i) => { + return ( +
  • +
    +
    {t.title}
    +
    {t.desc}
    + +
    +
    • + ); + }); + } - -

    - Deploy{' '} - - -> - -

    -

    - Instantly deploy your Next.js site to a shareable URL with Vercel. -

    -     + return ( + <> +

    + Edson's Todo List +

    +
    + { + setTitle(e.target.value); + }} + /> + { + setDesc(e.target.value); + }} + /> + +
    +
    +
    +
      {renderTask}
    -
    - ) -} + + ); +}; + +export default page;