├── .gitattributes ├── css └── style.css ├── home.html └── script └── script.js /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /css/style.css: -------------------------------------------------------------------------------- 1 | .coolTitle { 2 | text-align: center; 3 | font-family: 'Oswald', Helvetica, sans-serif; 4 | font-size: 40px; 5 | transform: skewY(-10deg); 6 | letter-spacing: 4px; 7 | word-spacing: -8px; 8 | color: tomato; 9 | text-shadow: 10 | -1px -1px 0 firebrick, 11 | -2px -2px 0 firebrick, 12 | -3px -3px 0 firebrick, 13 | -4px -4px 0 firebrick, 14 | -5px -5px 0 firebrick, 15 | -6px -6px 0 firebrick, 16 | -7px -7px 0 firebrick, 17 | -8px -8px 0 firebrick, 18 | -30px 20px 40px dimgrey; 19 | } 20 | 21 | .done { 22 | text-decoration: line-through; 23 | } -------------------------------------------------------------------------------- /home.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | javascript 5 | 6 | 7 | 8 | 9 |

Shopping List

10 |

Get it done today

11 | 12 | 13 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /script/script.js: -------------------------------------------------------------------------------- 1 | var button = document.getElementById('enter'); 2 | var input = document.getElementById('userinput'); 3 | var ul = document.querySelector('ul'); 4 | var li = document.getElementsByTagName('li') 5 | 6 | button.addEventListener('click', Onclick); 7 | input.addEventListener('keypress', addElement); 8 | 9 | 10 | liEvent(); 11 | buttonListElement(); 12 | 13 | function checkInputlength(){ 14 | return input.value.length; 15 | } 16 | 17 | 18 | function createListElement(){ 19 | 20 | var li = document.createElement("li"); 21 | var button = document.createElement('button'); 22 | li.appendChild(document.createTextNode(input.value)); 23 | ul.appendChild(li); 24 | li.appendChild(button) 25 | button.innerHTML = "delete"; 26 | input.value = ""; 27 | 28 | liEvent(); 29 | buttonListElement(); 30 | } 31 | 32 | 33 | 34 | function Onclick(){ 35 | 36 | if(checkInputlength() > 0){ 37 | createListElement(); 38 | } 39 | 40 | } 41 | 42 | 43 | function addElement(){ 44 | 45 | if(checkInputlength() > 0 && event.keyCode === 13){ 46 | createListElement(); 47 | } 48 | } 49 | 50 | function liEvent(){ 51 | for( i=0; i