Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- * {
- box-sizing: border-box;
- margin: 0;
- padding: 0;
- }
- :root {
- --deep-dark: rgb(26, 26, 26);
- --light-dark: rgb(79, 82, 92);
- --light-blue: rgb(0, 132, 255);
- --dark-blue: rgb(2, 84, 161);
- --light: rgb(245, 245, 245);
- --lighter-blue: rgb(9, 157, 243);
- }
- body {
- display: flex;
- justify-content: center;
- margin-top: 120px;
- font-family: 'Montserrat', sans-serif;
- background-color: var(--deep-dark);
- color: var(--light)}
- h2{
- text-align: center;
- margin-top: 20px;
- padding: 20px 0 10px 0;
- }
- p{
- padding: 20px;
- }
- .toDoInfo{
- text-align: center;
- margin: 20px;
- }
- .toDoBody{
- width: 600px;
- align-items: center;
- justify-content: center;
- }
- .top{
- background-color: var(--dark-blue);
- border-radius: 5px;
- }
- input{
- margin-left: 10px;
- }
- .toDoInput{
- width: 80%;
- padding: 10px 20px;
- margin-right: 20px;
- border: none;
- border-radius: 5px;
- color: var(--light-dark);
- background-color: var(--light);
- }
- .addBtn{
- border: none;
- border-radius: 5px;
- padding: 10px 20px;
- transition: .3s;
- }
- .addBtn:hover{
- color: var(--light);
- background-color: rgb(9, 157, 243);
- }
- .bottom{
- background-color: var(--light-blue);
- border-radius: 5px;
- margin: 20px;
- }
- ul{
- list-style-type: none;
- /* margin: 20px; */
- padding: 10px;
- }
- li{
- /* margin-top: 0; */
- margin: 10px;
- background-color: var(--lighter-blue);
- padding: 10px;
- border: none;
- border-radius: 5px;
- }
- .tools{
- display: inline;
- cursor: pointer;
- float: right;
- }
- button{
- cursor: pointer;
- }
- .fa-times{
- color: rgb(206, 37, 37);
- font-size: 20px;
- font-weight: bold;
- outline: none;
- transition: .3s;
- }
- .delete{
- cursor: pointer;
- background-color: transparent;
- border: none;
- outline:none;
- /* display: inline; */
- }
- .fa-times:hover{
- color: tomato;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement