completed mvp

.gitignore

@@ -119,3 +119,133 @@ dist
 
 # Mac cruft
 .DS_Store
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+.pnpm-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# Snowpack dependency directory (https://snowpack.dev/)
+web_modules/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional stylelint cache
+.stylelintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variable files
+.env
+.env.development.local
+.env.test.local
+.env.production.local
+.env.local
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+.parcel-cache
+
+# Next.js build output
+.next
+out
+
+# Nuxt.js build / generate output
+.nuxt
+dist
+
+# Gatsby files
+.cache/
+# Comment in the public line in if your project uses Gatsby and not Next.js
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# public
+
+# vuepress build output
+.vuepress/dist
+
+# vuepress v2.x temp and cache directory
+.temp
+.cache
+
+# Docusaurus cache and generated files
+.docusaurus
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test
+
+# yarn v2
+.yarn/cache
+.yarn/unplugged
+.yarn/build-state.yml
+.yarn/install-state.gz
+.pnp.*

README.md

@@ -12,26 +12,26 @@ Inside `src/index.js` there is declared an object literal containing all the dat
 
 ## Git Setup
 
-* [ ] Create a forked copy of this project.
-* [ ] Clone your OWN version of the repository.
-* [ ] Push commits: `git push origin main`.
+* [ x] Create a forked copy of this project.
+* [ x] Clone your OWN version of the repository.
+* [ x] Push commits: `git push origin main`.
 
 ## Running the project
 
-* [ ] Run `npm install` to download the project's dependencies.
-* [ ] Run `npm start` to launch the page on `http://localhost:3000`.
-* [ ] Run `npm test` to execute auto tests against your work (you'll need a new terminal window).
+* [x ] Run `npm install` to download the project's dependencies.
+* [x ] Run `npm start` to launch the page on `http://localhost:3000`.
+* [ x] Run `npm test` to execute auto tests against your work (you'll need a new terminal window).
 
 ## MVP
 
 ### Create selectors to access the relevant elements
 
-* [ ] Declare variables pointing to the relevant DOM elements, using any of the selectors you have learned.
+* [x ] Declare variables pointing to the relevant DOM elements, using any of the selectors you have learned.
 
 ### Add text contents
 
-* [ ] Using your selectors, update the text contents of the relevant elements, matching the design file.
-* [ ] Find the correct texts for the elements inside the data object in `src/index.js`.
+* [ x] Using your selectors, update the text contents of the relevant elements, matching the design file.
+* [ x] Find the correct texts for the elements inside the data object in `src/index.js`.
 
 ### Add class names
 
@@ -40,8 +40,8 @@ Inside `src/index.js` there is declared an object literal containing all the dat
 
 ### Add image sources
 
-* [ ] Make the img tags on the page display the correct images by editing their `src` attribute.
-* [ ] Find the correct URLs for the images inside the data object in `src/index.js`.
+* [x ] Make the img tags on the page display the correct images by editing their `src` attribute.
+* [ x] Find the correct URLs for the images inside the data object in `src/index.js`.
 
 ## Submission Format
 

src/index.html

@@ -69,4 +69,4 @@ <h4></h4>
   </div>
 </body>
 
-</html>
+</html>

src/index.js

@@ -39,4 +39,51 @@ const siteContent = { // DO NOT CHANGE THIS OBJECT
   },
 };
 
-console.log('project wired!')
+// images
+
+const logoImg = document.querySelector('#logo-img')
+logoImg.src = siteContent.images['logo-img']
+
+const ctaImg = document.querySelector('#cta-img')
+cta.src = siteContent.images['cta-img']
+
+const midImg = document.querySelector('#middle-img')
+midImg.setAttribute('src', siteContent.images['accent-img'])
+// footer link
+const footerLink = document.querySelector('footer a')
+footerLink.textContent = siteContent.footer.copyright
+footerLink.classList.add('bold')
+// contact
+const contact = document.querySelector('section.contact')
+contact.children[0].textContent = siteContent.contact['contact-h4']
+contact.children[1].textContent = siteContent.contact['address']
+contact.children[2].textContent = siteContent.contact['phone']
+contact.children[3].textContent = siteContent.contact['email']
+
+// top content
+const topContent = document.querySelector('.top-content')
+topContent.children[0].children[0].textContent = siteContent['main-content']['features-h4']
+topContent.children[0].children[1].textContent = siteContent['main-content']['features-content']
+topContent.children[1].children[0].textContent = siteContent['main-content']['about--h4']
+topContent.children[1].children[1].textContent = siteContent['main-content']['about-content']
+// bottom content
+const bottomContent = document.querySelector('.bottom-content')
+const h4Bottom = bottomContent.querySelectorAll('h4')
+h4Bottom[0].textContent = siteContent['main-content']['services-h4']
+h4Bottom[1].textContent = siteContent['main-content']['product-h4']
+h4Bottom[2].textContent = siteContent['main-content']['vision-h4']
+const pBottom = bottomContent.querySelectorAll('p')
+psBottom[0].textContent = siteContent['main-content']['services-content']
+psBottom[1].textContent = siteContent['main-content']['services-content']
+psBottom[2].textContent = siteContent['main-content']['services-content']
+
+// cta
+document.querySelector('.cta .cta-text h1').textContent = siteContent.cta.h1
+document.querySelector('.cta .cta-text button').textContent = siteContent.cta.button
+// nav links
+const navLinks = document.querySelectorAll('header nav a')
+const navLinksTexts = object.values(siteContent.nav)
+navLinks.forEach((link, idx) => {
+  link.textContent = navLinksTexts[idx]
+  link.classList.add('italic')
+})