Skip to content

Commit

Permalink
fix: DE GPL flex banner styles [snapshots] (paypal#594)
Browse files Browse the repository at this point in the history
  • Loading branch information
@yeul
yeul committed Aug 24, 2021
1 parent 1be88b1 commit d5e613f
Show file tree
Hide file tree
Showing 14 changed files with 83 additions and 41 deletions.
4 changes: 2 additions & 2 deletions server/locale/DE/GPL/mutations/gpl_eqz-non-de.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ const flex = [
}`,
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 4.4vw;
font-size: 4vw;
}
}`,
`@media (min-aspect-ratio: 200 / 11) and (max-width: 650px) {
Expand All @@ -77,7 +77,7 @@ const flex = [
}`,
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 5.5vw;
font-size: 4vw;
}
}`,
`@media (min-aspect-ratio: 60/11) and (max-width: 323px) {
Expand Down
10 changes: 10 additions & 0 deletions server/locale/DE/GPL/mutations/gpl_eqz.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,16 @@ const flex = [
styles: [
`.message__headline > .tag--medium > span > span:last-child::after {
content: '.'
}`,
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 4.5vw;
}
}`,
`@media (min-aspect-ratio: 60/11) and (max-width: 323px) {
.message__headline {
font-size: 4.5vw;
}
}`
],
headline: [...headlineBreaks]
Expand Down
4 changes: 2 additions & 2 deletions server/locale/DE/GPL/mutations/gpl_gtz-non-de.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ const flex = [
addPeriod(),
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 4.4vw;
font-size: 4vw;
}
}`,
`@media (min-aspect-ratio: 60/11) and (max-width: 323px) {
Expand All @@ -81,7 +81,7 @@ const flex = [
addPeriod(),
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 5vw;
font-size: 4vw;
}
}`,
`@media (min-aspect-ratio: 60/11) and (max-width: 323px) {
Expand Down
14 changes: 13 additions & 1 deletion server/locale/DE/GPL/mutations/gpl_gtz.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,19 @@ const flex = [
[
'ratio:8x1',
{
styles: [addPeriod()],
styles: [
addPeriod(),
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 4.5vw;
}
}`,
`@media (min-aspect-ratio: 60/11) and (max-width: 323px) {
.message__headline {
font-size: 4.5vw;
}
}`
],
headline: [...headlineBreaks]
}
],
Expand Down
9 changes: 7 additions & 2 deletions server/locale/DE/GPL/mutations/gplq_eqz-non-de.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ const flex = [
}`,
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 4.4vw;
font-size: 4vw;
}
}`,
`@media (min-aspect-ratio: 200 / 11) and (max-width: 650px) {
Expand All @@ -69,9 +69,14 @@ const flex = [
'ratio:8x1',
{
styles: [
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 4vw;
}
}`,
`@media (min-aspect-ratio: 60/11) and (max-width: 323px) {
.message__headline {
font-size: 4.4vw;
font-size: 4vw;
}
}`
],
Expand Down
14 changes: 13 additions & 1 deletion server/locale/DE/GPL/mutations/gplq_eqz.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,19 @@ const flex = [
[
'ratio:8x1',
{
headline: [...headlineBreaks]
headline: [...headlineBreaks],
styles: [
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 4.5vw;
}
}`,
`@media (min-aspect-ratio: 60/11) and (max-width: 323px) {
.message__headline {
font-size: 4.5vw;
}
}`
]
}
],
...flexLogoMutations
Expand Down
22 changes: 14 additions & 8 deletions server/locale/DE/GPL/mutations/gplq_gtz-non-de.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,15 +77,21 @@ const flex = [
{
styles: [
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 5vw;
}
}`,
.message__headline {
font-size: 4vw;
}
}`,
`@media (min-aspect-ratio: 60/11) and (max-width: 323px) {
.message__headline {
font-size: 3.5vw;
}
}`
.locale--DE .message__logo:nth-of-type(1) {
width: 40%;
}
.locale--DE .message__logo:nth-of-type(2) {
display: none;
}
.message__headline {
font-size: 3.5vw;
}
}`
],
headline: [...headlineBreaks]
}
Expand Down
14 changes: 13 additions & 1 deletion server/locale/DE/GPL/mutations/gplq_gtz.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,19 @@ const flex = [
[
'ratio:8x1',
{
headline: [...headlineBreaks]
headline: [...headlineBreaks],
styles: [
`@media (min-aspect-ratio: 60 / 11) and (max-width: 374px) {
.message__headline {
font-size: 4.5vw;
}
}`,
`@media (min-aspect-ratio: 60/11) and (max-width: 323px) {
.message__headline {
font-size: 4.5vw;
}
}`
]
}
],
...flexLogoMutations
Expand Down
7 changes: 1 addition & 6 deletions server/locale/DE/GPL/styles/flex/base.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@
width: 27px;
display: inline-block;
margin-right: 10px;
margin-left: 5px;
}

.message__logo:nth-of-type(2) {
Expand Down Expand Up @@ -63,12 +64,6 @@
line-height: 1.5;
}

@media (min-width: 220px) {
.message__disclaimer {
font-size: 0.9rem;
}
}

.message__promo-container {
padding-right: 3px;
}
1 change: 1 addition & 0 deletions server/locale/DE/GPL/styles/flex/ratio--1x1.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
}
.message__logo-container {
width: 100%;
margin-left: -5px;
}
.message__logo:nth-of-type(1) {
width: 29px;
Expand Down
1 change: 1 addition & 0 deletions server/locale/DE/GPL/styles/flex/ratio--1x4.css
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
.message__logo-container {
width: 100%;
margin-left: -5px;
margin-top: 3%;
margin-bottom: 0;
}
Expand Down
5 changes: 2 additions & 3 deletions server/locale/DE/GPL/styles/flex/ratio--20x1.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,8 +20,7 @@
width: 55%;
}
.message__logo-container {
max-width: 12%;
margin-bottom: -4px;
max-width: 15%;
}
.message__messaging {
flex: unset;
Expand Down Expand Up @@ -49,7 +48,7 @@
}
.message__headline span.tag--xsmall {
display: inline;
font-size: 2.5vw;
font-size: 2vw;
}
.tag--default {
font-size: 0.6rem;
Expand Down
14 changes: 2 additions & 12 deletions server/locale/DE/GPL/styles/flex/ratio--6x1.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@
flex: 1 1 100%;
}
.message__logo-container {
width: 25%;
margin-left: 5px;
display: flex;
align-items: center;
flex: 1 0 16%;
Expand All @@ -27,7 +29,6 @@
}
.message__logo:nth-of-type(1) {
display: inline;
width: 45%;
}
.message__logo:nth-of-type(2) {
display: none;
Expand All @@ -46,14 +47,6 @@
.message__headline span.tag--medium {
display: none;
}
.message__logo:nth-of-type(1) {
margin: 0;
}
.message__logo-container {
flex: 0 0 15%;
margin-left: 0;
margin-right: 0;
}
.message__content {
padding: 0.5rem;
}
Expand All @@ -71,12 +64,9 @@
.message__logo:nth-of-type(2) {
display: inline;
}

.message__logo-container {
width: 35%;
max-width: unset;
min-width: unset;
flex: 0 0 20%;
margin-right: 14px;
}
}
5 changes: 2 additions & 3 deletions server/locale/DE/GPL/styles/flex/ratio--8x1.css
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
@media (min-aspect-ratio: 80/11) {
.message__headline {
font-size: 3.5vw;
font-size: 3vw;
display: inline;
line-height: 1.2em;
}
.message__logo:nth-of-type(2) {
display: inline-block;
width: 55%;
display: none;
}
}

Expand Down

0 comments on commit d5e613f

Please sign in to comment.