<form class="form subscribe">
{% include '@form-label' with {
"label": label,
"for": id,
} %}
{% include '@input' with {
'id': id,
'type': 'email',
'name': id,
'required': true
} %}
{% include '@input-submit' with {
'value': text,
'modifier': 'button-secondary'
} %}
</form>
<form class="form subscribe">
<label for="subscribe">Email address
</label>
<input type="email" id="subscribe" name="subscribe" class="email" required="true" />
<button type="submit" class="button button- button-secondary">
Subscribe
</button>
</form>
{
"label": "Email address",
"text": "Subscribe",
"id": "subscribe",
"name": "subscribe"
}
.subscribe {
@include medium-text();
display: flex;
position: relative;
flex-wrap: wrap;
align-items: center;
h2,
h3 {
@include theme('color', 'color-zero', 'newsletter-title-color');
margin-bottom: 30px;
}
ul {
li {
@include medium-text();
}
}
p:last-child {
margin-bottom: 0;
}
label {
width: 100%;
max-width: 100%;
color: color('gray');
}
input {
border: 0;
}
input[type="email"] {
flex: 1 1 $bp-mobile;
margin-right: 8px;
}
input[type="submit"] {
@include button-medium;
}
}