From 4435ef97094f65a1c374b2f5f30ff8cf162bafe9 Mon Sep 17 00:00:00 2001 From: Aditya Garg Date: Wed, 11 Oct 2023 16:15:16 +0530 Subject: [PATCH 1/3] added todo list project --- ToDoList/aditya7302/index.html | 13 +++++++++++++ ToDoList/aditya7302/script.js | 0 ToDoList/aditya7302/styles.css | 9 +++++++++ 3 files changed, 22 insertions(+) create mode 100644 ToDoList/aditya7302/index.html create mode 100644 ToDoList/aditya7302/script.js create mode 100644 ToDoList/aditya7302/styles.css diff --git a/ToDoList/aditya7302/index.html b/ToDoList/aditya7302/index.html new file mode 100644 index 000000000..193f750ac --- /dev/null +++ b/ToDoList/aditya7302/index.html @@ -0,0 +1,13 @@ + + + + + + + + Notes-App + + + + + \ No newline at end of file diff --git a/ToDoList/aditya7302/script.js b/ToDoList/aditya7302/script.js new file mode 100644 index 000000000..e69de29bb diff --git a/ToDoList/aditya7302/styles.css b/ToDoList/aditya7302/styles.css new file mode 100644 index 000000000..61c433a35 --- /dev/null +++ b/ToDoList/aditya7302/styles.css @@ -0,0 +1,9 @@ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;600&display=swap'); + +*{ + box-sizing: border-box; +} + +body{ + font-family: 'Poppins', sans-serif; +} \ No newline at end of file From d23cbf69f9d02afc32a75ff3f376c2d6c988ebc6 Mon Sep 17 00:00:00 2001 From: Aditya Garg Date: Wed, 11 Oct 2023 16:21:55 +0530 Subject: [PATCH 2/3] updated index.html syles.css script.js --- ToDoList/aditya7302/index.html | 17 +++++++-- ToDoList/aditya7302/script.js | 34 ++++++++++++++++++ ToDoList/aditya7302/styles.css | 65 +++++++++++++++++++++++++++++++--- 3 files changed, 108 insertions(+), 8 deletions(-) diff --git a/ToDoList/aditya7302/index.html b/ToDoList/aditya7302/index.html index 193f750ac..7ecc9e333 100644 --- a/ToDoList/aditya7302/index.html +++ b/ToDoList/aditya7302/index.html @@ -1,13 +1,24 @@ + + + Document - - Notes-App + - +
+
+ +
    +
+
+
+ + + \ No newline at end of file diff --git a/ToDoList/aditya7302/script.js b/ToDoList/aditya7302/script.js index e69de29bb..d163e87a3 100644 --- a/ToDoList/aditya7302/script.js +++ b/ToDoList/aditya7302/script.js @@ -0,0 +1,34 @@ +const item = document.querySelector("#item") +const toDoBox = document.querySelector("#to-do-box") + +item.addEventListener( + "keyup", + function(event) { + if (event.key == "Enter") { + addToDo(this.value) + this.value = "" + } + } +) + +const addToDo = (item) => { + const listItem = document.createElement("li"); + listItem.innerHTML = ` + ${item} + + `; + + listItem.addEventListener( + "click", + function() { + this.classList.toggle("done"); + } + ) + listItem.querySelector("i").addEventListener( + "click", + function() { + listItem.remove() + } + ) + toDoBox.appendChild(listItem) +} \ No newline at end of file diff --git a/ToDoList/aditya7302/styles.css b/ToDoList/aditya7302/styles.css index 61c433a35..c77f219c4 100644 --- a/ToDoList/aditya7302/styles.css +++ b/ToDoList/aditya7302/styles.css @@ -1,9 +1,64 @@ -@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;600&display=swap'); - -*{ +@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap'); +* { + padding: 0; + margin: 0; box-sizing: border-box; + font-family: 'Open Sans', sans-serif; +} + +main { + width: 100%; + height: 100vh; + display: flex; + justify-content: center; + align-items: center; + background-color: #3498db; +} + +.box { + width: 700px; + min-height: 500px; + background-color: white; + border-radius: 5px; + padding: 15px; +} + +#item { + padding: 10px; + font-size: 20px; + width: 100%; + border: 0; + outline: 0; + display: block; + font-weight: bold; + box-shadow: 0px 0px 2px grey; +} + +#to-do-box { + margin-top: 20px; + list-style: none; +} + +#to-do-box li { + position: relative; + background-color: #2c3e50; + color: white; + padding: 10px; + border-radius: 2px; + padding-right: 30px; + text-align: justify; + margin-top: 10px; + user-select: none; +} + +#to-do-box li i { + position: absolute; + right: 10px; + top: 10px; } -body{ - font-family: 'Poppins', sans-serif; +.done { + text-decoration: line-through; + color: black; + background-color: #95a5a6 !important; } \ No newline at end of file From b9efa4da52a9e6a9695cebd39bf1fed3a1a5d772 Mon Sep 17 00:00:00 2001 From: Aditya Garg Date: Thu, 12 Oct 2023 09:42:30 +0530 Subject: [PATCH 3/3] added persistent storage --- ToDoList/aditya7302/index.html | 105 +++++++++++++++++++++++++++++---- ToDoList/aditya7302/script.js | 34 ----------- ToDoList/aditya7302/styles.css | 64 -------------------- 3 files changed, 93 insertions(+), 110 deletions(-) delete mode 100644 ToDoList/aditya7302/script.js delete mode 100644 ToDoList/aditya7302/styles.css diff --git a/ToDoList/aditya7302/index.html b/ToDoList/aditya7302/index.html index 7ecc9e333..aa3b8e67e 100644 --- a/ToDoList/aditya7302/index.html +++ b/ToDoList/aditya7302/index.html @@ -1,3 +1,5 @@ +copied + @@ -5,20 +7,99 @@ - Document - + Todo App + -
-
- -
    -
-
-
- - +

Todo App

+
+ + +
+ + + + + + + + +
Todo'sDelete
+ - \ No newline at end of file + + diff --git a/ToDoList/aditya7302/script.js b/ToDoList/aditya7302/script.js deleted file mode 100644 index d163e87a3..000000000 --- a/ToDoList/aditya7302/script.js +++ /dev/null @@ -1,34 +0,0 @@ -const item = document.querySelector("#item") -const toDoBox = document.querySelector("#to-do-box") - -item.addEventListener( - "keyup", - function(event) { - if (event.key == "Enter") { - addToDo(this.value) - this.value = "" - } - } -) - -const addToDo = (item) => { - const listItem = document.createElement("li"); - listItem.innerHTML = ` - ${item} - - `; - - listItem.addEventListener( - "click", - function() { - this.classList.toggle("done"); - } - ) - listItem.querySelector("i").addEventListener( - "click", - function() { - listItem.remove() - } - ) - toDoBox.appendChild(listItem) -} \ No newline at end of file diff --git a/ToDoList/aditya7302/styles.css b/ToDoList/aditya7302/styles.css deleted file mode 100644 index c77f219c4..000000000 --- a/ToDoList/aditya7302/styles.css +++ /dev/null @@ -1,64 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap'); -* { - padding: 0; - margin: 0; - box-sizing: border-box; - font-family: 'Open Sans', sans-serif; -} - -main { - width: 100%; - height: 100vh; - display: flex; - justify-content: center; - align-items: center; - background-color: #3498db; -} - -.box { - width: 700px; - min-height: 500px; - background-color: white; - border-radius: 5px; - padding: 15px; -} - -#item { - padding: 10px; - font-size: 20px; - width: 100%; - border: 0; - outline: 0; - display: block; - font-weight: bold; - box-shadow: 0px 0px 2px grey; -} - -#to-do-box { - margin-top: 20px; - list-style: none; -} - -#to-do-box li { - position: relative; - background-color: #2c3e50; - color: white; - padding: 10px; - border-radius: 2px; - padding-right: 30px; - text-align: justify; - margin-top: 10px; - user-select: none; -} - -#to-do-box li i { - position: absolute; - right: 10px; - top: 10px; -} - -.done { - text-decoration: line-through; - color: black; - background-color: #95a5a6 !important; -} \ No newline at end of file