├── .gitignore
├── turn-left.png
├── src
├── index.js
├── modules
│ ├── display.js
│ └── CRUD.js
├── index.html
└── style.css
├── .hintrc
├── .eslintrc.json
├── .stylelintrc.json
├── webpack.config.js
├── LICENSE.md
├── dist
├── index.html
├── runtime.bundle.js
└── index.bundle.js
├── package.json
├── .github
└── workflows
│ └── linters.yml
└── README.md
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 |
--------------------------------------------------------------------------------
/turn-left.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/saluumaa/To-do-List/HEAD/turn-left.png
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | import './style.css';
2 | import './modules/CRUD.js';
3 | import './modules/display.js';
4 |
--------------------------------------------------------------------------------
/.hintrc:
--------------------------------------------------------------------------------
1 | {
2 | "connector": {
3 | "name": "local",
4 | "options": {
5 | "pattern": ["**", "!.git/**", "!node_modules/**"]
6 | }
7 | },
8 | "extends": ["development"],
9 | "formatters": ["stylish"],
10 | "hints": [
11 | "button-type",
12 | "disown-opener",
13 | "html-checker",
14 | "meta-charset-utf-8",
15 | "meta-viewport",
16 | "no-inline-styles:error"
17 | ]
18 | }
--------------------------------------------------------------------------------
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "env": {
3 | "browser": true,
4 | "es6": true,
5 | "jest": true
6 | },
7 | "parser": "babel-eslint",
8 | "parserOptions": {
9 | "ecmaVersion": 2018,
10 | "sourceType": "module"
11 | },
12 | "extends": ["airbnb-base"],
13 | "rules": {
14 | "no-shadow": "off",
15 | "no-param-reassign": "off",
16 | "eol-last": "off",
17 | "import/extensions": [ 1, {
18 | "js": "always", "json": "always"
19 | }]
20 | },
21 | "ignorePatterns": [
22 | "dist/",
23 | "build/"
24 | ]
25 | }
--------------------------------------------------------------------------------
/.stylelintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["stylelint-config-standard"],
3 | "plugins": ["stylelint-scss", "stylelint-csstree-validator"],
4 | "rules": {
5 | "at-rule-no-unknown": [
6 | true,
7 | {
8 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"]
9 | }
10 | ],
11 | "scss/at-rule-no-unknown": [
12 | true,
13 | {
14 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"]
15 | }
16 | ],
17 | "csstree/validator": true
18 | },
19 | "ignoreFiles": ["build/**", "dist/**", "**/reset*.css", "**/bootstrap*.css", "**/*.js", "**/*.jsx"]
20 | }
--------------------------------------------------------------------------------
/webpack.config.js:
--------------------------------------------------------------------------------
1 | const path = require('path');
2 | const HtmlWebpackPlugin = require('html-webpack-plugin');
3 |
4 | module.exports = {
5 | mode: 'development',
6 | entry: {
7 | index: './src/index.js',
8 | },
9 | devServer: {
10 | static: './dist',
11 | },
12 | devtool: 'inline-source-map',
13 | plugins: [
14 | new HtmlWebpackPlugin({
15 | template: './src/index.html',
16 | }),
17 | ],
18 | output: {
19 | filename: '[name].bundle.js',
20 | path: path.resolve(__dirname, 'dist'),
21 | clean: true,
22 | },
23 | optimization: {
24 | runtimeChunk: 'single',
25 | },
26 | module: {
27 | rules: [
28 | {
29 | test: /\.css$/i,
30 | use: ['style-loader', 'css-loader'],
31 | },
32 | ],
33 | },
34 | };
--------------------------------------------------------------------------------
/src/modules/display.js:
--------------------------------------------------------------------------------
1 | export const listContainer = document.querySelector('.to-do-holder');
2 | export const tasks = JSON.parse(localStorage.getItem('tasks')) || [];
3 | export const displaytasks = () => {
4 | listContainer.innerHTML = '';
5 | tasks.forEach((todo) => {
6 | tasks.sort((a, b) => a.index - b.index);
7 | listContainer.innerHTML += `
8 |
9 |
11 |
${todo.description}
12 |
13 |
14 |
To Do List
8 |
12 |
16 |
20 |
21 | Clear All Completed
22 |
23 |
24 |
--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2023 saluumaa
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/dist/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | To Do List
8 |
12 |
16 |
20 |
21 | Clear All Completed
22 |
23 |
24 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "to-do-list",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "private": true,
7 | "scripts": {
8 | "test": "echo \"Error: no test specified\" && exit 1",
9 | "build": "webpack",
10 | "start": "webpack serve --open"
11 | },
12 | "repository": {
13 | "type": "git",
14 | "url": "git+https://github.com/saluumaa/To-do-List.git"
15 | },
16 | "keywords": [],
17 | "author": "",
18 | "license": "ISC",
19 | "bugs": {
20 | "url": "https://github.com/saluumaa/To-do-List/issues"
21 | },
22 | "homepage": "https://github.com/saluumaa/To-do-List#readme",
23 | "devDependencies": {
24 | "babel-eslint": "^10.1.0",
25 | "css-loader": "^6.7.3",
26 | "eslint": "^7.32.0",
27 | "eslint-config-airbnb-base": "^14.2.1",
28 | "eslint-plugin-import": "^2.27.5",
29 | "hint": "^7.1.3",
30 | "html-webpack-plugin": "^5.5.0",
31 | "style-loader": "^3.3.1",
32 | "stylelint": "^13.13.1",
33 | "stylelint-config-standard": "^21.0.0",
34 | "stylelint-csstree-validator": "^1.9.0",
35 | "stylelint-scss": "^3.21.0",
36 | "webpack": "^5.75.0",
37 | "webpack-cli": "^5.0.1"
38 | },
39 | "dependencies": {
40 | "lodash": "^4.17.21"
41 | }
42 | }
43 |
--------------------------------------------------------------------------------
/src/style.css:
--------------------------------------------------------------------------------
1 | @import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Lato&family=Nunito:ital,wght@0,200;0,300;0,500;0,600;0,700;1,200;1,300;1,700;1,900&family=Poppins:wght@300&family=Roboto:ital,wght@0,300;0,500;0,700;1,300;1,400;1,500&display=swap');
2 |
3 | * {
4 | padding: 0;
5 | margin: 0;
6 | box-sizing: border-box;
7 | }
8 |
9 | body {
10 | font-family: 'Roboto', sans-serif;
11 | font-size: 16px;
12 | }
13 |
14 | .container {
15 | display: flex;
16 | flex-direction: column;
17 | justify-content: space-between;
18 | width: 80%;
19 | position: relative;
20 | margin: 80px auto;
21 | background-color: rgb(231, 230, 230);
22 | }
23 |
24 | .header {
25 | display: flex;
26 | justify-content: space-between;
27 | align-items: center;
28 | padding: 10px 10px;
29 | border-bottom: 2px solid rgba(0, 0, 0, 0.4);
30 | }
31 |
32 | .header p {
33 | font-size: 18px;
34 | font-weight: 600;
35 | }
36 |
37 | .arrow-img {
38 | font-size: 30px;
39 | color: rgba(0, 0, 0, 0.7);
40 | cursor: pointer;
41 | }
42 |
43 | .form {
44 | display: flex;
45 | justify-content: space-between;
46 | padding: 10px 10px;
47 | border-bottom: 2px solid rgba(0, 0, 0, 0.3);
48 | }
49 |
50 | #todo-input {
51 | width: 90%;
52 | padding-top: 5px;
53 | padding-bottom: 5px;
54 | background-color: inherit;
55 | border: none;
56 | outline: none;
57 | }
58 |
59 | input::placeholder {
60 | font-style: italic;
61 | font-weight: 500;
62 | }
63 |
64 | .to-do-holder {
65 | display: flex;
66 | flex-direction: column;
67 | justify-content: space-between;
68 | padding: 10px 0;
69 | }
70 |
71 | .todo {
72 | display: flex;
73 | gap: 10px;
74 | padding-top: 13px;
75 | font-weight: 400;
76 | padding-bottom: 7px;
77 | border-bottom: 2px solid rgba(0, 0, 0, 0.3);
78 | }
79 |
80 | .Edit,
81 | .delete {
82 | margin-left: 100%;
83 | position: absolute;
84 | right: 10px;
85 | cursor: pointer;
86 | font-size: 24px;
87 | }
88 |
89 | .delete {
90 | display: none;
91 | }
92 |
93 | i.show {
94 | display: flex;
95 | }
96 |
97 | i.hide {
98 | display: none;
99 | }
100 |
101 | .list-text {
102 | outline: none;
103 | }
104 |
105 | .checkbox {
106 | margin-left: 10px;
107 | cursor: pointer;
108 | }
109 |
110 | .checkbox:checked + .list-text {
111 | text-decoration: line-through;
112 | color: rebeccapurple;
113 | font-style: italic;
114 | font-size: 17px;
115 | font-weight: 500;
116 | }
117 |
118 | .clear-btn {
119 | padding: 15px 20px;
120 | cursor: pointer;
121 | border: none;
122 | margin-top: -9px;
123 | background-color: rgb(189, 189, 189);
124 | font-size: 20px;
125 | }
126 |
--------------------------------------------------------------------------------
/.github/workflows/linters.yml:
--------------------------------------------------------------------------------
1 | name: Linters
2 |
3 | on: pull_request
4 |
5 | env:
6 | FORCE_COLOR: 1
7 |
8 | jobs:
9 | lighthouse:
10 | name: Lighthouse
11 | runs-on: ubuntu-22.04
12 | steps:
13 | - uses: actions/checkout@v2
14 | - uses: actions/setup-node@v1
15 | with:
16 | node-version: "12.x"
17 | - name: Setup Lighthouse
18 | run: npm install -g @lhci/cli@0.7.x
19 | - name: Lighthouse Report
20 | run: lhci autorun --upload.target=temporary-public-storage --collect.staticDistDir=.
21 | webhint:
22 | name: Webhint
23 | runs-on: ubuntu-22.04
24 | steps:
25 | - uses: actions/checkout@v2
26 | - uses: actions/setup-node@v1
27 | with:
28 | node-version: "18.x"
29 | - name: Setup Webhint
30 | run: |
31 | npm install --save-dev hint@7.x
32 | [ -f .hintrc ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.hintrc
33 | - name: Webhint Report
34 | run: npx hint .
35 | stylelint:
36 | name: Stylelint
37 | runs-on: ubuntu-22.04
38 | steps:
39 | - uses: actions/checkout@v2
40 | - uses: actions/setup-node@v1
41 | with:
42 | node-version: "18.x"
43 | - name: Setup Stylelint
44 | run: |
45 | npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x
46 | [ -f .stylelintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.stylelintrc.json
47 | - name: Stylelint Report
48 | run: npx stylelint "**/*.{css,scss}"
49 | eslint:
50 | name: ESLint
51 | runs-on: ubuntu-22.04
52 | steps:
53 | - uses: actions/checkout@v2
54 | - uses: actions/setup-node@v1
55 | with:
56 | node-version: "18.x"
57 | - name: Setup ESLint
58 | run: |
59 | npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x
60 | [ -f .eslintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.eslintrc.json
61 | - name: ESLint Report
62 | run: npx eslint .
63 | nodechecker:
64 | name: node_modules checker
65 | runs-on: ubuntu-22.04
66 | steps:
67 | - uses: actions/checkout@v2
68 | - name: Check node_modules existence
69 | run: |
70 | if [ -d "node_modules/" ]; then echo -e "\e[1;31mThe node_modules/ folder was pushed to the repo. Please remove it from the GitHub repository and try again."; echo -e "\e[1;32mYou can set up a .gitignore file with this folder included on it to prevent this from happening in the future." && exit 1; fi
--------------------------------------------------------------------------------
/src/modules/CRUD.js:
--------------------------------------------------------------------------------
1 | import { listContainer, displaytasks, tasks } from './display.js';
2 |
3 | const form = document.querySelector('.form');
4 | const todoInput = document.querySelector('#todo-input');
5 | const arrow = document.querySelector('.arrow-img');
6 | /* eslint-disable no-use-before-define */
7 | form.addEventListener('submit', (e) => {
8 | e.preventDefault();
9 | saveTodo();
10 | displaytasks();
11 | localStorage.setItem('tasks', JSON.stringify(tasks));
12 | });
13 |
14 | arrow.addEventListener('click', () => {
15 | saveTodo();
16 | displaytasks();
17 | localStorage.setItem('tasks', JSON.stringify(tasks));
18 | });
19 |
20 | // Save todo function
21 | const saveTodo = (todoIndex = null, todoValue = todoInput.value) => {
22 | if (todoIndex !== null) {
23 | tasks[todoIndex].description = todoValue;
24 | } else {
25 | const index = tasks.length + 1;
26 | tasks.push({
27 | description: todoValue,
28 | completed: false,
29 | index,
30 | });
31 | }
32 |
33 | todoInput.value = '';
34 | };
35 |
36 | // eventlistener for all Tasks
37 | listContainer.addEventListener('click', (e) => {
38 | const { target } = e;
39 | const parentElement = target.parentNode;
40 | if (parentElement.className !== 'todo') {
41 | return;
42 | }
43 | // todo id
44 | const todo = parentElement;
45 | const todoId = Number(todo.id);
46 | // target action
47 | const actions = target.dataset.action;
48 | if (actions === 'edit') {
49 | editTodo(todoId);
50 | } else if (actions === 'delete') {
51 | deleteTodo(todoId);
52 | } else if (actions === 'check') {
53 | checkTodo(todoId);
54 | }
55 | });
56 |
57 | const editTodo = (todoId) => {
58 | const container = document.getElementById(todoId);
59 | const taskDescription = container.querySelector('.list-text');
60 | const editIcon = container.querySelector('.Edit');
61 | const deleteIcon = container.querySelector('.delete');
62 | taskDescription.contentEditable = true;
63 | taskDescription.focus();
64 | editIcon.classList.add('hide');
65 | deleteIcon.classList.add('show');
66 | taskDescription.addEventListener('keydown', (e) => {
67 | if (e.key === 'Enter') {
68 | e.preventDefault();
69 | saveTodo(todoId - 1, taskDescription.textContent);
70 | displaytasks();
71 | localStorage.setItem('tasks', JSON.stringify(tasks));
72 | taskDescription.contentEditable = false;
73 | editIcon.classList.remove('hide');
74 | deleteIcon.classList.remove('show');
75 | }
76 | });
77 | };
78 |
79 | const deleteTodo = (todoId) => {
80 | tasks.splice(todoId - 1, 1); // remove one element at index todoId - 1
81 | const todoElement = document.getElementById(todoId);
82 | todoElement.parentNode.removeChild(todoElement);
83 | for (let i = 0; i < tasks.length; i += 1) {
84 | tasks[i].index = i + 1;
85 | }
86 | displaytasks();
87 | localStorage.setItem('tasks', JSON.stringify(tasks));
88 | };
89 |
90 | function checkTodo(todoId) {
91 | tasks.forEach((todo, index) => {
92 | if (index === todoId - 1) {
93 | todo.completed = !todo.completed;
94 | }
95 | });
96 | displaytasks();
97 | localStorage.setItem('tasks', JSON.stringify(tasks));
98 | }
99 |
100 | const btnClear = document.querySelector('.clear-btn');
101 | btnClear.addEventListener('click', () => {
102 | const incompleteTasks = tasks.filter((todo) => !todo.completed);
103 | tasks.length = 0; // clear the original tasks array
104 | tasks.push(...incompleteTasks); // add the incomplete tasks back to the original array
105 | for (let i = 0; i < tasks.length; i += 1) {
106 | tasks[i].index = i + 1;
107 | }
108 | displaytasks();
109 | localStorage.setItem('tasks', JSON.stringify(tasks));
110 | });
111 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 |
5 |
6 |
TO-DO-List-App
43 | Client
44 |
50 |
51 |
52 | ### Key Features (back to top )
59 |
60 |
61 | ## 🚀 Live Demo (back to top )
66 |
67 | ## 💻 Getting Started (back to top )
103 |
104 |
105 | ## 👥 Authors (back to top )
114 |
115 |
116 | ## 🔭 Future Features (back to top )
121 |
122 |
123 | ## 🤝 Contributing (back to top )
130 |
131 |
132 | ## ⭐️ Show your support (back to top )
137 |
138 |
139 | ## 🙏 Acknowledgments (back to top )
144 |
145 |
146 | ## 📝 License (back to top )
149 |
--------------------------------------------------------------------------------
/dist/runtime.bundle.js:
--------------------------------------------------------------------------------
1 | /******/ (() => { // webpackBootstrap
2 | /******/ "use strict";
3 | /******/ var __webpack_modules__ = ({});
4 | /************************************************************************/
5 | /******/ // The module cache
6 | /******/ var __webpack_module_cache__ = {};
7 | /******/
8 | /******/ // The require function
9 | /******/ function __webpack_require__(moduleId) {
10 | /******/ // Check if module is in cache
11 | /******/ var cachedModule = __webpack_module_cache__[moduleId];
12 | /******/ if (cachedModule !== undefined) {
13 | /******/ return cachedModule.exports;
14 | /******/ }
15 | /******/ // Create a new module (and put it into the cache)
16 | /******/ var module = __webpack_module_cache__[moduleId] = {
17 | /******/ id: moduleId,
18 | /******/ // no module.loaded needed
19 | /******/ exports: {}
20 | /******/ };
21 | /******/
22 | /******/ // Execute the module function
23 | /******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
24 | /******/
25 | /******/ // Return the exports of the module
26 | /******/ return module.exports;
27 | /******/ }
28 | /******/
29 | /******/ // expose the modules object (__webpack_modules__)
30 | /******/ __webpack_require__.m = __webpack_modules__;
31 | /******/
32 | /************************************************************************/
33 | /******/ /* webpack/runtime/chunk loaded */
34 | /******/ (() => {
35 | /******/ var deferred = [];
36 | /******/ __webpack_require__.O = (result, chunkIds, fn, priority) => {
37 | /******/ if(chunkIds) {
38 | /******/ priority = priority || 0;
39 | /******/ for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
40 | /******/ deferred[i] = [chunkIds, fn, priority];
41 | /******/ return;
42 | /******/ }
43 | /******/ var notFulfilled = Infinity;
44 | /******/ for (var i = 0; i < deferred.length; i++) {
45 | /******/ var [chunkIds, fn, priority] = deferred[i];
46 | /******/ var fulfilled = true;
47 | /******/ for (var j = 0; j < chunkIds.length; j++) {
48 | /******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
49 | /******/ chunkIds.splice(j--, 1);
50 | /******/ } else {
51 | /******/ fulfilled = false;
52 | /******/ if(priority < notFulfilled) notFulfilled = priority;
53 | /******/ }
54 | /******/ }
55 | /******/ if(fulfilled) {
56 | /******/ deferred.splice(i--, 1)
57 | /******/ var r = fn();
58 | /******/ if (r !== undefined) result = r;
59 | /******/ }
60 | /******/ }
61 | /******/ return result;
62 | /******/ };
63 | /******/ })();
64 | /******/
65 | /******/ /* webpack/runtime/compat get default export */
66 | /******/ (() => {
67 | /******/ // getDefaultExport function for compatibility with non-harmony modules
68 | /******/ __webpack_require__.n = (module) => {
69 | /******/ var getter = module && module.__esModule ?
70 | /******/ () => (module['default']) :
71 | /******/ () => (module);
72 | /******/ __webpack_require__.d(getter, { a: getter });
73 | /******/ return getter;
74 | /******/ };
75 | /******/ })();
76 | /******/
77 | /******/ /* webpack/runtime/define property getters */
78 | /******/ (() => {
79 | /******/ // define getter functions for harmony exports
80 | /******/ __webpack_require__.d = (exports, definition) => {
81 | /******/ for(var key in definition) {
82 | /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
83 | /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
84 | /******/ }
85 | /******/ }
86 | /******/ };
87 | /******/ })();
88 | /******/
89 | /******/ /* webpack/runtime/hasOwnProperty shorthand */
90 | /******/ (() => {
91 | /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
92 | /******/ })();
93 | /******/
94 | /******/ /* webpack/runtime/make namespace object */
95 | /******/ (() => {
96 | /******/ // define __esModule on exports
97 | /******/ __webpack_require__.r = (exports) => {
98 | /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
99 | /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
100 | /******/ }
101 | /******/ Object.defineProperty(exports, '__esModule', { value: true });
102 | /******/ };
103 | /******/ })();
104 | /******/
105 | /******/ /* webpack/runtime/jsonp chunk loading */
106 | /******/ (() => {
107 | /******/ // no baseURI
108 | /******/
109 | /******/ // object to store loaded and loading chunks
110 | /******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
111 | /******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
112 | /******/ var installedChunks = {
113 | /******/ "runtime": 0
114 | /******/ };
115 | /******/
116 | /******/ // no chunk on demand loading
117 | /******/
118 | /******/ // no prefetching
119 | /******/
120 | /******/ // no preloaded
121 | /******/
122 | /******/ // no HMR
123 | /******/
124 | /******/ // no HMR manifest
125 | /******/
126 | /******/ __webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
127 | /******/
128 | /******/ // install a JSONP callback for chunk loading
129 | /******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
130 | /******/ var [chunkIds, moreModules, runtime] = data;
131 | /******/ // add "moreModules" to the modules object,
132 | /******/ // then flag all "chunkIds" as loaded and fire callback
133 | /******/ var moduleId, chunkId, i = 0;
134 | /******/ if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
135 | /******/ for(moduleId in moreModules) {
136 | /******/ if(__webpack_require__.o(moreModules, moduleId)) {
137 | /******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
138 | /******/ }
139 | /******/ }
140 | /******/ if(runtime) var result = runtime(__webpack_require__);
141 | /******/ }
142 | /******/ if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
143 | /******/ for(;i < chunkIds.length; i++) {
144 | /******/ chunkId = chunkIds[i];
145 | /******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
146 | /******/ installedChunks[chunkId][0]();
147 | /******/ }
148 | /******/ installedChunks[chunkId] = 0;
149 | /******/ }
150 | /******/ return __webpack_require__.O(result);
151 | /******/ }
152 | /******/
153 | /******/ var chunkLoadingGlobal = self["webpackChunkto_do_list"] = self["webpackChunkto_do_list"] || [];
154 | /******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
155 | /******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
156 | /******/ })();
157 | /******/
158 | /******/ /* webpack/runtime/nonce */
159 | /******/ (() => {
160 | /******/ __webpack_require__.nc = undefined;
161 | /******/ })();
162 | /******/
163 | /************************************************************************/
164 | /******/
165 | /******/
166 | /******/ })()
167 | ;
168 | //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicnVudGltZS5idW5kbGUuanMiLCJtYXBwaW5ncyI6Ijs7OztVQUFBO1VBQ0E7O1VBRUE7VUFDQTtVQUNBO1VBQ0E7VUFDQTtVQUNBO1VBQ0E7VUFDQTtVQUNBO1VBQ0E7VUFDQTtVQUNBO1VBQ0E7O1VBRUE7VUFDQTs7VUFFQTtVQUNBO1VBQ0E7O1VBRUE7VUFDQTs7Ozs7V0N6QkE7V0FDQTtXQUNBO1dBQ0E7V0FDQSwrQkFBK0Isd0NBQXdDO1dBQ3ZFO1dBQ0E7V0FDQTtXQUNBO1dBQ0EsaUJBQWlCLHFCQUFxQjtXQUN0QztXQUNBO1dBQ0Esa0JBQWtCLHFCQUFxQjtXQUN2QztXQUNBO1dBQ0EsS0FBSztXQUNMO1dBQ0E7V0FDQTtXQUNBO1dBQ0E7V0FDQTtXQUNBO1dBQ0E7V0FDQTtXQUNBO1dBQ0E7V0FDQTs7Ozs7V0MzQkE7V0FDQTtXQUNBO1dBQ0E7V0FDQTtXQUNBLGlDQUFpQyxXQUFXO1dBQzVDO1dBQ0E7Ozs7O1dDUEE7V0FDQTtXQUNBO1dBQ0E7V0FDQSx5Q0FBeUMsd0NBQXdDO1dBQ2pGO1dBQ0E7V0FDQTs7Ozs7V0NQQTs7Ozs7V0NBQTtXQUNBO1dBQ0E7V0FDQSx1REFBdUQsaUJBQWlCO1dBQ3hFO1dBQ0EsZ0RBQWdELGFBQWE7V0FDN0Q7Ozs7O1dDTkE7O1dBRUE7V0FDQTtXQUNBO1dBQ0E7V0FDQTtXQUNBOztXQUVBOztXQUVBOztXQUVBOztXQUVBOztXQUVBOztXQUVBOztXQUVBO1dBQ0E7V0FDQTtXQUNBO1dBQ0E7V0FDQTtXQUNBO1dBQ0E7V0FDQTtXQUNBO1dBQ0E7V0FDQTtXQUNBO1dBQ0E7V0FDQTtXQUNBLE1BQU0scUJBQXFCO1dBQzNCO1dBQ0E7V0FDQTtXQUNBO1dBQ0E7V0FDQTtXQUNBO1dBQ0E7O1dBRUE7V0FDQTtXQUNBOzs7OztXQ2hEQSIsInNvdXJjZXMiOlsid2VicGFjazovL3RvLWRvLWxpc3Qvd2VicGFjay9ib290c3RyYXAiLCJ3ZWJwYWNrOi8vdG8tZG8tbGlzdC93ZWJwYWNrL3J1bnRpbWUvY2h1bmsgbG9hZGVkIiwid2VicGFjazovL3RvLWRvLWxpc3Qvd2VicGFjay9ydW50aW1lL2NvbXBhdCBnZXQgZGVmYXVsdCBleHBvcnQiLCJ3ZWJwYWNrOi8vdG8tZG8tbGlzdC93ZWJwYWNrL3J1bnRpbWUvZGVmaW5lIHByb3BlcnR5IGdldHRlcnMiLCJ3ZWJwYWNrOi8vdG8tZG8tbGlzdC93ZWJwYWNrL3J1bnRpbWUvaGFzT3duUHJvcGVydHkgc2hvcnRoYW5kIiwid2VicGFjazovL3RvLWRvLWxpc3Qvd2VicGFjay9ydW50aW1lL21ha2UgbmFtZXNwYWNlIG9iamVjdCIsIndlYnBhY2s6Ly90by1kby1saXN0L3dlYnBhY2svcnVudGltZS9qc29ucCBjaHVuayBsb2FkaW5nIiwid2VicGFjazovL3RvLWRvLWxpc3Qvd2VicGFjay9ydW50aW1lL25vbmNlIiwid2VicGFjazovL3RvLWRvLWxpc3Qvd2VicGFjay9iZWZvcmUtc3RhcnR1cCIsIndlYnBhY2s6Ly90by1kby1saXN0L3dlYnBhY2svc3RhcnR1cCIsIndlYnBhY2s6Ly90by1kby1saXN0L3dlYnBhY2svYWZ0ZXItc3RhcnR1cCJdLCJzb3VyY2VzQ29udGVudCI6WyIvLyBUaGUgbW9kdWxlIGNhY2hlXG52YXIgX193ZWJwYWNrX21vZHVsZV9jYWNoZV9fID0ge307XG5cbi8vIFRoZSByZXF1aXJlIGZ1bmN0aW9uXG5mdW5jdGlvbiBfX3dlYnBhY2tfcmVxdWlyZV9fKG1vZHVsZUlkKSB7XG5cdC8vIENoZWNrIGlmIG1vZHVsZSBpcyBpbiBjYWNoZVxuXHR2YXIgY2FjaGVkTW9kdWxlID0gX193ZWJwYWNrX21vZHVsZV9jYWNoZV9fW21vZHVsZUlkXTtcblx0aWYgKGNhY2hlZE1vZHVsZSAhPT0gdW5kZWZpbmVkKSB7XG5cdFx0cmV0dXJuIGNhY2hlZE1vZHVsZS5leHBvcnRzO1xuXHR9XG5cdC8vIENyZWF0ZSBhIG5ldyBtb2R1bGUgKGFuZCBwdXQgaXQgaW50byB0aGUgY2FjaGUpXG5cdHZhciBtb2R1bGUgPSBfX3dlYnBhY2tfbW9kdWxlX2NhY2hlX19bbW9kdWxlSWRdID0ge1xuXHRcdGlkOiBtb2R1bGVJZCxcblx0XHQvLyBubyBtb2R1bGUubG9hZGVkIG5lZWRlZFxuXHRcdGV4cG9ydHM6IHt9XG5cdH07XG5cblx0Ly8gRXhlY3V0ZSB0aGUgbW9kdWxlIGZ1bmN0aW9uXG5cdF9fd2VicGFja19tb2R1bGVzX19bbW9kdWxlSWRdKG1vZHVsZSwgbW9kdWxlLmV4cG9ydHMsIF9fd2VicGFja19yZXF1aXJlX18pO1xuXG5cdC8vIFJldHVybiB0aGUgZXhwb3J0cyBvZiB0aGUgbW9kdWxlXG5cdHJldHVybiBtb2R1bGUuZXhwb3J0cztcbn1cblxuLy8gZXhwb3NlIHRoZSBtb2R1bGVzIG9iamVjdCAoX193ZWJwYWNrX21vZHVsZXNfXylcbl9fd2VicGFja19yZXF1aXJlX18ubSA9IF9fd2VicGFja19tb2R1bGVzX187XG5cbiIsInZhciBkZWZlcnJlZCA9IFtdO1xuX193ZWJwYWNrX3JlcXVpcmVfXy5PID0gKHJlc3VsdCwgY2h1bmtJZHMsIGZuLCBwcmlvcml0eSkgPT4ge1xuXHRpZihjaHVua0lkcykge1xuXHRcdHByaW9yaXR5ID0gcHJpb3JpdHkgfHwgMDtcblx0XHRmb3IodmFyIGkgPSBkZWZlcnJlZC5sZW5ndGg7IGkgPiAwICYmIGRlZmVycmVkW2kgLSAxXVsyXSA+IHByaW9yaXR5OyBpLS0pIGRlZmVycmVkW2ldID0gZGVmZXJyZWRbaSAtIDFdO1xuXHRcdGRlZmVycmVkW2ldID0gW2NodW5rSWRzLCBmbiwgcHJpb3JpdHldO1xuXHRcdHJldHVybjtcblx0fVxuXHR2YXIgbm90RnVsZmlsbGVkID0gSW5maW5pdHk7XG5cdGZvciAodmFyIGkgPSAwOyBpIDwgZGVmZXJyZWQubGVuZ3RoOyBpKyspIHtcblx0XHR2YXIgW2NodW5rSWRzLCBmbiwgcHJpb3JpdHldID0gZGVmZXJyZWRbaV07XG5cdFx0dmFyIGZ1bGZpbGxlZCA9IHRydWU7XG5cdFx0Zm9yICh2YXIgaiA9IDA7IGogPCBjaHVua0lkcy5sZW5ndGg7IGorKykge1xuXHRcdFx0aWYgKChwcmlvcml0eSAmIDEgPT09IDAgfHwgbm90RnVsZmlsbGVkID49IHByaW9yaXR5KSAmJiBPYmplY3Qua2V5cyhfX3dlYnBhY2tfcmVxdWlyZV9fLk8pLmV2ZXJ5KChrZXkpID0+IChfX3dlYnBhY2tfcmVxdWlyZV9fLk9ba2V5XShjaHVua0lkc1tqXSkpKSkge1xuXHRcdFx0XHRjaHVua0lkcy5zcGxpY2Uoai0tLCAxKTtcblx0XHRcdH0gZWxzZSB7XG5cdFx0XHRcdGZ1bGZpbGxlZCA9IGZhbHNlO1xuXHRcdFx0XHRpZihwcmlvcml0eSA8IG5vdEZ1bGZpbGxlZCkgbm90RnVsZmlsbGVkID0gcHJpb3JpdHk7XG5cdFx0XHR9XG5cdFx0fVxuXHRcdGlmKGZ1bGZpbGxlZCkge1xuXHRcdFx0ZGVmZXJyZWQuc3BsaWNlKGktLSwgMSlcblx0XHRcdHZhciByID0gZm4oKTtcblx0XHRcdGlmIChyICE9PSB1bmRlZmluZWQpIHJlc3VsdCA9IHI7XG5cdFx0fVxuXHR9XG5cdHJldHVybiByZXN1bHQ7XG59OyIsIi8vIGdldERlZmF1bHRFeHBvcnQgZnVuY3Rpb24gZm9yIGNvbXBhdGliaWxpdHkgd2l0aCBub24taGFybW9ueSBtb2R1bGVzXG5fX3dlYnBhY2tfcmVxdWlyZV9fLm4gPSAobW9kdWxlKSA9PiB7XG5cdHZhciBnZXR0ZXIgPSBtb2R1bGUgJiYgbW9kdWxlLl9fZXNNb2R1bGUgP1xuXHRcdCgpID0+IChtb2R1bGVbJ2RlZmF1bHQnXSkgOlxuXHRcdCgpID0+IChtb2R1bGUpO1xuXHRfX3dlYnBhY2tfcmVxdWlyZV9fLmQoZ2V0dGVyLCB7IGE6IGdldHRlciB9KTtcblx0cmV0dXJuIGdldHRlcjtcbn07IiwiLy8gZGVmaW5lIGdldHRlciBmdW5jdGlvbnMgZm9yIGhhcm1vbnkgZXhwb3J0c1xuX193ZWJwYWNrX3JlcXVpcmVfXy5kID0gKGV4cG9ydHMsIGRlZmluaXRpb24pID0+IHtcblx0Zm9yKHZhciBrZXkgaW4gZGVmaW5pdGlvbikge1xuXHRcdGlmKF9fd2VicGFja19yZXF1aXJlX18ubyhkZWZpbml0aW9uLCBrZXkpICYmICFfX3dlYnBhY2tfcmVxdWlyZV9fLm8oZXhwb3J0cywga2V5KSkge1xuXHRcdFx0T2JqZWN0LmRlZmluZVByb3BlcnR5KGV4cG9ydHMsIGtleSwgeyBlbnVtZXJhYmxlOiB0cnVlLCBnZXQ6IGRlZmluaXRpb25ba2V5XSB9KTtcblx0XHR9XG5cdH1cbn07IiwiX193ZWJwYWNrX3JlcXVpcmVfXy5vID0gKG9iaiwgcHJvcCkgPT4gKE9iamVjdC5wcm90b3R5cGUuaGFzT3duUHJvcGVydHkuY2FsbChvYmosIHByb3ApKSIsIi8vIGRlZmluZSBfX2VzTW9kdWxlIG9uIGV4cG9ydHNcbl9fd2VicGFja19yZXF1aXJlX18uciA9IChleHBvcnRzKSA9PiB7XG5cdGlmKHR5cGVvZiBTeW1ib2wgIT09ICd1bmRlZmluZWQnICYmIFN5bWJvbC50b1N0cmluZ1RhZykge1xuXHRcdE9iamVjdC5kZWZpbmVQcm9wZXJ0eShleHBvcnRzLCBTeW1ib2wudG9TdHJpbmdUYWcsIHsgdmFsdWU6ICdNb2R1bGUnIH0pO1xuXHR9XG5cdE9iamVjdC5kZWZpbmVQcm9wZXJ0eShleHBvcnRzLCAnX19lc01vZHVsZScsIHsgdmFsdWU6IHRydWUgfSk7XG59OyIsIi8vIG5vIGJhc2VVUklcblxuLy8gb2JqZWN0IHRvIHN0b3JlIGxvYWRlZCBhbmQgbG9hZGluZyBjaHVua3Ncbi8vIHVuZGVmaW5lZCA9IGNodW5rIG5vdCBsb2FkZWQsIG51bGwgPSBjaHVuayBwcmVsb2FkZWQvcHJlZmV0Y2hlZFxuLy8gW3Jlc29sdmUsIHJlamVjdCwgUHJvbWlzZV0gPSBjaHVuayBsb2FkaW5nLCAwID0gY2h1bmsgbG9hZGVkXG52YXIgaW5zdGFsbGVkQ2h1bmtzID0ge1xuXHRcInJ1bnRpbWVcIjogMFxufTtcblxuLy8gbm8gY2h1bmsgb24gZGVtYW5kIGxvYWRpbmdcblxuLy8gbm8gcHJlZmV0Y2hpbmdcblxuLy8gbm8gcHJlbG9hZGVkXG5cbi8vIG5vIEhNUlxuXG4vLyBubyBITVIgbWFuaWZlc3RcblxuX193ZWJwYWNrX3JlcXVpcmVfXy5PLmogPSAoY2h1bmtJZCkgPT4gKGluc3RhbGxlZENodW5rc1tjaHVua0lkXSA9PT0gMCk7XG5cbi8vIGluc3RhbGwgYSBKU09OUCBjYWxsYmFjayBmb3IgY2h1bmsgbG9hZGluZ1xudmFyIHdlYnBhY2tKc29ucENhbGxiYWNrID0gKHBhcmVudENodW5rTG9hZGluZ0Z1bmN0aW9uLCBkYXRhKSA9PiB7XG5cdHZhciBbY2h1bmtJZHMsIG1vcmVNb2R1bGVzLCBydW50aW1lXSA9IGRhdGE7XG5cdC8vIGFkZCBcIm1vcmVNb2R1bGVzXCIgdG8gdGhlIG1vZHVsZXMgb2JqZWN0LFxuXHQvLyB0aGVuIGZsYWcgYWxsIFwiY2h1bmtJZHNcIiBhcyBsb2FkZWQgYW5kIGZpcmUgY2FsbGJhY2tcblx0dmFyIG1vZHVsZUlkLCBjaHVua0lkLCBpID0gMDtcblx0aWYoY2h1bmtJZHMuc29tZSgoaWQpID0+IChpbnN0YWxsZWRDaHVua3NbaWRdICE9PSAwKSkpIHtcblx0XHRmb3IobW9kdWxlSWQgaW4gbW9yZU1vZHVsZXMpIHtcblx0XHRcdGlmKF9fd2VicGFja19yZXF1aXJlX18ubyhtb3JlTW9kdWxlcywgbW9kdWxlSWQpKSB7XG5cdFx0XHRcdF9fd2VicGFja19yZXF1aXJlX18ubVttb2R1bGVJZF0gPSBtb3JlTW9kdWxlc1ttb2R1bGVJZF07XG5cdFx0XHR9XG5cdFx0fVxuXHRcdGlmKHJ1bnRpbWUpIHZhciByZXN1bHQgPSBydW50aW1lKF9fd2VicGFja19yZXF1aXJlX18pO1xuXHR9XG5cdGlmKHBhcmVudENodW5rTG9hZGluZ0Z1bmN0aW9uKSBwYXJlbnRDaHVua0xvYWRpbmdGdW5jdGlvbihkYXRhKTtcblx0Zm9yKDtpIDwgY2h1bmtJZHMubGVuZ3RoOyBpKyspIHtcblx0XHRjaHVua0lkID0gY2h1bmtJZHNbaV07XG5cdFx0aWYoX193ZWJwYWNrX3JlcXVpcmVfXy5vKGluc3RhbGxlZENodW5rcywgY2h1bmtJZCkgJiYgaW5zdGFsbGVkQ2h1bmtzW2NodW5rSWRdKSB7XG5cdFx0XHRpbnN0YWxsZWRDaHVua3NbY2h1bmtJZF1bMF0oKTtcblx0XHR9XG5cdFx0aW5zdGFsbGVkQ2h1bmtzW2NodW5rSWRdID0gMDtcblx0fVxuXHRyZXR1cm4gX193ZWJwYWNrX3JlcXVpcmVfXy5PKHJlc3VsdCk7XG59XG5cbnZhciBjaHVua0xvYWRpbmdHbG9iYWwgPSBzZWxmW1wid2VicGFja0NodW5rdG9fZG9fbGlzdFwiXSA9IHNlbGZbXCJ3ZWJwYWNrQ2h1bmt0b19kb19saXN0XCJdIHx8IFtdO1xuY2h1bmtMb2FkaW5nR2xvYmFsLmZvckVhY2god2VicGFja0pzb25wQ2FsbGJhY2suYmluZChudWxsLCAwKSk7XG5jaHVua0xvYWRpbmdHbG9iYWwucHVzaCA9IHdlYnBhY2tKc29ucENhbGxiYWNrLmJpbmQobnVsbCwgY2h1bmtMb2FkaW5nR2xvYmFsLnB1c2guYmluZChjaHVua0xvYWRpbmdHbG9iYWwpKTsiLCJfX3dlYnBhY2tfcmVxdWlyZV9fLm5jID0gdW5kZWZpbmVkOyIsIiIsIiIsIiJdLCJuYW1lcyI6W10sInNvdXJjZVJvb3QiOiIifQ==
--------------------------------------------------------------------------------
/dist/index.bundle.js:
--------------------------------------------------------------------------------
1 | "use strict";
2 | (self["webpackChunkto_do_list"] = self["webpackChunkto_do_list"] || []).push([["index"],{
3 |
4 | /***/ "./node_modules/css-loader/dist/cjs.js!./src/style.css":
5 | /*!*************************************************************!*\
6 | !*** ./node_modules/css-loader/dist/cjs.js!./src/style.css ***!
7 | \*************************************************************/
8 | /***/ ((module, __webpack_exports__, __webpack_require__) => {
9 |
10 | __webpack_require__.r(__webpack_exports__);
11 | /* harmony export */ __webpack_require__.d(__webpack_exports__, {
12 | /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
13 | /* harmony export */ });
14 | /* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/sourceMaps.js */ "./node_modules/css-loader/dist/runtime/sourceMaps.js");
15 | /* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
16 | /* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js");
17 | /* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);
18 | // Imports
19 |
20 |
21 | var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
22 | ___CSS_LOADER_EXPORT___.push([module.id, "@import url(https://fonts.googleapis.com/css2?family=Dancing+Script&family=Lato&family=Nunito:ital,wght@0,200;0,300;0,500;0,600;0,700;1,200;1,300;1,700;1,900&family=Poppins:wght@300&family=Roboto:ital,wght@0,300;0,500;0,700;1,300;1,400;1,500&display=swap);"]);
23 | // Module
24 | ___CSS_LOADER_EXPORT___.push([module.id, "* {\r\n padding: 0;\r\n margin: 0;\r\n box-sizing: border-box;\r\n}\r\n\r\nbody {\r\n font-family: 'Roboto', sans-serif;\r\n font-size: 16px;\r\n}\r\n\r\n.container {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n width: 80%;\r\n position: relative;\r\n margin: 80px auto;\r\n background-color: rgb(231, 230, 230);\r\n}\r\n\r\n.header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n padding: 10px 10px;\r\n border-bottom: 2px solid rgba(0, 0, 0, 0.4);\r\n}\r\n\r\n.header p {\r\n font-size: 18px;\r\n font-weight: 600;\r\n}\r\n\r\n.arrow-img {\r\n font-size: 30px;\r\n color: rgba(0, 0, 0, 0.7);\r\n cursor: pointer;\r\n}\r\n\r\n.form {\r\n display: flex;\r\n justify-content: space-between;\r\n padding: 10px 10px;\r\n border-bottom: 2px solid rgba(0, 0, 0, 0.3);\r\n}\r\n\r\n#todo-input {\r\n width: 90%;\r\n padding-top: 5px;\r\n padding-bottom: 5px;\r\n background-color: inherit;\r\n border: none;\r\n outline: none;\r\n}\r\n\r\ninput::placeholder {\r\n font-style: italic;\r\n font-weight: 500;\r\n}\r\n\r\n.to-do-holder {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n padding: 10px 0;\r\n}\r\n\r\n.todo {\r\n display: flex;\r\n gap: 10px;\r\n padding-top: 13px;\r\n font-weight: 400;\r\n padding-bottom: 7px;\r\n border-bottom: 2px solid rgba(0, 0, 0, 0.3);\r\n}\r\n\r\n.Edit,\r\n.delete {\r\n margin-left: 100%;\r\n position: absolute;\r\n right: 10px;\r\n cursor: pointer;\r\n font-size: 24px;\r\n}\r\n\r\n.delete {\r\n display: none;\r\n}\r\n\r\ni.show {\r\n display: flex;\r\n}\r\n\r\ni.hide {\r\n display: none;\r\n}\r\n\r\n.list-text {\r\n outline: none;\r\n}\r\n\r\n.checkbox {\r\n margin-left: 10px;\r\n cursor: pointer;\r\n}\r\n\r\n.checkbox:checked + .list-text {\r\n text-decoration: line-through;\r\n color: rebeccapurple;\r\n font-style: italic;\r\n font-size: 17px;\r\n font-weight: 500;\r\n}\r\n\r\n.clear-btn {\r\n padding: 15px 20px;\r\n cursor: pointer;\r\n border: none;\r\n margin-top: -9px;\r\n background-color: rgb(189, 189, 189);\r\n font-size: 20px;\r\n}\r\n", "",{"version":3,"sources":["webpack://./src/style.css"],"names":[],"mappings":"AAEA;EACE,UAAU;EACV,SAAS;EACT,sBAAsB;AACxB;;AAEA;EACE,iCAAiC;EACjC,eAAe;AACjB;;AAEA;EACE,aAAa;EACb,sBAAsB;EACtB,8BAA8B;EAC9B,UAAU;EACV,kBAAkB;EAClB,iBAAiB;EACjB,oCAAoC;AACtC;;AAEA;EACE,aAAa;EACb,8BAA8B;EAC9B,mBAAmB;EACnB,kBAAkB;EAClB,2CAA2C;AAC7C;;AAEA;EACE,eAAe;EACf,gBAAgB;AAClB;;AAEA;EACE,eAAe;EACf,yBAAyB;EACzB,eAAe;AACjB;;AAEA;EACE,aAAa;EACb,8BAA8B;EAC9B,kBAAkB;EAClB,2CAA2C;AAC7C;;AAEA;EACE,UAAU;EACV,gBAAgB;EAChB,mBAAmB;EACnB,yBAAyB;EACzB,YAAY;EACZ,aAAa;AACf;;AAEA;EACE,kBAAkB;EAClB,gBAAgB;AAClB;;AAEA;EACE,aAAa;EACb,sBAAsB;EACtB,8BAA8B;EAC9B,eAAe;AACjB;;AAEA;EACE,aAAa;EACb,SAAS;EACT,iBAAiB;EACjB,gBAAgB;EAChB,mBAAmB;EACnB,2CAA2C;AAC7C;;AAEA;;EAEE,iBAAiB;EACjB,kBAAkB;EAClB,WAAW;EACX,eAAe;EACf,eAAe;AACjB;;AAEA;EACE,aAAa;AACf;;AAEA;EACE,aAAa;AACf;;AAEA;EACE,aAAa;AACf;;AAEA;EACE,aAAa;AACf;;AAEA;EACE,iBAAiB;EACjB,eAAe;AACjB;;AAEA;EACE,6BAA6B;EAC7B,oBAAoB;EACpB,kBAAkB;EAClB,eAAe;EACf,gBAAgB;AAClB;;AAEA;EACE,kBAAkB;EAClB,eAAe;EACf,YAAY;EACZ,gBAAgB;EAChB,oCAAoC;EACpC,eAAe;AACjB","sourcesContent":["@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Lato&family=Nunito:ital,wght@0,200;0,300;0,500;0,600;0,700;1,200;1,300;1,700;1,900&family=Poppins:wght@300&family=Roboto:ital,wght@0,300;0,500;0,700;1,300;1,400;1,500&display=swap');\r\n\r\n* {\r\n padding: 0;\r\n margin: 0;\r\n box-sizing: border-box;\r\n}\r\n\r\nbody {\r\n font-family: 'Roboto', sans-serif;\r\n font-size: 16px;\r\n}\r\n\r\n.container {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n width: 80%;\r\n position: relative;\r\n margin: 80px auto;\r\n background-color: rgb(231, 230, 230);\r\n}\r\n\r\n.header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n padding: 10px 10px;\r\n border-bottom: 2px solid rgba(0, 0, 0, 0.4);\r\n}\r\n\r\n.header p {\r\n font-size: 18px;\r\n font-weight: 600;\r\n}\r\n\r\n.arrow-img {\r\n font-size: 30px;\r\n color: rgba(0, 0, 0, 0.7);\r\n cursor: pointer;\r\n}\r\n\r\n.form {\r\n display: flex;\r\n justify-content: space-between;\r\n padding: 10px 10px;\r\n border-bottom: 2px solid rgba(0, 0, 0, 0.3);\r\n}\r\n\r\n#todo-input {\r\n width: 90%;\r\n padding-top: 5px;\r\n padding-bottom: 5px;\r\n background-color: inherit;\r\n border: none;\r\n outline: none;\r\n}\r\n\r\ninput::placeholder {\r\n font-style: italic;\r\n font-weight: 500;\r\n}\r\n\r\n.to-do-holder {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n padding: 10px 0;\r\n}\r\n\r\n.todo {\r\n display: flex;\r\n gap: 10px;\r\n padding-top: 13px;\r\n font-weight: 400;\r\n padding-bottom: 7px;\r\n border-bottom: 2px solid rgba(0, 0, 0, 0.3);\r\n}\r\n\r\n.Edit,\r\n.delete {\r\n margin-left: 100%;\r\n position: absolute;\r\n right: 10px;\r\n cursor: pointer;\r\n font-size: 24px;\r\n}\r\n\r\n.delete {\r\n display: none;\r\n}\r\n\r\ni.show {\r\n display: flex;\r\n}\r\n\r\ni.hide {\r\n display: none;\r\n}\r\n\r\n.list-text {\r\n outline: none;\r\n}\r\n\r\n.checkbox {\r\n margin-left: 10px;\r\n cursor: pointer;\r\n}\r\n\r\n.checkbox:checked + .list-text {\r\n text-decoration: line-through;\r\n color: rebeccapurple;\r\n font-style: italic;\r\n font-size: 17px;\r\n font-weight: 500;\r\n}\r\n\r\n.clear-btn {\r\n padding: 15px 20px;\r\n cursor: pointer;\r\n border: none;\r\n margin-top: -9px;\r\n background-color: rgb(189, 189, 189);\r\n font-size: 20px;\r\n}\r\n"],"sourceRoot":""}]);
25 | // Exports
26 | /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
27 |
28 |
29 | /***/ }),
30 |
31 | /***/ "./node_modules/css-loader/dist/runtime/api.js":
32 | /*!*****************************************************!*\
33 | !*** ./node_modules/css-loader/dist/runtime/api.js ***!
34 | \*****************************************************/
35 | /***/ ((module) => {
36 |
37 |
38 |
39 | /*
40 | MIT License http://www.opensource.org/licenses/mit-license.php
41 | Author Tobias Koppers @sokra
42 | */
43 | module.exports = function (cssWithMappingToString) {
44 | var list = [];
45 |
46 | // return the list of modules as css string
47 | list.toString = function toString() {
48 | return this.map(function (item) {
49 | var content = "";
50 | var needLayer = typeof item[5] !== "undefined";
51 | if (item[4]) {
52 | content += "@supports (".concat(item[4], ") {");
53 | }
54 | if (item[2]) {
55 | content += "@media ".concat(item[2], " {");
56 | }
57 | if (needLayer) {
58 | content += "@layer".concat(item[5].length > 0 ? " ".concat(item[5]) : "", " {");
59 | }
60 | content += cssWithMappingToString(item);
61 | if (needLayer) {
62 | content += "}";
63 | }
64 | if (item[2]) {
65 | content += "}";
66 | }
67 | if (item[4]) {
68 | content += "}";
69 | }
70 | return content;
71 | }).join("");
72 | };
73 |
74 | // import a list of modules into the list
75 | list.i = function i(modules, media, dedupe, supports, layer) {
76 | if (typeof modules === "string") {
77 | modules = [[null, modules, undefined]];
78 | }
79 | var alreadyImportedModules = {};
80 | if (dedupe) {
81 | for (var k = 0; k < this.length; k++) {
82 | var id = this[k][0];
83 | if (id != null) {
84 | alreadyImportedModules[id] = true;
85 | }
86 | }
87 | }
88 | for (var _k = 0; _k < modules.length; _k++) {
89 | var item = [].concat(modules[_k]);
90 | if (dedupe && alreadyImportedModules[item[0]]) {
91 | continue;
92 | }
93 | if (typeof layer !== "undefined") {
94 | if (typeof item[5] === "undefined") {
95 | item[5] = layer;
96 | } else {
97 | item[1] = "@layer".concat(item[5].length > 0 ? " ".concat(item[5]) : "", " {").concat(item[1], "}");
98 | item[5] = layer;
99 | }
100 | }
101 | if (media) {
102 | if (!item[2]) {
103 | item[2] = media;
104 | } else {
105 | item[1] = "@media ".concat(item[2], " {").concat(item[1], "}");
106 | item[2] = media;
107 | }
108 | }
109 | if (supports) {
110 | if (!item[4]) {
111 | item[4] = "".concat(supports);
112 | } else {
113 | item[1] = "@supports (".concat(item[4], ") {").concat(item[1], "}");
114 | item[4] = supports;
115 | }
116 | }
117 | list.push(item);
118 | }
119 | };
120 | return list;
121 | };
122 |
123 | /***/ }),
124 |
125 | /***/ "./node_modules/css-loader/dist/runtime/sourceMaps.js":
126 | /*!************************************************************!*\
127 | !*** ./node_modules/css-loader/dist/runtime/sourceMaps.js ***!
128 | \************************************************************/
129 | /***/ ((module) => {
130 |
131 |
132 |
133 | module.exports = function (item) {
134 | var content = item[1];
135 | var cssMapping = item[3];
136 | if (!cssMapping) {
137 | return content;
138 | }
139 | if (typeof btoa === "function") {
140 | var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(cssMapping))));
141 | var data = "sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(base64);
142 | var sourceMapping = "/*# ".concat(data, " */");
143 | return [content].concat([sourceMapping]).join("\n");
144 | }
145 | return [content].join("\n");
146 | };
147 |
148 | /***/ }),
149 |
150 | /***/ "./src/style.css":
151 | /*!***********************!*\
152 | !*** ./src/style.css ***!
153 | \***********************/
154 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
155 |
156 | __webpack_require__.r(__webpack_exports__);
157 | /* harmony export */ __webpack_require__.d(__webpack_exports__, {
158 | /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
159 | /* harmony export */ });
160 | /* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js */ "./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js");
161 | /* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__);
162 | /* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/styleDomAPI.js */ "./node_modules/style-loader/dist/runtime/styleDomAPI.js");
163 | /* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__);
164 | /* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/insertBySelector.js */ "./node_modules/style-loader/dist/runtime/insertBySelector.js");
165 | /* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__);
166 | /* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js */ "./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js");
167 | /* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__);
168 | /* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/insertStyleElement.js */ "./node_modules/style-loader/dist/runtime/insertStyleElement.js");
169 | /* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__);
170 | /* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/styleTagTransform.js */ "./node_modules/style-loader/dist/runtime/styleTagTransform.js");
171 | /* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__);
172 | /* harmony import */ var _node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! !!../node_modules/css-loader/dist/cjs.js!./style.css */ "./node_modules/css-loader/dist/cjs.js!./src/style.css");
173 |
174 |
175 |
176 |
177 |
178 |
179 |
180 |
181 |
182 |
183 |
184 | var options = {};
185 |
186 | options.styleTagTransform = (_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default());
187 | options.setAttributes = (_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default());
188 |
189 | options.insert = _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default().bind(null, "head");
190 |
191 | options.domAPI = (_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default());
192 | options.insertStyleElement = (_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default());
193 |
194 | var update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default()(_node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__["default"], options);
195 |
196 |
197 |
198 |
199 | /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__["default"] && _node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__["default"].locals ? _node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__["default"].locals : undefined);
200 |
201 |
202 | /***/ }),
203 |
204 | /***/ "./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":
205 | /*!****************************************************************************!*\
206 | !*** ./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js ***!
207 | \****************************************************************************/
208 | /***/ ((module) => {
209 |
210 |
211 |
212 | var stylesInDOM = [];
213 |
214 | function getIndexByIdentifier(identifier) {
215 | var result = -1;
216 |
217 | for (var i = 0; i < stylesInDOM.length; i++) {
218 | if (stylesInDOM[i].identifier === identifier) {
219 | result = i;
220 | break;
221 | }
222 | }
223 |
224 | return result;
225 | }
226 |
227 | function modulesToDom(list, options) {
228 | var idCountMap = {};
229 | var identifiers = [];
230 |
231 | for (var i = 0; i < list.length; i++) {
232 | var item = list[i];
233 | var id = options.base ? item[0] + options.base : item[0];
234 | var count = idCountMap[id] || 0;
235 | var identifier = "".concat(id, " ").concat(count);
236 | idCountMap[id] = count + 1;
237 | var indexByIdentifier = getIndexByIdentifier(identifier);
238 | var obj = {
239 | css: item[1],
240 | media: item[2],
241 | sourceMap: item[3],
242 | supports: item[4],
243 | layer: item[5]
244 | };
245 |
246 | if (indexByIdentifier !== -1) {
247 | stylesInDOM[indexByIdentifier].references++;
248 | stylesInDOM[indexByIdentifier].updater(obj);
249 | } else {
250 | var updater = addElementStyle(obj, options);
251 | options.byIndex = i;
252 | stylesInDOM.splice(i, 0, {
253 | identifier: identifier,
254 | updater: updater,
255 | references: 1
256 | });
257 | }
258 |
259 | identifiers.push(identifier);
260 | }
261 |
262 | return identifiers;
263 | }
264 |
265 | function addElementStyle(obj, options) {
266 | var api = options.domAPI(options);
267 | api.update(obj);
268 |
269 | var updater = function updater(newObj) {
270 | if (newObj) {
271 | if (newObj.css === obj.css && newObj.media === obj.media && newObj.sourceMap === obj.sourceMap && newObj.supports === obj.supports && newObj.layer === obj.layer) {
272 | return;
273 | }
274 |
275 | api.update(obj = newObj);
276 | } else {
277 | api.remove();
278 | }
279 | };
280 |
281 | return updater;
282 | }
283 |
284 | module.exports = function (list, options) {
285 | options = options || {};
286 | list = list || [];
287 | var lastIdentifiers = modulesToDom(list, options);
288 | return function update(newList) {
289 | newList = newList || [];
290 |
291 | for (var i = 0; i < lastIdentifiers.length; i++) {
292 | var identifier = lastIdentifiers[i];
293 | var index = getIndexByIdentifier(identifier);
294 | stylesInDOM[index].references--;
295 | }
296 |
297 | var newLastIdentifiers = modulesToDom(newList, options);
298 |
299 | for (var _i = 0; _i < lastIdentifiers.length; _i++) {
300 | var _identifier = lastIdentifiers[_i];
301 |
302 | var _index = getIndexByIdentifier(_identifier);
303 |
304 | if (stylesInDOM[_index].references === 0) {
305 | stylesInDOM[_index].updater();
306 |
307 | stylesInDOM.splice(_index, 1);
308 | }
309 | }
310 |
311 | lastIdentifiers = newLastIdentifiers;
312 | };
313 | };
314 |
315 | /***/ }),
316 |
317 | /***/ "./node_modules/style-loader/dist/runtime/insertBySelector.js":
318 | /*!********************************************************************!*\
319 | !*** ./node_modules/style-loader/dist/runtime/insertBySelector.js ***!
320 | \********************************************************************/
321 | /***/ ((module) => {
322 |
323 |
324 |
325 | var memo = {};
326 | /* istanbul ignore next */
327 |
328 | function getTarget(target) {
329 | if (typeof memo[target] === "undefined") {
330 | var styleTarget = document.querySelector(target); // Special case to return head of iframe instead of iframe itself
331 |
332 | if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) {
333 | try {
334 | // This will throw an exception if access to iframe is blocked
335 | // due to cross-origin restrictions
336 | styleTarget = styleTarget.contentDocument.head;
337 | } catch (e) {
338 | // istanbul ignore next
339 | styleTarget = null;
340 | }
341 | }
342 |
343 | memo[target] = styleTarget;
344 | }
345 |
346 | return memo[target];
347 | }
348 | /* istanbul ignore next */
349 |
350 |
351 | function insertBySelector(insert, style) {
352 | var target = getTarget(insert);
353 |
354 | if (!target) {
355 | throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");
356 | }
357 |
358 | target.appendChild(style);
359 | }
360 |
361 | module.exports = insertBySelector;
362 |
363 | /***/ }),
364 |
365 | /***/ "./node_modules/style-loader/dist/runtime/insertStyleElement.js":
366 | /*!**********************************************************************!*\
367 | !*** ./node_modules/style-loader/dist/runtime/insertStyleElement.js ***!
368 | \**********************************************************************/
369 | /***/ ((module) => {
370 |
371 |
372 |
373 | /* istanbul ignore next */
374 | function insertStyleElement(options) {
375 | var element = document.createElement("style");
376 | options.setAttributes(element, options.attributes);
377 | options.insert(element, options.options);
378 | return element;
379 | }
380 |
381 | module.exports = insertStyleElement;
382 |
383 | /***/ }),
384 |
385 | /***/ "./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":
386 | /*!**********************************************************************************!*\
387 | !*** ./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js ***!
388 | \**********************************************************************************/
389 | /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
390 |
391 |
392 |
393 | /* istanbul ignore next */
394 | function setAttributesWithoutAttributes(styleElement) {
395 | var nonce = true ? __webpack_require__.nc : 0;
396 |
397 | if (nonce) {
398 | styleElement.setAttribute("nonce", nonce);
399 | }
400 | }
401 |
402 | module.exports = setAttributesWithoutAttributes;
403 |
404 | /***/ }),
405 |
406 | /***/ "./node_modules/style-loader/dist/runtime/styleDomAPI.js":
407 | /*!***************************************************************!*\
408 | !*** ./node_modules/style-loader/dist/runtime/styleDomAPI.js ***!
409 | \***************************************************************/
410 | /***/ ((module) => {
411 |
412 |
413 |
414 | /* istanbul ignore next */
415 | function apply(styleElement, options, obj) {
416 | var css = "";
417 |
418 | if (obj.supports) {
419 | css += "@supports (".concat(obj.supports, ") {");
420 | }
421 |
422 | if (obj.media) {
423 | css += "@media ".concat(obj.media, " {");
424 | }
425 |
426 | var needLayer = typeof obj.layer !== "undefined";
427 |
428 | if (needLayer) {
429 | css += "@layer".concat(obj.layer.length > 0 ? " ".concat(obj.layer) : "", " {");
430 | }
431 |
432 | css += obj.css;
433 |
434 | if (needLayer) {
435 | css += "}";
436 | }
437 |
438 | if (obj.media) {
439 | css += "}";
440 | }
441 |
442 | if (obj.supports) {
443 | css += "}";
444 | }
445 |
446 | var sourceMap = obj.sourceMap;
447 |
448 | if (sourceMap && typeof btoa !== "undefined") {
449 | css += "\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))), " */");
450 | } // For old IE
451 |
452 | /* istanbul ignore if */
453 |
454 |
455 | options.styleTagTransform(css, styleElement, options.options);
456 | }
457 |
458 | function removeStyleElement(styleElement) {
459 | // istanbul ignore if
460 | if (styleElement.parentNode === null) {
461 | return false;
462 | }
463 |
464 | styleElement.parentNode.removeChild(styleElement);
465 | }
466 | /* istanbul ignore next */
467 |
468 |
469 | function domAPI(options) {
470 | var styleElement = options.insertStyleElement(options);
471 | return {
472 | update: function update(obj) {
473 | apply(styleElement, options, obj);
474 | },
475 | remove: function remove() {
476 | removeStyleElement(styleElement);
477 | }
478 | };
479 | }
480 |
481 | module.exports = domAPI;
482 |
483 | /***/ }),
484 |
485 | /***/ "./node_modules/style-loader/dist/runtime/styleTagTransform.js":
486 | /*!*********************************************************************!*\
487 | !*** ./node_modules/style-loader/dist/runtime/styleTagTransform.js ***!
488 | \*********************************************************************/
489 | /***/ ((module) => {
490 |
491 |
492 |
493 | /* istanbul ignore next */
494 | function styleTagTransform(css, styleElement) {
495 | if (styleElement.styleSheet) {
496 | styleElement.styleSheet.cssText = css;
497 | } else {
498 | while (styleElement.firstChild) {
499 | styleElement.removeChild(styleElement.firstChild);
500 | }
501 |
502 | styleElement.appendChild(document.createTextNode(css));
503 | }
504 | }
505 |
506 | module.exports = styleTagTransform;
507 |
508 | /***/ }),
509 |
510 | /***/ "./src/index.js":
511 | /*!**********************!*\
512 | !*** ./src/index.js ***!
513 | \**********************/
514 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
515 |
516 | __webpack_require__.r(__webpack_exports__);
517 | /* harmony import */ var _style_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./style.css */ "./src/style.css");
518 | /* harmony import */ var _modules_CRUD_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./modules/CRUD.js */ "./src/modules/CRUD.js");
519 | /* harmony import */ var _modules_display_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./modules/display.js */ "./src/modules/display.js");
520 |
521 |
522 |
523 |
524 |
525 | /***/ }),
526 |
527 | /***/ "./src/modules/CRUD.js":
528 | /*!*****************************!*\
529 | !*** ./src/modules/CRUD.js ***!
530 | \*****************************/
531 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
532 |
533 | __webpack_require__.r(__webpack_exports__);
534 | /* harmony import */ var _display_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./display.js */ "./src/modules/display.js");
535 |
536 |
537 | const form = document.querySelector('.form');
538 | const todoInput = document.querySelector('#todo-input');
539 | const arrow = document.querySelector('.arrow-img');
540 | /* eslint-disable no-use-before-define */
541 | form.addEventListener('submit', (e) => {
542 | e.preventDefault();
543 | saveTodo();
544 | (0,_display_js__WEBPACK_IMPORTED_MODULE_0__.displaytasks)();
545 | localStorage.setItem('tasks', JSON.stringify(_display_js__WEBPACK_IMPORTED_MODULE_0__.tasks));
546 | });
547 |
548 | arrow.addEventListener('click', () => {
549 | saveTodo();
550 | (0,_display_js__WEBPACK_IMPORTED_MODULE_0__.displaytasks)();
551 | localStorage.setItem('tasks', JSON.stringify(_display_js__WEBPACK_IMPORTED_MODULE_0__.tasks));
552 | });
553 |
554 | // Save todo function
555 | const saveTodo = (todoIndex = null, todoValue = todoInput.value) => {
556 | if (todoIndex !== null) {
557 | _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks[todoIndex].description = todoValue;
558 | } else {
559 | const index = _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks.length + 1;
560 | _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks.push({
561 | description: todoValue,
562 | completed: false,
563 | index,
564 | });
565 | }
566 |
567 | todoInput.value = '';
568 | };
569 |
570 | // eventlistener for all Tasks
571 | _display_js__WEBPACK_IMPORTED_MODULE_0__.listContainer.addEventListener('click', (e) => {
572 | const { target } = e;
573 | const parentElement = target.parentNode;
574 | if (parentElement.className !== 'todo') {
575 | return;
576 | }
577 | // todo id
578 | const todo = parentElement;
579 | const todoId = Number(todo.id);
580 | // target action
581 | const actions = target.dataset.action;
582 | if (actions === 'edit') {
583 | editTodo(todoId);
584 | } else if (actions === 'delete') {
585 | deleteTodo(todoId);
586 | } else if (actions === 'check') {
587 | checkTodo(todoId);
588 | }
589 | });
590 |
591 | const editTodo = (todoId) => {
592 | const container = document.getElementById(todoId);
593 | const taskDescription = container.querySelector('.list-text');
594 | const editIcon = container.querySelector('.Edit');
595 | const deleteIcon = container.querySelector('.delete');
596 | taskDescription.contentEditable = true;
597 | taskDescription.focus();
598 | editIcon.classList.add('hide');
599 | deleteIcon.classList.add('show');
600 | taskDescription.addEventListener('keydown', (e) => {
601 | if (e.key === 'Enter') {
602 | e.preventDefault();
603 | saveTodo(todoId - 1, taskDescription.textContent);
604 | (0,_display_js__WEBPACK_IMPORTED_MODULE_0__.displaytasks)();
605 | localStorage.setItem('tasks', JSON.stringify(_display_js__WEBPACK_IMPORTED_MODULE_0__.tasks));
606 | taskDescription.contentEditable = false;
607 | editIcon.classList.remove('hide');
608 | deleteIcon.classList.remove('show');
609 | }
610 | });
611 | };
612 |
613 | const deleteTodo = (todoId) => {
614 | _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks.splice(todoId - 1, 1); // remove one element at index todoId - 1
615 | const todoElement = document.getElementById(todoId);
616 | todoElement.parentNode.removeChild(todoElement);
617 | for (let i = 0; i < _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks.length; i += 1) {
618 | _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks[i].index = i + 1;
619 | }
620 | (0,_display_js__WEBPACK_IMPORTED_MODULE_0__.displaytasks)();
621 | localStorage.setItem('tasks', JSON.stringify(_display_js__WEBPACK_IMPORTED_MODULE_0__.tasks));
622 | };
623 |
624 | function checkTodo(todoId) {
625 | _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks.forEach((todo, index) => {
626 | if (index === todoId - 1) {
627 | todo.completed = !todo.completed;
628 | }
629 | });
630 | (0,_display_js__WEBPACK_IMPORTED_MODULE_0__.displaytasks)();
631 | localStorage.setItem('tasks', JSON.stringify(_display_js__WEBPACK_IMPORTED_MODULE_0__.tasks));
632 | }
633 |
634 | const btnClear = document.querySelector('.clear-btn');
635 | btnClear.addEventListener('click', () => {
636 | const incompleteTasks = _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks.filter((todo) => !todo.completed);
637 | _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks.length = 0; // clear the original tasks array
638 | _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks.push(...incompleteTasks); // add the incomplete tasks back to the original array
639 | for (let i = 0; i < _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks.length; i += 1) {
640 | _display_js__WEBPACK_IMPORTED_MODULE_0__.tasks[i].index = i + 1;
641 | }
642 | (0,_display_js__WEBPACK_IMPORTED_MODULE_0__.displaytasks)();
643 | localStorage.setItem('tasks', JSON.stringify(_display_js__WEBPACK_IMPORTED_MODULE_0__.tasks));
644 | });
645 |
646 |
647 | /***/ }),
648 |
649 | /***/ "./src/modules/display.js":
650 | /*!********************************!*\
651 | !*** ./src/modules/display.js ***!
652 | \********************************/
653 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
654 |
655 | __webpack_require__.r(__webpack_exports__);
656 | /* harmony export */ __webpack_require__.d(__webpack_exports__, {
657 | /* harmony export */ "displaytasks": () => (/* binding */ displaytasks),
658 | /* harmony export */ "listContainer": () => (/* binding */ listContainer),
659 | /* harmony export */ "tasks": () => (/* binding */ tasks)
660 | /* harmony export */ });
661 | const listContainer = document.querySelector('.to-do-holder');
662 | const tasks = JSON.parse(localStorage.getItem('tasks')) || [];
663 | const displaytasks = () => {
664 | listContainer.innerHTML = '';
665 | tasks.forEach((todo) => {
666 | tasks.sort((a, b) => a.index - b.index);
667 | listContainer.innerHTML += `
668 |
669 |
671 |
${todo.description}
672 |
673 |
674 |