index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>To do list</title>
    <link rel="stylesheet" href="ressources\style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
    <link rel="icon" href="ressources\image\to-do-list.png">
    

</head>
<body>
    <div id="container">
        <div class="head">
            <div class="title">to do list</div>
            <div id="date"></div>
            <div class="add">
                <input id="input" type="text" placeholder="things to be done">
                <button id="btn">Add</button>
            </div>
        </div>
        <div class="content">
            <ul id = "ul">
                <!--<li>
                    <input type="checkbox">
                    <div class="task">Task1 </div>
                    <i class="fa-solid fa-trash-can"></i>
                </li>-->
                
                
                
            </ul>
        </div>
    </div>
    <div id="modal">
        <p>you should add something</p>
        <button id = "ok">OK</button>
    </div>
    <div id="modal_delete">
        <p>are you sure?</p>
        <button id = "yes">YES</button>
        <button id = "no">NO</button>
    </div>
    
</body>
<script src = "ressources\script.js"></script>
</html>