From 77f907302843c65aa0babb9c05cccf5fa4dfdb8c Mon Sep 17 00:00:00 2001 From: Aviance Obie Date: Mon, 7 Mar 2022 16:48:35 -0600 Subject: [PATCH 1/2] updated updated files using DOM --- src/index.js | 123 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 123 insertions(+) diff --git a/src/index.js b/src/index.js index e3fb5d7143..96321f9e60 100644 --- a/src/index.js +++ b/src/index.js @@ -40,3 +40,126 @@ const siteContent = { // DO NOT CHANGE THIS OBJECT }; console.log('project wired!') + +//nav +const headerNav = document.querySelector('header nav'); + +const servicesNav = headerNav.querySelector('a:nth-of-type(1)'); +servicesNav.textContent = siteContent['nav']['nav-item-1']; +servicesNav.classList.add('italic'); + +const productNav = headerNav.querySelector('a:nth-of-type(2)') +productNav.textContent = siteContent['nav']['nav-item-2'] +productNav.classList.add('italic') + +const visionNav = headerNav.querySelector('a:nth-of-type(3)') +visionNav.textContent = siteContent['nav']['nav-item-3'] +visionNav.classList.add('italic') + +const featuresNav = headerNav.querySelector('a:nth-of-type(4)') +featuresNav.textContent = siteContent['nav']['nav-item-4'] +featuresNav.classList.add('italic') + +const aboutNav = headerNav.querySelector('a:nth-of-type(5)') +aboutNav.textContent = siteContent['nav']['nav-item-5'] +aboutNav.classList.add('italic') + +const contactNav = headerNav.querySelector('a:nth-of-type(6)') +contactNav.textContent = siteContent['nav']['nav-item-6'] +contactNav.classList.add('italic') + + +//cta +const cta = document.querySelector('.cta-text') + +const ctaHeader = cta.querySelector('h1') +ctaHeader.textContent = siteContent['cta']['h1'] + +const ctaButton = cta.querySelector('button') +ctaButton.textContent = siteContent['cta']['button'] + + +//upper content +const mainContent = document.querySelector('.main-content') +const upperContent = mainContent.children[0] + +//features +const features = upperContent.children[0] + +const featuresH4 = features.querySelector('h4') +featuresH4.textContent = siteContent['main-content']['features-h4'] + +const featuresText = features.querySelector('p') +featuresText.textContent = siteContent['main-content']['features-content'] + +//about +const about = upperContent.children[1] + +const aboutH4 = about.querySelector('h4') +aboutH4.textContent = siteContent['main-content']['about-h4'] + +const aboutText = about.querySelector('p') +aboutText.textContent = siteContent['main-content']['about-content'] + + +//lower content +const lowerContent = mainContent.children[2] + +//services +const services = lowerContent.children[0] + +const servicesH4 = services.querySelector('h4') +servicesH4.textContent = siteContent['main-content']['services-h4'] + +const servicesText = services.querySelector('p') +servicesText.textContent = siteContent['main-content']['services-content'] + +//product +const product = lowerContent.children[1] + +const productH4 = product.querySelector('h4') +productH4.textContent = siteContent['main-content']['product-h4'] + +const productText = product.querySelector('p') +productText.textContent = siteContent['main-content']['product-content'] + +//vision +const vision = lowerContent.children[2] + +const visionH4 = vision.querySelector('h4') +visionH4.textContent = siteContent['main-content']['vision-h4'] + +const visionText = vision.querySelector('p') +visionText.textContent = siteContent['main-content']['vision-content'] + +//contact +const contact = document.querySelector('.contact') + +const contactHeader = contact.querySelector('h4'); +contactHeader.textContent = siteContent['contact']['contact-h4']; + +const address = contact.querySelector('p:nth-of-type(1)') +address.textContent = siteContent['contact']['address']; + +const phone = contact.querySelector('p:nth-of-type(2)') +phone.textContent = siteContent['contact']['phone'] + +const email = contact.querySelector('p:nth-of-type(3)') +email.textContent = siteContent['contact']['email'] + +//footer +const footer = document.querySelector('footer') + +const footerLink = footer.querySelector('a') +footerLink.textContent = siteContent['footer']['copyright'] +footerLink.classList.add('bold') + +//images +const logoImg = document.querySelector('#logo-img') +logoImg.src = siteContent['images']['logo-img']; + +const ctaImg = document.querySelector('#cta-img') +ctaImg.src = siteContent['images']['cta-img'] + +const accentImg = document.querySelector('#middle-img'); +accentImg.src = siteContent['images']['accent-img']; \ No newline at end of file From 9cd5192d2e5b0f55c37a4f83d963c13d216f8b08 Mon Sep 17 00:00:00 2001 From: Aviance Obie Date: Mon, 7 Mar 2022 16:52:38 -0600 Subject: [PATCH 2/2] added newline at end of file --- src/index.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/index.js b/src/index.js index 96321f9e60..08275966d3 100644 --- a/src/index.js +++ b/src/index.js @@ -132,6 +132,7 @@ visionH4.textContent = siteContent['main-content']['vision-h4'] const visionText = vision.querySelector('p') visionText.textContent = siteContent['main-content']['vision-content'] + //contact const contact = document.querySelector('.contact') @@ -147,6 +148,7 @@ phone.textContent = siteContent['contact']['phone'] const email = contact.querySelector('p:nth-of-type(3)') email.textContent = siteContent['contact']['email'] + //footer const footer = document.querySelector('footer') @@ -154,6 +156,7 @@ const footerLink = footer.querySelector('a') footerLink.textContent = siteContent['footer']['copyright'] footerLink.classList.add('bold') + //images const logoImg = document.querySelector('#logo-img') logoImg.src = siteContent['images']['logo-img']; @@ -162,4 +165,5 @@ const ctaImg = document.querySelector('#cta-img') ctaImg.src = siteContent['images']['cta-img'] const accentImg = document.querySelector('#middle-img'); -accentImg.src = siteContent['images']['accent-img']; \ No newline at end of file +accentImg.src = siteContent['images']['accent-img']; +