html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE html>
<html>
<head>
<title>ToDo App</title>
</head>
<body>
<div class="container">
<button id="btn-delAll" class="btn-del">×</button>
<div class="wrap-todo">
<h1>❤️ToDo List App❤️</h1>
<div class="wrapper">
<input type="text" id="input_todo" placeholder="❤️To-Do Item❤️" />
<button id="btn-add">
<span>Add</span>
</button>
</div>
</div>
</div>
<div class="container">
<ul id="todo_ul"></ul>
</div>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
body
{
font-family: "Montserrat", serif;
font-optical-sizing: auto;
font-style: normal;
background-color: #171a1c;
color: #fff;
}
ul, li {list-style:none; margin-left: -20px; font-size: 18px;}
.wrap-todo {
display: flex;
flex-direction: column;
justify-content: center;
align-items:center;
}
input[type=text] {
font-family: "Montserrat", serif;
font-optical-sizing: auto;
font-style: normal;
color: #fff;
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
4
5
6
7
8
/*
ToDo App that saves your data even if you reload page, exit and reopen.
It's done with window.localStorage magic
Works on iOS. Tell me in comments if it works for you and please mention whether you have iOS or Android phone.
*/
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run