diff --git a/less/astro/layout/_footer.less b/less/astro/layout/_footer.less index a4747eea033cb2c235bd36e700fd08a611ec0a02..3470e8acd9bd717153b9d064921feb262616d8f1 100644 --- a/less/astro/layout/_footer.less +++ b/less/astro/layout/_footer.less @@ -74,6 +74,23 @@ color: @brand-primary; } + .footer-end-newsletter-submit { + padding: 0; + outline-offset: 3px; + + &, + &:link, + &:visited { + color: #000; + } + + &:hover, + &:active, + &:focus { + color: @brand-primary; + } + } + .footer-end-newsletter-input-wrapper { display: flex; justify-content: space-between; diff --git a/stories/layout/footer.stories.ts b/stories/layout/footer.stories.ts index 1e080cfb269600c0e71f71b5092b5befcbd69158..a3ac1b45ee51b280ac754e3f93bb1fc69f2fa4a3 100644 --- a/stories/layout/footer.stories.ts +++ b/stories/layout/footer.stories.ts @@ -108,28 +108,18 @@ export const Footer: Story = { <div class="footer-end-newsletter"> <form id="mc-embedded-subscribe-form" - action="https://eclipsecon.us6.list-manage.com/subscribe/post" - method="post" - novalidate="" + action="https://eclipse.us6.list-manage.com/subscribe/post?u=eaf9e1f06f194eadc66788a85&id=e7538485cd&f_id=00f9c2e1f0" + method="post" target="_blank" + novalidate > <label class="footer-end-newsletter-label" for="email">Subscribe to our Newsletter</label> <div class="footer-end-newsletter-input-wrapper"> - <input - class="footer-end-newsletter-input" - type="email" - id="email" - name="EMAIL" - autocomplete="email" - placeholder="Enter your email address" - > - <div> + <input class="footer-end-newsletter-input" type="email" id="email" name="EMAIL" autocomplete="email" placeholder="Enter your email address" /> + <button class="footer-end-newsletter-submit btn btn-link" id="mc-embedded-subscribe" type="submit" name="subscribe"> <i class="fa fa-solid fa-envelope fa-lg" aria-hidden="true"></i> - </div> + </button> </div> - <input type="hidden" name="u" value="eaf9e1f06f194eadc66788a85"> - <input type="hidden" name="id" value="46e57eacf1"> - <input id="mc-embedded-subscribe" type="submit" name="subscribe" hidden=""> </form> </div> </div>