Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refresh: misc tweaks and refinements #15654

Merged
merged 6 commits into from
Dec 4, 2024
Merged

Refresh: misc tweaks and refinements #15654

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
2633c9b
Refresh: misc tweaks and refinements
craigcook Dec 4, 2024
0be5700
review fixes, add caret icons
craigcook Dec 4, 2024
6eddfba
Clean up footer media queries [fix #15668]
craigcook Dec 4, 2024
28208b4
Fix Mozilla.ai brand term
craigcook Dec 4, 2024
3711dce
Fix newsletter media queries
craigcook Dec 4, 2024
82ca196
Re-fix Mozilla.ai string
craigcook Dec 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion bedrock/base/templates/includes/protocol/footer/footer-refresh.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,9 @@ <h2 class="moz24-footer-heading-social">{{ ftl('footer-refresh-follow-firefox')
<div class="moz24-footer-actions">
<a class="moz24-footer-donate" href="{{ donate_url(location='moco-donate-footer') }}" data-link-type="button" data-link-text="Donate">
<span class="mzp-c-button-icon-start">
<svg height="640" viewBox="0 0 896.173 896.173" width="640" xmlns="http://www.w3.org/2000/svg"><switch><path d="m415.586 381.044v-65.006h65.001v65.006zm151.61-179.868c-34.105 0-63.39 12.422-86.609 27.824v87.038c4.788-5.861 12.53-14.509 22.611-22.98 21.228-17.838 42.76-26.882 63.998-26.882 47.765 0 86.625 40.383 86.625 90.02 0 72.488-58.765 143.314-108.062 189.965-37.953 35.915-76.426 63.436-97.672 77.68-21.246-14.244-59.72-41.765-97.673-77.68-49.297-46.651-108.062-117.477-108.062-189.964 0-49.638 38.86-90.021 86.625-90.021 21.239 0 42.77 9.044 63.998 26.882 10.082 8.472 17.823 17.119 22.611 22.98v-87.038c-23.218-15.402-52.503-27.824-86.609-27.824-83.606 0-151.625 69.542-151.625 155.02 0 43.355 14.14 88.366 42.027 133.784 21.258 34.62 50.627 69.704 87.29 104.273 61.41 57.902 122.133 94.58 124.688 96.112l7.735 4.632h17.989l7.735-4.632c2.555-1.533 63.278-38.21 124.687-96.112 36.664-34.57 66.033-69.652 87.29-104.273 27.888-45.418 42.028-90.429 42.028-133.783 0-85.479-68.019-155.021-151.625-155.021"/></switch></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
craigcook marked this conversation as resolved.
Show resolved Hide resolved
<path fill="currentColor" d="M16.34 2.93c-1.26 0-2.34.46-3.2 1.03-.11.09-.57.43-.84.82h-.71c-.28-.4-.75-.75-.85-.81s-.02-.01-.03-.02h-.01c-.85-.56-1.92-1-3.16-1-3.09 0-5.6 2.57-5.6 5.73 0 1.6.52 3.26 1.55 4.94.79 1.28 1.87 2.57 3.22 3.85 2.27 2.14 4.51 3.49 4.61 3.55l.29.17h.66l.29-.17c.09-.06 2.34-1.41 4.61-3.55 1.35-1.28 2.44-2.57 3.22-3.85 1.03-1.68 1.55-3.34 1.55-4.94 0-3.16-2.51-5.73-5.6-5.73Zm-.8 12.74c-1.4 1.33-2.82 2.34-3.61 2.87-.78-.53-2.21-1.54-3.61-2.87-1.82-1.72-3.99-4.34-3.99-7.02 0-1.83 1.44-3.33 3.2-3.33.78 0 1.58.33 2.36.99.37.31.66.63.83.85s0 .01 0 .01v2.39h2.4V7.15c.18-.22.46-.53.83-.84.78-.66 1.58-.99 2.36-.99 1.76 0 3.2 1.49 3.2 3.33 0 2.68-2.17 5.29-3.99 7.02Z"/>
</svg>
</span>
<span class="mzp-c-button-icon-text">{{ ftl('footer-refresh-donate') }}</span>
</a>
Expand Down
2 changes: 1 addition & 1 deletion bedrock/base/templates/includes/protocol/lang-switcher-refresh.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@

{% if available_languages|length > 1 %}
<form id="lang_form" class="moz24-c-language-switcher" method="get" action="#">
<a class="mzp-c-language-switcher-link" href="{{ url('mozorg.locales') }}">{{ ftl('footer-refresh-all-languages', fallback='footer-refresh-language') }}</a>
<label for="page-language-select">{{ ftl('footer-refresh-language') }}</label>
<a class="mzp-c-language-switcher-link" href="{{ url('mozorg.locales') }}">{{ ftl('footer-refresh-language') }}</a>
<select id="page-language-select" class="mzp-js-language-switcher-select" name="lang" dir="ltr" data-testid="footer-language-select">
{% for code, label in available_languages|dictsort -%}
{# Don't escape the label as it may include entity references
Expand Down
2 changes: 1 addition & 1 deletion bedrock/base/templates/includes/protocol/navigation/menus-refresh/about-us.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@ <h4 class="m24-c-menu-item-title">{{ ftl('navigation-refresh-mozilla-foundation'
<li>
<section class="m24-c-menu-item">
<a class="m24-c-menu-item-link" href="https://www.mozilla.ai/?{{ utm_params }}" data-link-text="Mozilla.ai" data-link-position="topnav - about">
<h4 class="m24-c-menu-item-title">{{ ftl('navigation-refresh-mozilla-ai-v2') }}</h4>
<h4 class="m24-c-menu-item-title">{{ ftl('navigation-refresh-mozilla-ai-v3') }}</h4>
</a>
</section>
</li>
Expand Down
2 changes: 1 addition & 1 deletion bedrock/firefox/templates/firefox/browsers/chromebook.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@
media_class='mzp-l-split-h-center'
) %}
<div class="mzp-c-logo mzp-t-logo-lg mzp-t-product-firefox"></div>
<h1 class="mzp-u-title-xl">{{ ftl('browsers-chromebook-get-firefox-browser') }}</h1>
<h1 class="mzp-u-title-lg">{{ ftl('browsers-chromebook-get-firefox-browser') }}</h1>
<p>{{ ftl('browsers-chromebook-so-youve-got') }}</p>

<div class="mzp-c-menu-list mzp-t-cta mzp-t-download" id="chromebook-download-list">
Expand Down
2 changes: 1 addition & 1 deletion bedrock/firefox/templates/firefox/browsers/mobile/android.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@
media_after=True
) %}
<div class="mzp-c-wordmark mzp-t-wordmark-md mzp-t-product-firefox">{{ ftl('firefox-ios-firefox-browser') }}</div>
<h1 class="mzp-u-title-xl">{{ ftl('mobile-android-short-cut-the-internet') }}</h1>
<h1 class="mzp-u-title-lg">{{ ftl('mobile-android-short-cut-the-internet') }}</h1>
<p class="c-tagline">{{ ftl('mobile-android-see-all-your-open-tabs') }}</p>
<p class="c-cta">
{{ google_play_button(href=android_url, id='playStoreLink-primary') }}
Expand Down
2 changes: 1 addition & 1 deletion bedrock/firefox/templates/firefox/browsers/mobile/focus.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@
media_after=True
) %}
<div class="mzp-c-wordmark mzp-t-wordmark-md mzp-t-product-{% if LANG=='de' %}klar{% else %}focus{% endif %}">{{ ftl('mobile-focus-firefox-focus') }}</div>
<h1 class="mzp-u-title-xl">{{ ftl('mobile-focus-simply-private-mobile') }}</h1>
<h1 class="mzp-u-title-lg">{{ ftl('mobile-focus-simply-private-mobile') }}</h1>
<p class="c-tagline">{{ ftl('mobile-focus-firefox-focus-dedicated-with-v2') }}</p>
<p>{{ ftl('mobile-focus-firefox-focus-is-available') }}</p>

Expand Down
2 changes: 1 addition & 1 deletion bedrock/firefox/templates/firefox/browsers/mobile/ios.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@
media_after=True
) %}
<div class="mzp-c-wordmark mzp-t-wordmark-md mzp-t-product-firefox">{{ ftl('mobile-ios-firefox-browser') }}</div>
<h1 class="mzp-u-title-xl">
<h1 class="mzp-u-title-lg">
{{ ftl('mobile-ios-get-to-your-go-to') }}
</h1>
<p class="c-tagline">{{ self.page_desc() }}</p>
Expand Down
2 changes: 1 addition & 1 deletion bedrock/firefox/templates/firefox/browsers/quantum.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
block_class='mzp-l-split-hide-media-on-sm-md'
) %}
<div class="mzp-c-logo mzp-t-logo-lg mzp-t-product-firefox"></div>
<h1 class="mzp-u-title-xl">{{ ftl('the-latest-firefox') }}</h1>
<h1 class="mzp-u-title-lg">{{ ftl('the-latest-firefox') }}</h1>
<p>{{ ftl('firefox-quantum-was') }}</p>
{{ download_firefox_thanks() }}
<p><a class="mzp-c-cta-link" href="https://blog.mozilla.org/blog/2017/11/14/introducing-firefox-quantum/?utm_source=mozilla.org-firefox-browsers-quantum&utm_medium=referral&utm_campaign=seo-quantum&amp;utm_content=hero&amp;entrypoint=mozilla.org-firefox-browsers-quantum">{{ ftl('learn-more-about') }}</a></p>
Expand Down
2 changes: 1 addition & 1 deletion bedrock/firefox/templates/firefox/faq.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@
media_after=True
) %}
<div class="mzp-c-logo mzp-t-logo-lg mzp-t-product-firefox"></div>
<h1 class="mzp-u-title-xl">{{ ftl('firefox-faq')}}</h1>
<h1 class="mzp-u-title-lg">{{ ftl('firefox-faq')}}</h1>
<p>{{ ftl('whether-you-searched-independant') }}</p>
{{ download_firefox_thanks() }}
{% endcall %}
Expand Down
2 changes: 1 addition & 1 deletion bedrock/mozorg/templates/mozorg/home/home-new.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -257,7 +257,7 @@ <h2>{{ ftl('home-join-us-in-shaping') }}</h2>
media_after=False
) %}
<h2>{{ ftl('home-so-what-is-mozilla') }}</h2>
<p>{{ ftl('home-at-its-core', ventures=moz_ventures, mozai=moz_ai) }}</p>
<p>{{ ftl('home-at-its-core-v2', fallback='home-at-its-core', ventures=moz_ventures, mozai=moz_ai) }}</p>
<a href="https://foundation.mozilla.org/{{ utm_params }}" rel="external noopener" class="mzp-c-button">
{{ ftl('home-learn-about-mofo') }}
</a>
Expand Down
5 changes: 4 additions & 1 deletion l10n/en/brands.ftl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -123,7 +123,10 @@
-brand-name-mozilla-account = Mozilla account
-brand-name-mozilla-accounts = Mozilla accounts
-brand-name-mozilla-social = Mozilla.social
-brand-name-mozilla-ai = Mozilla.ai

# Obsolete string (expires: 2025-01-05)
-brand-name-mozilla-ai = Mozilla AI
-brand-name-mozilla-ai-v2 = Mozilla.ai
-brand-name-mozilla-ventures = Mozilla Ventures
-brand-name-rise25 = Rise25
-brand-name-thunderbird = Thunderbird
Expand Down
1 change: 1 addition & 0 deletions l10n/en/footer-refresh.ftl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ footer-refresh-websites-cookies = Cookies
footer-refresh-websites-legal = Legal
footer-refresh-community-participation-guidelines = Community Participation Guidelines
footer-refresh-about-this-site = About this site
footer-refresh-all-languages = All languages
footer-refresh-language = Language
footer-refresh-primary-nav-aria-label = Footer primary
footer-refresh-secondary-nav-aria-label = Footer secondary
6 changes: 5 additions & 1 deletion l10n/en/mozorg/home-new.ftl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,10 +42,14 @@ home-read-more = Read more

home-so-what-is-mozilla = So, what is { -brand-name-mozilla }?

# Obsolete string (expires: 2025-01-05)
home-at-its-core = At its core, { -brand-name-mozilla } is an activist organization led by the { -brand-name-mozilla-foundation } that makes change in the world through a variety of ventures including { -brand-name-mozilla-corporation }, MZLA, <a {$ventures}>{ -brand-name-mozilla-ventures }</a> and <a {$mozai}>{ -brand-name-mozilla-ai }</a>. How are we different? Because we’re mission-driven, it means we have the freedom to make all of our decisions based on what’s best for the internet and for everyone online, not based on the demands of shareholders — we don’t actually have any of those.

# Variables
# $ventures - link to https://mozilla.vc/
# $mozai - link to https://mozilla.ai/
home-at-its-core = At its core, { -brand-name-mozilla } is an activist organization led by the { -brand-name-mozilla-foundation } that makes change in the world through a variety of ventures including { -brand-name-mozilla-corporation }, MZLA, <a {$ventures}>{ -brand-name-mozilla-ventures }</a> and <a {$mozai}>{ -brand-name-mozilla-ai }</a>. How are we different? Because we’re mission-driven, it means we have the freedom to make all of our decisions based on what’s best for the internet and for everyone online, not based on the demands of shareholders — we don’t actually have any of those.
home-at-its-core-v2 = At its core, { -brand-name-mozilla } is an activist organization led by the { -brand-name-mozilla-foundation } that makes change in the world through a variety of ventures including { -brand-name-mozilla-corporation }, MZLA, <a {$ventures}>{ -brand-name-mozilla-ventures }</a> and <a {$mozai}>{ -brand-name-mozilla-ai-v2 }</a>. How are we different? Because we’re mission-driven, it means we have the freedom to make all of our decisions based on what’s best for the internet and for everyone online, not based on the demands of shareholders — we don’t actually have any of those.


home-learn-about-mofo = Learn about the { -brand-name-mozilla-foundation }

Expand Down
8 changes: 8 additions & 0 deletions l10n/en/navigation_refresh.ftl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,16 @@ navigation-refresh-innovation-projects-v2 = Innovation Projects
navigation-refresh-blog = Blog
navigation-refresh-our-mission = Our Mission
navigation-refresh-our-work = Our Work

# Obsolete string (expires: 2025-01-05)
navigation-refresh-mozilla-ai = { -brand-name-mozilla } AI

# Obsolete string (expires: 2025-01-05)
navigation-refresh-mozilla-ai-v2 = { -brand-name-mozilla-ai }

navigation-refresh-mozilla-ai-v3 = { -brand-name-mozilla-ai-v2 }

# Obsolete string (expires: 2025-01-05)
navigation-refresh-mozilla-ventures = { -brand-name-mozilla } Ventures
navigation-refresh-mozilla-ventures-v2 = { -brand-name-mozilla-ventures }
navigation-refresh-mozilla-advertising = { -brand-name-mozilla } Advertising
Expand Down
2 changes: 1 addition & 1 deletion media/css/firefox/enterprise/landing.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ $image-path: '/media/protocol/img';
position: relative;

.mzp-c-split-title {
@include text-title-xl;
@include text-title-lg;
margin-bottom: $spacing-md;

@media #{$mq-md} {
Expand Down
30 changes: 14 additions & 16 deletions media/css/m24/components/footer-newsletter.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ $max-footer-content-width: $content-max;
padding-bottom: $spacer-lg;
position: relative;

@media(min-width: $screen-md) {
@media #{$mq-md} {
align-items: flex-start;
flex-direction: row;
}
Expand All @@ -48,11 +48,11 @@ $max-footer-content-width: $content-max;
align-items: flex-start;
margin-bottom: $grid-margin;

@media(min-width: $screen-md) {
@media #{$mq-md} {
width: grid(5);
}

@media(min-width: $screen-lg) {
@media #{$mq-lg} {
width: grid(4);
flex-wrap: nowrap;
}
Expand All @@ -71,7 +71,7 @@ $max-footer-content-width: $content-max;
@include bidi(((margin-right, $spacer-sm, 0), (margin-left, 0, $spacer-sm)));
margin-bottom: $spacer-md;

@media(min-width: $screen-lg) {
@media #{$mq-lg} {
@include bidi(((margin-right, $spacer-xl, 0), (margin-left, 0, $spacer-xl)));
}

Expand All @@ -82,11 +82,11 @@ $max-footer-content-width: $content-max;
.moz24-newsletter {
width: 100%;

@media(min-width: $screen-md) {
@media #{$mq-md} {
width: grid(6);
}

@media(min-width: $screen-lg) {
@media #{$mq-lg} {
width: grid(8);
}

Expand All @@ -97,7 +97,6 @@ $max-footer-content-width: $content-max;
.mzp-c-newsletter-thanks {
h3 {
color: $m24-color-black;
font-family: $secondary-font;
}

p {
Expand Down Expand Up @@ -127,7 +126,7 @@ $max-footer-content-width: $content-max;
font-family: $primary-font;
text-align: start;

@media(min-width: $screen-lg) {
@media #{$mq-lg} {
display: inline-grid;

&:first-of-type {
Expand Down Expand Up @@ -168,7 +167,7 @@ $max-footer-content-width: $content-max;
width: 100%;
font-family: $primary-font;

@media(min-width: $screen-md) {
@media #{$mq-md} {
min-width: 100%;
}

Expand All @@ -185,7 +184,7 @@ $max-footer-content-width: $content-max;
background-image: url('/media/img/logos/mozilla/footer-refresh/icon-arrow-down.svg');
background-repeat: no-repeat;

@media(min-width: $screen-lg) {
@media #{$mq-lg} {
min-width: 100%;
}
}
Expand All @@ -194,7 +193,7 @@ $max-footer-content-width: $content-max;
.mzp-c-newsletter-details-inner {
max-width: 100%;

@media(min-width: $screen-lg) {
@media #{$mq-lg} {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 30px 45px 75px;
Expand All @@ -208,7 +207,7 @@ $max-footer-content-width: $content-max;
font-family: $primary-font;
text-align: start;

@media(min-width: $screen-lg) {
@media #{$mq-lg} {
display: inline-grid;

&:first-of-type {
Expand All @@ -225,7 +224,7 @@ $max-footer-content-width: $content-max;
&:has(> label.mzp-u-inline) {
margin: $spacer-lg 0 $spacer-md;

@media(min-width: $screen-lg) {
@media #{$mq-lg} {
grid-column-start: 1;
grid-column-end: 3;
}
Expand Down Expand Up @@ -258,11 +257,10 @@ $max-footer-content-width: $content-max;
button {
border: $border-width solid $m24-color-black;
border-radius: 0;
font-family: $secondary-font;
position: relative;
max-width: 800px;
width: 100%;
font-weight: 500;
font-weight: 600;

&:hover,
&:focus-visible {
Expand All @@ -275,7 +273,7 @@ $max-footer-content-width: $content-max;
color: $m24-color-black;
}

@media(min-width: $screen-md) {
@media #{$mq-md} {
width: fit-content;
display: flex;
justify-content: flex-start;
Expand Down
Loading
Loading