mirror of
https://github.com/bigchaindb/site.git
synced 2024-11-22 01:36:55 +01:00
add GDPR unit to newsletter form
This commit is contained in:
parent
118f458c3c
commit
799a412e5f
GPG Key ID:
606EEEF3C479A91F
6
_src/_assets/images/icon-heart-protect.svg
Normal file
6
_src/_assets/images/icon-heart-protect.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="23" height="26" viewBox="0 0 23 26">
|
||||
<g fill="none" transform="translate(1 .861)">
|
||||
<path d="M10.501,17.211 C10.501,17.211 16.29,13.043 16.29,9.955 C16.29,6.391 11.553,5.266 10.501,9.598 C9.447,5.266 4.71,6.391 4.71,9.955 C4.71,13.043 10.501,17.211 10.501,17.211 Z"/>
|
||||
<path stroke="currentColor" d="M10.508,0.5 L10.491,0.5 C8,2.997 0.5,5.021 0.5,5.021 C0.5,12.983 1,19.983 10.5,23.5 C20,19.982 20.5,12.982 20.5,5.021 C20.5,5.021 13,2.997 10.508,0.5 Z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 524 B |
@ -90,3 +90,4 @@
|
||||
@import '_sections/section-partners';
|
||||
@import '_sections/section-blog';
|
||||
@import '_sections/section-getstarted';
|
||||
@import '_sections/section-newsletter';
|
||||
|
||||
85
_src/_assets/styles/_sections/_section-newsletter.scss
Normal file
85
_src/_assets/styles/_sections/_section-newsletter.scss
Normal file
@ -0,0 +1,85 @@
|
||||
|
||||
.section--newsletter {
|
||||
background: $brand-primary;
|
||||
align-items: flex-start;
|
||||
|
||||
.form-group,
|
||||
.grid { margin-bottom: 0; }
|
||||
|
||||
.form-control {
|
||||
border-color: $gray-dark;
|
||||
|
||||
&:focus {
|
||||
border-color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
background: $brand-main-blue;
|
||||
}
|
||||
|
||||
.form-label,
|
||||
.form-control,
|
||||
.form-control:focus ~ .form-label {
|
||||
color: $gray-dark;
|
||||
}
|
||||
|
||||
.form-control-feedback {
|
||||
@extend .bold;
|
||||
margin-top: $spacer / 2;
|
||||
}
|
||||
|
||||
.form--newsletter {
|
||||
margin-top: $spacer * 2;
|
||||
}
|
||||
}
|
||||
|
||||
.newsletter__title {
|
||||
@extend .h5;
|
||||
margin-top: 0;
|
||||
margin-bottom: $spacer / 4;
|
||||
}
|
||||
|
||||
.newsletter__title,
|
||||
.newsletter__text,
|
||||
.newsletter__gdpr {
|
||||
color: $gray-dark;
|
||||
}
|
||||
|
||||
.form__gdpr {
|
||||
opacity: .8;
|
||||
font-size: $font-size-sm;
|
||||
position: relative;
|
||||
|
||||
.icon {
|
||||
stroke: #fff;
|
||||
color: #fff;
|
||||
stroke-width: 1.5;
|
||||
opacity: .5;
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
position: absolute;
|
||||
left: -.25rem;
|
||||
top: .25rem;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-left: $spacer * 2;
|
||||
}
|
||||
}
|
||||
|
||||
.newsletter__gdpr {
|
||||
.icon {
|
||||
stroke: $brand-main-blue;
|
||||
color: $brand-main-blue;
|
||||
}
|
||||
|
||||
a {
|
||||
box-shadow: inset 0 -1px 0 $brand-main-blue;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background: $brand-main-blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -44,7 +44,6 @@
|
||||
@import 'bigchain/content-page';
|
||||
@import 'bigchain/comments';
|
||||
@import 'bigchain/toc';
|
||||
@import 'bigchain/newsletter';
|
||||
@import 'bigchain/testimonials';
|
||||
|
||||
// Section specific styles
|
||||
|
||||
@ -1,54 +0,0 @@
|
||||
|
||||
.section-newsletter {
|
||||
background: $brand-primary;
|
||||
|
||||
// .sections redefinitions
|
||||
padding-top: $spacer;
|
||||
padding-bottom: $spacer;
|
||||
|
||||
@media ($screen-sm) {
|
||||
padding-top: ($spacer * 3);
|
||||
padding-bottom: ($spacer * 3);
|
||||
}
|
||||
}
|
||||
|
||||
.newsletter {
|
||||
p,
|
||||
.form-group { margin: 0; }
|
||||
|
||||
.grid { margin-bottom: 0; }
|
||||
|
||||
.form-control {
|
||||
border-color: $gray-dark;
|
||||
|
||||
&:focus {
|
||||
border-color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
background: $brand-main-blue;
|
||||
}
|
||||
|
||||
.form-label,
|
||||
.form-control,
|
||||
.form-control:focus ~ .form-label {
|
||||
color: $gray-dark;
|
||||
}
|
||||
|
||||
.form-control-feedback {
|
||||
@extend .bold;
|
||||
margin-top: ($spacer / 2);
|
||||
}
|
||||
}
|
||||
|
||||
.newsletter__title {
|
||||
@extend .h5;
|
||||
margin-top: 0;
|
||||
margin-bottom: $spacer / 4;
|
||||
}
|
||||
|
||||
.newsletter__title,
|
||||
.newsletter__text {
|
||||
color: $gray-dark;
|
||||
}
|
||||
5
_src/_data/gdpr.yml
Normal file
5
_src/_data/gdpr.yml
Normal file
@ -0,0 +1,5 @@
|
||||
newsletter: >
|
||||
We will only use your email to send you our newsletter and by submitting this form you give us permission to do so. You can change your mind at anytime by clicking the unsubscribe link of any newsletter you receive from us. For more information visit our [Privacy Policy](/pivacy/).
|
||||
|
||||
|
||||
We use Formspree to send this form and MailChimp for our newsletter. By submitting this form, you acknowledge that the information you provide will be transferred to Formspree & MailChimp for processing in accordance with their [Privacy](https://formspree.io/static/PrivacyPolicy.pdf) [Policies](https://mailchimp.com/legal/privacy/).
|
||||
@ -1,5 +1,5 @@
|
||||
<form id="newsletter"
|
||||
class="form-newsletter js-parsley"
|
||||
class="form--newsletter js-parsley"
|
||||
action="//ascribe.us9.list-manage.com/subscribe/post?u=56f2d3da26a7d407177d3fba3&id=0a99a9481e"
|
||||
method="post">
|
||||
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
|
||||
<section class="section section-newsletter newsletter">
|
||||
<section class="section section--newsletter">
|
||||
<div class="row row--wide">
|
||||
|
||||
<div class="grid grid--full grid-small--half grid--gutters grid--center">
|
||||
<div class="grid grid--full grid-medium--half grid--gutters grid--center">
|
||||
<div class="grid__col">
|
||||
<h1 class="newsletter__title">
|
||||
{% if page.newsletter.title %}
|
||||
@ -18,10 +18,19 @@
|
||||
No more than one email per month. We're busy too.
|
||||
{% endif %}
|
||||
</p>
|
||||
|
||||
{% include form-newsletter.html %}
|
||||
</div>
|
||||
<div class="grid__col">
|
||||
|
||||
{% include form-newsletter.html %}
|
||||
<div class="form__gdpr newsletter__gdpr">
|
||||
<svg class="icon">
|
||||
<use xlink:href="/assets/img/sprite.svg#icon-heart-protect"></use>
|
||||
</svg>
|
||||
<div class="text">
|
||||
{{ site.data.gdpr.newsletter | markdownify }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user