diff --git a/dmp-frontend/src/app/ui/contact/contact-content/contact-content.component.html b/dmp-frontend/src/app/ui/contact/contact-content/contact-content.component.html index 63589d227..059ed608b 100644 --- a/dmp-frontend/src/app/ui/contact/contact-content/contact-content.component.html +++ b/dmp-frontend/src/app/ui/contact/contact-content/contact-content.component.html @@ -26,8 +26,8 @@
-
-
+
+
diff --git a/dmp-frontend/src/app/ui/contact/contact-content/contact-content.component.scss b/dmp-frontend/src/app/ui/contact/contact-content/contact-content.component.scss index 3b3dd0bb7..e4d7c4d28 100644 --- a/dmp-frontend/src/app/ui/contact/contact-content/contact-content.component.scss +++ b/dmp-frontend/src/app/ui/contact/contact-content/contact-content.component.scss @@ -22,3 +22,38 @@ img { .contact-actions { padding-right: 1em; } + +.send-btn { + background: #ffffff 0% 0% no-repeat padding-box; + border: 1px solid #129d99; + border-radius: 30px; + opacity: 1; + width: 101px; + height: 43px; + color: #129d99; + font-weight: 500; +} + +.send-btn-disabled { + width: 6.64em; + height: 2.93em; + background: #FFFFFF; + border: 1px solid #B5B5B5; + border-radius: 30px; + font-weight: bold; + letter-spacing: -0.35px; + color: #B5B5B5; + margin-bottom: 0.25em; + cursor: default; +} + +.cancel-btn { + background: #ffffff 0% 0% no-repeat padding-box; + border: 1px solid #B5B5B5; + border-radius: 30px; + opacity: 1; + width: 101px; + height: 43px; + color: #212121; + font-weight: 500; +} diff --git a/dmp-frontend/src/assets/splash/contact.html b/dmp-frontend/src/assets/splash/contact.html index 62f7616e6..7a0c03314 100644 --- a/dmp-frontend/src/assets/splash/contact.html +++ b/dmp-frontend/src/assets/splash/contact.html @@ -66,7 +66,9 @@
Contact
-
+ + +
Contact us to learn more
diff --git a/dmp-frontend/src/assets/splash/css/contact.css b/dmp-frontend/src/assets/splash/css/contact.css index 1b53a6a5d..71bd52e27 100644 --- a/dmp-frontend/src/assets/splash/css/contact.css +++ b/dmp-frontend/src/assets/splash/css/contact.css @@ -20,3 +20,11 @@ font-size: 1.12rem; color: #212121; } + +.hide { + position:absolute; + top:-1px; + left:-1px; + width:1px; + height:1px; +} diff --git a/dmp-frontend/src/assets/splash/js/scripts.js b/dmp-frontend/src/assets/splash/js/scripts.js index 724c64c44..3772e7d89 100644 --- a/dmp-frontend/src/assets/splash/js/scripts.js +++ b/dmp-frontend/src/assets/splash/js/scripts.js @@ -1,49 +1,49 @@ function toggleClass(ids, option) { - ids.forEach(id => { - var element = document.getElementById(id); - var className = element.getAttribute("class").replace(/ .*/, ''); - if (id === option) { - element.classList.replace(className, "selected"); - } else { - element.classList.replace(className, "not-selected"); - } - }) + ids.forEach(id => { + var element = document.getElementById(id); + var className = element.getAttribute("class").replace(/ .*/, ''); + if (id === option) { + element.classList.replace(className, "selected"); + } else { + element.classList.replace(className, "not-selected"); + } + }) } function navbarCollapse() { - var element = document.getElementById('nav'); - if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) { - element.classList.add("navbar-shrink"); - element.classList.add("fixed-top"); - } else { - element.classList.remove("navbar-shrink"); - element.classList.remove("fixed-top"); - } + var element = document.getElementById('nav'); + if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) { + element.classList.add("navbar-shrink"); + element.classList.add("fixed-top"); + } else { + element.classList.remove("navbar-shrink"); + element.classList.remove("fixed-top"); + } }; navbarCollapse(); window.onscroll = function () { navbarCollapse() }; function dropdownToggle(dropdownId) { - this.closeOpenDropdowns(); - document.getElementById(dropdownId).classList.toggle("show"); + this.closeOpenDropdowns(); + document.getElementById(dropdownId).classList.toggle("show"); } function closeOpenDropdowns() { - var dropdowns = document.getElementsByClassName("dropdown-content"); - var i; - for (i = 0; i < dropdowns.length; i++) { - var openDropdown = dropdowns[i]; - if (openDropdown.classList.contains('show')) { - openDropdown.classList.remove('show'); - } - } + var dropdowns = document.getElementsByClassName("dropdown-content"); + var i; + for (i = 0; i < dropdowns.length; i++) { + var openDropdown = dropdowns[i]; + if (openDropdown.classList.contains('show')) { + openDropdown.classList.remove('show'); + } + } } // Close the dropdown if the user clicks outside of it window.onclick = function (event) { - if (!event.target.matches('.dropbtn')) { - this.closeOpenDropdowns(); - } + if (!event.target.matches('.dropbtn')) { + this.closeOpenDropdowns(); + } } // Slideshow per 3 sec, stops on option click @@ -51,8 +51,10 @@ window.onload = function slideImages() { var x = -1; slides = setInterval(function displayNextImage() { x = (x === images.length - 1) ? 0 : x + 1; - document.getElementById('template-preview').src = images[x]; - toggleClass(['id1','id2','id3'], 'id'.concat((x + 1).toString())); + if (document.getElementById('template-preview')) { + document.getElementById('template-preview').src = images[x]; + toggleClass(['id1', 'id2', 'id3'], 'id'.concat((x + 1).toString())); + } }, 3000); } @@ -61,3 +63,8 @@ var images = []; images[0] = 'assets/img/template-preview-1.svg'; images[1] = 'assets/img/template-preview-2.svg'; images[2] = 'assets/img/template-preview-3.svg'; + + +function emailSend() { + alert("The form was submitted"); +}