diff --git a/README.md b/README.md index d24722b5..4eeb655b 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ 1. Replace `` with your Github username in the link - - [DEMO LINK](https://.github.io/js_task_fix_form_DOM/) + - [DEMO LINK](https://wsadocha.github.io/js_task_fix_form_DOM/) 2. Follow [this instructions](https://mate-academy.github.io/layout_task-guideline/) - Run `npm run test` command to test your code; - Run `npm run test:only -- -n` to run fast test ignoring linter; diff --git a/package-lock.json b/package-lock.json index 2df36c99..9c07d735 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1780,9 +1780,9 @@ "dev": true }, "@mate-academy/scripts": { - "version": "1.2.10", - "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-1.2.10.tgz", - "integrity": "sha512-BwkVjQfKiybLdpbrILq+bJvJWcROXJtR2CYNl7jACMt/Xrl5dJI3aArMOcX6t/pk+R668BPFaNf7wPRmKeXDLw==", + "version": "1.2.12", + "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-1.2.12.tgz", + "integrity": "sha512-ZXmhAzDKVVDqJmO8soZ7EUYDdWm5BkRL4iV4dKTnpUSrWuv3ch8dUmvXZnXhpE/ptP3JqkAb5lfS8CCCj8Yeng==", "dev": true, "requires": { "@octokit/rest": "^17.11.2", diff --git a/package.json b/package.json index 03efddb0..c7183d28 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,7 @@ "@mate-academy/bemlint": "^0.1.1", "@mate-academy/eslint-config": "*", "@mate-academy/linthtml-config": "*", - "@mate-academy/scripts": "^1.2.10", + "@mate-academy/scripts": "^1.2.12", "@mate-academy/stylelint-config": "0.0.11", "@parcel/transformer-sass": "2.10.2", "backstopjs": "^6.2.2", diff --git a/src/scripts/main.js b/src/scripts/main.js index a765fdb1..a2e9fe83 100644 --- a/src/scripts/main.js +++ b/src/scripts/main.js @@ -1,3 +1,32 @@ 'use strict'; // write code here +function capitalize(string) { + return string[0].toUpperCase() + string.slice(1); +} + +function makeWords(string) { + if (string.toLowerCase() === string) { + return string; + } + + for (let i = 0; i < string.length; i++) { + if (string[i].toLowerCase() !== string[i]) { + return string.split(`${string[i]}`).join(` ${string[i]}`); + } + } +} + +const inputs = document.querySelectorAll('input'); + +for (const input of inputs) { + const labelElement = document.createElement('label'); + const inputName = makeWords(input.name); + + labelElement.textContent = inputName; + labelElement.setAttribute('for', input.id); + labelElement.setAttribute('class', 'field-label'); + input.before(labelElement); + + input.setAttribute('placeholder', capitalize(inputName)); +}