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

Jump to bottom

Update to Protocol v.19.0.0 #14084

Merged
merged 7 commits into from
Feb 14, 2024
Merged

Update to Protocol v.19.0.0 #14084

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
bfbb10c
update old call-out instances to new callout
reemhamz Jan 16, 2024
be3a422
removed deprecated internships page
reemhamz Jan 22, 2024
8c3f1b6
updated newsletter component
reemhamz Jan 22, 2024
e99d326
updated instances of call_out macro to callout
reemhamz Jan 25, 2024
849f5ee
added classname to callout compact for styling
reemhamz Jan 25, 2024
4f275fe
added analytics events in newsletter
reemhamz Feb 6, 2024
c401910
PR review update
reemhamz Feb 14, 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
47 changes: 28 additions & 19 deletions bedrock/base/templates/macros-protocol.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -114,21 +114,28 @@

{#
Call Out: https://protocol.mozilla.org/components/detail/call-out--default.html
HTML import: {% from "macros-protocol.html" import call_out with context %}
CSS bundle: {% block page_css %} {{ css_bundle('protocol-call-out') }} {% endblock %}
HTML import: {% from "macros-protocol.html" import callout with context %}
CSS bundle: {% block page_css %} {{ css_bundle('protocol-callout') }} {% endblock %}
Macro parameters:
title (Required): String indicating heading text (usually a translation id wrapped in ftl function).
desc: String indicating paragraph text (usually a translation id wrapped in ftl function).
class: String adding class(es) to the section tag.
include_cta: Boolean indicating whether or not to include the body of the macro call (usually a mix of text and html).
heading_level: Number indicating heading level for title text. Should be based on semantic meaning, not presentational styling.
brand: Boolean indicating whether or not to display a Mozilla product logo or wordmark.
brand_product: String indicating what Mozilla product is to be displayed.
brand_type: String for choosing whether a logo or a wordmark is to be displayed.
brand_size: String to indicate size of the logo or wordmark to be added.
brand_text: String naming the branding's product. Used for accessibility purposes. Is optional as it depends on if the logo/wordmark used is for decorative purposes or not.
content_width: String to declare size of the container using Protocol's content width classes (i.e. mzp-t-content-md / mzp-t-content-lg). When using this macro, only declare the T-shirt sizing strings we have in place (i.e. 'sm', 'md', 'lg', 'xl'). Content width of the Callout container's macro is defaulted to mzp-t-content-lg.
#}
{% macro call_out(title, desc=None, class=None, include_cta=False, heading_level=2) -%}
<section class="mzp-c-call-out {% if class %}{{ class }}{% endif %}">
<div class="mzp-l-content">
<h{{ heading_level }} class="mzp-c-call-out-title">{{ title }}</h{{ heading_level }}>
{% macro callout(title, desc=None, class=None, include_cta=False, heading_level=2, brand=False, brand_product=None, brand_type=None, brand_size=None, brand_text=None, content_width=None) -%}
<section class="mzp-c-callout {% if class %}{{ class }}{% endif %}">
<div class="mzp-l-content {% if content_width %}mzp-t-content-{{content_width}} {% else %} mzp-t-content-lg {% endif %}">
{% if brand %}<div class="mzp-t-callout-brand mzp-c-{{ brand_type }} mzp-t-{{ brand_type }}-{{ brand_size }} mzp-t-product-{{ brand_product }}">{{ brand_text }}</div>{% endif %}
<h{{ heading_level }} class="mzp-c-callout-title">{{ title }}</h{{ heading_level }}>
{% if desc %}
<p class="mzp-c-call-out-desc">{{ desc }}</p>
<p class="mzp-c-callout-desc">{{ desc }}</p>
{% endif %}
{% if include_cta %}
{{ caller() }}
Expand All @@ -139,28 +146,30 @@


{#
Call Out (compact): https://protocol.mozilla.org/components/detail/compact-call-out--default.html
HTML import: {% from "macros-protocol.html" import call_out with context %}
CSS bundle: {% block page_css %} {{ css_bundle('protocol-call-out') }} {% endblock %}
Call Out (compact): https://protocol.mozilla.org/components/detail/compact-callout--default.html
HTML import: {% from "macros-protocol.html" import callout with context %}
CSS bundle: {% block page_css %} {{ css_bundle('protocol-callout') }} {% endblock %}
Marco Parameters:
title (Required): String indicating heading text (usually a translation id wrapped in ftl function).
desc: String indicating paragraph text (usually a translation id wrapped in ftl function).
class: tring adding class(es) to the section tag.
heading_level: Number indicating heading level for title text. Should be based on semantic meaning, not presentational styling.
#}
{% macro call_out_compact(title, desc=None, class=None, heading_level=2) -%}
<section class="mzp-c-call-out-compact {% if class %}{{ class }}{% endif %}">
<div class="mzp-l-content">
<div class="mzp-c-call-out-content">
<div class="mzp-c-call-out-container">
<h{{ heading_level }} class="mzp-c-call-out-title">{{ title }}</h{{ heading_level }}>
{% macro callout_compact(title, desc=None, class=None, heading_level=2, brand=False, brand_product=None, brand_type=None, brand_size=None, brand_text=None) -%}
<section class="mzp-c-callout mzp-l-compact {% if class %}{{ class }}{% endif %}">

<div class="mzp-l-content mzp-t-content-lg">
<div class="mzp-c-callout-content {% if brand %}mzp-c-callout-content-has-brand{% endif %}">
{% if brand %}<div class="mzp-t-callout-compact-brand mzp-c-{{ brand_type }} mzp-t-{{ brand_type }}-{{ brand_size }} mzp-t-product-{{ brand_product }}">{{ brand_text }}</div>{% endif %}
<div class="mzp-c-callout-container">
<h{{ heading_level }} class="mzp-c-callout-title">{{ title }}</h{{ heading_level }}>
{% if desc %}
<p class="mzp-c-call-out-desc">{{ desc }}</p>
<p class="mzp-c-callout-desc">{{ desc }}</p>
{% endif %}
</div>
</div>
<div class="mzp-c-call-out-cta">
<div class="mzp-c-call-out-cta-container">
<div class="mzp-c-callout-cta">
<div class="mzp-c-callout-cta-container">
{{ caller() }}
</div>
</div>
Expand Down
240 changes: 0 additions & 240 deletions bedrock/careers/templates/careers/internships.html
View file
Open in desktop

This file was deleted.

8 changes: 4 additions & 4 deletions bedrock/careers/templates/careers/position.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,10 +68,10 @@ <h3 class="mzp-c-menu-list-title">Apply Now</h3>
</section>
</div>

<section id="why" class="mzp-c-call-out">
<div class="mzp-l-content">
<h2 class="mzp-c-call-out-title">Why Mozilla?</h2>
<p class="mzp-c-call-out-desc">
<section id="why" class="mzp-c-callout">
<div class="mzp-l-content mzp-t-content-md">
<h2 class="mzp-c-callout-title">Why Mozilla?</h2>
<p class="mzp-c-callout-desc">
At Mozilla, we’re serving humanity—by maintaining a safe, open internet—while also
helping the individual humans employed here to reach their personal and
professional goals. With a relatively small team serving hundreds of millions of
Expand Down
4 changes: 0 additions & 4 deletions bedrock/careers/views.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,10 +57,6 @@ class LocationsView(L10nTemplateView):
template_name = "careers/locations.html"


class InternshipsView(L10nTemplateView):
template_name = "careers/internships.html"


class BenefitsView(L10nTemplateView):
template_name = "careers/benefits.html"

Expand Down
4 changes: 2 additions & 2 deletions bedrock/contentful/templates/includes/contentful/all.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,12 @@
#}


{% from "macros-protocol.html" import call_out_compact, card, split, picto with context %}
{% from "macros-protocol.html" import callout_compact, card, split, picto with context %}

{% for entry in entries -%}
{% if entry.component == 'callout' %}

{% call call_out_compact(
{% call callout_compact(
title=entry.title,
desc=entry.body|external_html,
class=entry.theme_class + ' ' + entry.product_class,
Expand Down
12 changes: 8 additions & 4 deletions bedrock/firefox/templates/firefox/browsers/best-browser.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
file, You can obtain one at https://mozilla.org/MPL/2.0/.
#}

{% from "macros-protocol.html" import call_out_compact with context %}
{% from "macros-protocol.html" import callout_compact with context %}

{% extends "firefox/base/base-protocol.html" %}

Expand All @@ -16,7 +16,7 @@

{% block page_css %}
{{ css_bundle('protocol-article') }}
{{ css_bundle('protocol-call-out') }}
{{ css_bundle('protocol-callout') }}
{{ css_bundle('best-browser') }}
{% endblock %}

Expand Down Expand Up @@ -118,9 +118,13 @@ <h2>{{ ftl('best-browser-a-browser-that-minds') }}</h2>
</article>
</div>

{% call call_out_compact(
{% call callout_compact(
title=ftl('best-browser-take-control-of-your'),
class='mzp-t-product-firefox mzp-t-firefox mzp-t-dark'
class='mzp-t-product-firefox mzp-t-firefox mzp-t-dark',
brand=True,
brand_product='firefox',
brand_type='logo',
brand_size='lg',
) %}
<div class="download-firefox">
{{ download_firefox(dom_id='safebrowser-bottom-download', download_location='secondary cta') }}
Expand Down
Loading
Loading