{"id":854,"date":"2022-12-27T16:24:19","date_gmt":"2022-12-27T07:24:19","guid":{"rendered":"https:\/\/helpme.center\/?page_id=854"},"modified":"2022-12-27T18:03:52","modified_gmt":"2022-12-27T09:03:52","slug":"button-test","status":"publish","type":"page","link":"https:\/\/helpme.center\/en\/button-test\/","title":{"rendered":"Button test"},"content":{"rendered":"\n<script type=\"text\/javascript\">\ndocument.addEventListener('DOMContentLoaded', function () {\n  var btn = document.querySelector('.submit-button'),\n      loader = document.querySelector('.loader'),\n      check = document.querySelector('.check');\n  \n  btn.addEventListener('click', function () {\n    loader.classList.add('active');    \n  });\n \n  loader.addEventListener('animationend', function() {\n    check.classList.add('active'); \n  });\n});\n<\/script>\n\n<style>\n* {\n  box-sizing: border-box;\n}\n\n.embed-window-banner {\n  display: none!important\n}\n\n.inquiry-form-submit {\n  background-color: #fff;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n}\n\n.submit-button {\n    margin-top: 30px;\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    justify-content: center;\n    border: 0px;\n    outline: 0px;\n    cursor: pointer;\n    width: 280px;\n    height: 70px;\n    font-size: 22px;\n    color: #fff;\n    \/* font-family: 'NunitoSans-Bold'; *\/\n    text-decoration-line: none;\n    border-radius: 40px;\n    background-color: #2E75B6;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    outline: 0px;\n    cursor: pointer;\n}\n.submit-button:hover {\n    opacity: 0.9;\n    transition: all .1s ease-in-out;\n}\n\n.loader {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 50px;\n  height: 50px;\n  background: transparent; \n  margin: 30px auto 0 auto;\n  \/* border: solid 2px #424242; *\/\n  border: solid 2px #fff;\n  border-top: solid 2px #2E75B6;\n  border-radius: 50%;\n  opacity: 0;\n}\n\n.check {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  transform: translate3d(-4px,50px,0);\n  opacity: 0;\n}\n.check span:nth-child(1) {\n    display: block;\n    width: 10px;\n    height: 2px;\n    background-color: #2E75B6;\n    transform: rotate(45deg);\n}\n.check span:nth-child(2) {\n    display: block;\n    width: 20px;\n    height: 2px;\n    background-color: #2E75B6;\n    transform: rotate(-45deg) translate3d(14px, -4px, 0);\n    transform-origin: 100%;\n}\n\n.loader.active {\n  animation: loading 2s ease-in-out; \n  animation-fill-mode: forwards;\n}\n\n.check.active {\n  opacity: 1;\n  transform: translate3d(-4px,4px,0);\n  transition: all .5s cubic-bezier(.49, 1.4, .38, 1.4);\n  transition-delay: 0s;\n}\n\n@keyframes loading {\n  30% {\n    opacity:1; \n  }\n  \n  85% {\n    opacity:1;\n    transform: rotate(1080deg);\n    border-color: #2E75B6;\n  }\n  100% {\n    opacity:1;\n    transform: rotate(1080deg);\n    border-color: #2E75B6;\n  }\n}\n<\/style>\n\n<div class=\"inquiry-form-submit\">\n  <button class=\"submit-button\">Submit<\/button>\n  \n  <div class=\"loader\">\n    <div class=\"check\">\n      <span class=\"check-one\"><\/span>\n      <span class=\"check-two\"><\/span>\n    <\/div>\n  <\/div>\n  \n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Submit<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":89,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"inline_featured_image":false,"footnotes":""},"class_list":["post-854","page","type-page","status-publish","hentry"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/helpme.center\/wordpress\/wp-json\/wp\/v2\/pages\/854","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/helpme.center\/wordpress\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/helpme.center\/wordpress\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/helpme.center\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/helpme.center\/wordpress\/wp-json\/wp\/v2\/comments?post=854"}],"version-history":[{"count":41,"href":"https:\/\/helpme.center\/wordpress\/wp-json\/wp\/v2\/pages\/854\/revisions"}],"predecessor-version":[{"id":901,"href":"https:\/\/helpme.center\/wordpress\/wp-json\/wp\/v2\/pages\/854\/revisions\/901"}],"up":[{"embeddable":true,"href":"https:\/\/helpme.center\/wordpress\/wp-json\/wp\/v2\/pages\/89"}],"wp:attachment":[{"href":"https:\/\/helpme.center\/wordpress\/wp-json\/wp\/v2\/media?parent=854"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}