From 473599b95d77a1fbee00647e6fc5a03faab3d2ba Mon Sep 17 00:00:00 2001 From: Aaquib Asrar Date: Tue, 30 Jan 2024 20:27:51 +0530 Subject: [PATCH 1/2] Added an additional button --- Todo-app/index.html | 8 +++++--- Todo-app/script.js | 8 -------- Todo-app/style.css | 33 ++++++++++++++++++++++++++++++++- 3 files changed, 37 insertions(+), 12 deletions(-) diff --git a/Todo-app/index.html b/Todo-app/index.html index a2d1385..6b65bb0 100644 --- a/Todo-app/index.html +++ b/Todo-app/index.html @@ -37,15 +37,17 @@
+

My Todo

- Type in the below field 👇 and press enter to add your todo in the list + Press enter to add your todo in the list

- -
+ + +
diff --git a/Todo-app/script.js b/Todo-app/script.js index 08e4b7e..8c58991 100644 --- a/Todo-app/script.js +++ b/Todo-app/script.js @@ -40,9 +40,6 @@ function renderTodo(todo) { } else { list.append(newlist); } - - /* // disabled this after fixing a selection bug - list.append(newlist); */ } // function for adding a todo @@ -58,11 +55,6 @@ function myFunction(x) { demoarray.push(todoobject); renderTodo(todoobject); - console.log(demoarray); - - /* disabled this because updated it show in list */ - /* // print demoarray in console - console.log(demoarray); */ } function toggleDone(b) { diff --git a/Todo-app/style.css b/Todo-app/style.css index e2de747..d663f3d 100644 --- a/Todo-app/style.css +++ b/Todo-app/style.css @@ -111,13 +111,16 @@ color: var(--color); .container { width: 100%; -max-width: 700px; +max-width: 800px; margin: 0 auto; padding-left: 10px; padding-right: 10px; color: var(--color); margin: auto; padding-top: 4rem; +display: flex; +flex-direction: column; +justify-content: center; } .app-title { @@ -228,6 +231,7 @@ margin-bottom: 20px; .empty-state__title, .empty-state__description { /* margin-bottom: 20px; */ +flex-shrink: 0; font-size: 25px; text-align: center; margin: 2rem; @@ -264,3 +268,30 @@ em { display: none; } } + + +.btn { + position: relative; + margin-left: 10px; + margin-top: 0.3rem; + padding: 10px 30px; + font-size: 1.2rem; + background-color: #007bff; + color: #fff; + border: 2px solid #007bff; + border-radius: 6px; + cursor: pointer; + transition: all 0.3s ease; +} + +form { + display: flex; + align-items: flex-end; +} + +input[type="text"] { + + padding: 10px; + border-radius: 4px; + border: 3px solid #333; +} \ No newline at end of file From 27a6bfcda7db777042c8aa66ea89ed05eb8fc15d Mon Sep 17 00:00:00 2001 From: Aaquib Asrar Date: Tue, 30 Jan 2024 21:04:58 +0530 Subject: [PATCH 2/2] Added a submit button in Contact manager app --- Contact manager app/index.html | 2 +- Contact manager app/style.css | 17 ++++++++++++++++- 2 files changed, 17 insertions(+), 2 deletions(-) diff --git a/Contact manager app/index.html b/Contact manager app/index.html index b16916d..e7381f8 100644 --- a/Contact manager app/index.html +++ b/Contact manager app/index.html @@ -37,7 +37,7 @@ - + diff --git a/Contact manager app/style.css b/Contact manager app/style.css index 9b5d42e..39ee0dd 100644 --- a/Contact manager app/style.css +++ b/Contact manager app/style.css @@ -112,6 +112,8 @@ form { margin-top: 15%; margin-left: 7%; position: fixed; + display: flex; + flex-direction: column; } .name, @@ -146,5 +148,18 @@ input[type="tel"] { } .submitbtn { - display: none; + padding: 12px 24px; + margin-right: 50%; + margin-left: 25%; + font-size: 1rem; + background-color: #007bff; + color: #fff; + border: none; + border-radius: 6px; + cursor: pointer; + transition: background-color 0.3s ease; +} + +.submitbtn:hover { + background-color: #0056b3; }