FilipeQuintanilha/vtex-cms-template-atualizado-Filipe-Quintanilha
1
0
Fork 0
forked from M3-Academy/vtex-cms-template-atualizado
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: Cria a newsletter mobile

Browse Source
This commit is contained in:
Filipe Quintanilha Evangelista 2022-12-08 13:54:26 -03:00
parent b2c2b39449
commit 750d9e6f97
1 changed files with 32 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/arquivos/sass/components/_newsletter.scss
View File

@ -1,5 +1,5 @@
.footer-newsletter {
padding: 24px;
padding: 24px 15px;
background: linear-gradient(180deg, $blue-500 0%, $blue-600 100%);
&__wrapper {
@ -12,25 +12,47 @@
font-size: 14px;
line-height: 17px;
color: $white-500;
@include mq(lg, max) {
max-width: 224px;
margin-bottom: 8px;
}
}
.m3-custom-newsletter-form {
display: flex;
align-items: center;
position: relative;
@include mq(lg, max) {
flex-direction: column;
}
@include mq(lg, min) {
align-items: center;
}
}
fieldset {
flex: 1;
margin: 0 16px 0 0;
margin: 0;
padding: 0;
@include mq(lg, max) {
margin-bottom: 8px;
}
@include mq(lg, min) {
margin-right: 16px;
}
&:last-of-type {
margin-right: 0;
margin: 0;
}
&.m3-cn-button-ok-container {
max-width: 126px;
@include mq(lg, min) {
max-width: 126px;
}
}
label {
@ -82,9 +104,14 @@
top: calc(100% + 8px);
left: 50%;
transform: translate(-50%);
width: fit-content;
line-height: 1;
font-weight: 700;
@include mq(lg, max) {
font-weight: 500;
}
.m3-cn-error {
color: $red-300;
}