diff --git a/services/web/frontend/stylesheets/app/website-redesign.less b/services/web/frontend/stylesheets/app/website-redesign.less index 30ba457075..e6a1e4e416 100644 --- a/services/web/frontend/stylesheets/app/website-redesign.less +++ b/services/web/frontend/stylesheets/app/website-redesign.less @@ -348,21 +348,20 @@ display: flex; flex-direction: column; align-items: center; - padding: 48px; - background: #2f4858; + padding: 32px; + background: var(--deep-green); color: white; border-radius: 16px; - .quote-card-quote { + blockquote { font-size: 1.875rem; // 30px font-weight: 600; - line-height: 2.5rem; // 40px - letter-spacing: 0em; + line-height: 1.26; text-align: center; @media (max-width: @screen-sm-max) { font-size: 1.5rem; // 24px - line-height: 2rem; // 32px + line-height: 1.333; } } @@ -399,67 +398,6 @@ } } - .testimonial-media { - border-radius: 24px; - - .testimonial-media-text { - display: flex; - flex-direction: column; - min-height: 352px; - background-color: #2f4858; - color: var(--white); - border-top-left-radius: 24px; - border-top-right-radius: 0; - border-bottom-left-radius: 24px; - padding: 64px 56px; - - @media (max-width: @screen-sm-max) { - border-top-left-radius: 24px; - border-top-right-radius: 24px; - border-bottom-left-radius: 0; - min-height: 316px; - padding: 56px 24px; - } - - blockquote { - flex-grow: 1; - } - - .testimonial-media-author { - font-size: 1.125rem; - line-height: 1.333; - - @media (max-width: @screen-sm-max) { - font-size: 1rem; - line-height: 1.375; - } - } - } - - .testimonial-media-video { - height: 100%; - min-height: 352px; - background-color: var(--neutral-20); - border-top-right-radius: 24px; - border-bottom-right-radius: 24px; - border-bottom-left-radius: 0; - display: flex; - align-items: center; - justify-content: center; - - @media (max-width: @screen-sm-max) { - border-top-right-radius: 0; - border-bottom-right-radius: 24px; - border-bottom-left-radius: 24px; - } - - video { - height: 100%; - width: 100%; - } - } - } - .security-info { .security-info-first-row { margin-bottom: 32px; @@ -576,18 +514,18 @@ .round-background { border-radius: 50%; - font-size: 25px; + font-size: 1.5rem; top: 4px; vertical-align: middle; margin-right: 8px; - width: 25px; - height: 25px; + width: 24px; + height: 24px; } .green-round-background { .round-background; - background: var(--green-10); - color: var(--green-40); + background: var(--mint-green); + color: var(--deep-green); } .blue-round-background { @@ -602,7 +540,7 @@ font-size: 1.875rem; line-height: 1.333; font-weight: 600; - quotes: '\0022''\0022'; // use straight (" ") instead of curly ones (“ ”) + quotes: '\201C''\201D'; // override default quotes padding: unset; margin: unset; font-family: 'Noto Sans', sans-serif; diff --git a/services/web/frontend/stylesheets/variables/colors.less b/services/web/frontend/stylesheets/variables/colors.less index 72c801776f..a57ef85a46 100644 --- a/services/web/frontend/stylesheets/variables/colors.less +++ b/services/web/frontend/stylesheets/variables/colors.less @@ -92,8 +92,10 @@ @content-disabled: @content-disabled-on-light-bg; @content-placeholder: @content-placeholder-on-light-bg; -// == website-redesign +// == Website Redesign == @emerald-green: #098842; +@mint-green: #80cb9c; +@deep-green: #0f2715; @sapphire-blue: #4354a3; @sapphire-blue-dark: #3c4c93; diff --git a/services/web/frontend/stylesheets/variables/css-variables.less b/services/web/frontend/stylesheets/variables/css-variables.less index f4fdbb2f53..ab2ff04dd5 100644 --- a/services/web/frontend/stylesheets/variables/css-variables.less +++ b/services/web/frontend/stylesheets/variables/css-variables.less @@ -82,6 +82,8 @@ // website-redesign --emerald-green: @emerald-green; + --mint-green: @mint-green; + --deep-green: @deep-green; --sapphire-blue: @sapphire-blue; --sapphire-blue-dark: @sapphire-blue-dark; } diff --git a/services/web/public/img/advocates/aicheler.jpg b/services/web/public/img/advocates/aicheler.jpg deleted file mode 100644 index 9fa5dc3ff6..0000000000 Binary files a/services/web/public/img/advocates/aicheler.jpg and /dev/null differ diff --git a/services/web/public/img/advocates/bennett.jpg b/services/web/public/img/advocates/bennett.jpg new file mode 100644 index 0000000000..f096e4e235 Binary files /dev/null and b/services/web/public/img/advocates/bennett.jpg differ diff --git a/services/web/public/img/advocates/collins.jpg b/services/web/public/img/advocates/collins.jpg new file mode 100644 index 0000000000..6e818ddfc4 Binary files /dev/null and b/services/web/public/img/advocates/collins.jpg differ