зеркало из https://github.com/mozilla/bedrock.git
* Clean up pocket banner (fixes #11050) * remove show_pocket_banner conditionals in html
This commit is contained in:
maureenlholland
GitHub
Родитель
1836be11c3
Коммит
91e4628067
|
|
@ -1,35 +0,0 @@
|
|||
{#
|
||||
This Source Code Form is subject to the terms of the Mozilla Public
|
||||
License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
||||
#}
|
||||
|
||||
{% extends 'includes/banners/base.html' %}
|
||||
|
||||
{% block banner_id %}pocket-banner{% endblock %}
|
||||
|
||||
{% if LANG.startswith('en') %}
|
||||
{% set pocket_page = '/collections' %}
|
||||
{% set pocket_campaign = 'best-of-us' %}
|
||||
{% set pocket_title = 'The top articles of the year are here' %}
|
||||
{% set pocket_button = 'Read Pocket\'s Best of 2021' %}
|
||||
{% elif LANG == 'de'%}
|
||||
{% set pocket_page = '/de/collections' %}
|
||||
{% set pocket_campaign = 'best-of-de' %}
|
||||
{% set pocket_title = 'Die meistgelesenen Artikel des Jahres warten auf dich' %}
|
||||
{% set pocket_button = 'Jetzt die Pocket Best of 2021 lesen' %}
|
||||
{% endif %}
|
||||
|
||||
{% block banner_title %}{{ pocket_title }}{% endblock %}
|
||||
|
||||
{% block banner_content %}
|
||||
<a
|
||||
href="https://getpocket.com{{ pocket_page }}?utm_source=mozilla.org&utm_campaign={{ pocket_campaign }}"
|
||||
rel="external noopener"
|
||||
class="mzp-c-button mzp-t-md"
|
||||
data-cta-type="button"
|
||||
data-cta-text="Read Pocket's Best of 2021"
|
||||
>
|
||||
{{ pocket_button }}
|
||||
</a>
|
||||
{% endblock %}
|
||||
|
|
@ -8,8 +8,6 @@
|
|||
|
||||
{% extends "base-protocol-mozilla.html" %}
|
||||
|
||||
{% set show_pocket_banner = switch('pocket-banner', ['en-US', 'en-CA', 'en-GB', 'de']) %}
|
||||
|
||||
{% block page_title %}{{ ftl('about-learn-about-mozilla') }}{% endblock %}
|
||||
|
||||
{% block page_desc %}
|
||||
|
|
@ -20,16 +18,6 @@
|
|||
|
||||
{% block page_css %}
|
||||
{{ css_bundle('about') }}
|
||||
|
||||
{% if show_pocket_banner %}
|
||||
{{ css_bundle('pocket-banner') }}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block page_banner %}
|
||||
{% if show_pocket_banner %}
|
||||
{% include 'includes/banners/pocket.html' %}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
|
@ -197,8 +185,4 @@
|
|||
|
||||
{% block js %}
|
||||
{{ js_bundle('about') }}
|
||||
|
||||
{% if show_pocket_banner %}
|
||||
{{ js_bundle('pocket-banner') }}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -10,8 +10,6 @@
|
|||
|
||||
{% from 'macros.html' import twitter_share_url with context %}
|
||||
|
||||
{% set show_pocket_banner = switch('pocket-banner', ['en-US', 'en-CA', 'en-GB', 'de']) %}
|
||||
|
||||
{% block page_title %}{{ ftl('manifesto-details-the-mozilla-manifesto') }}{% endblock %}
|
||||
{% block page_title_suffix %}{% endblock %}
|
||||
{% block page_desc %}{{ ftl('manifesto-these-are-the-principles') }}{% endblock %}
|
||||
|
|
@ -20,10 +18,6 @@
|
|||
|
||||
{% block page_css %}
|
||||
{{ css_bundle('manifesto') }}
|
||||
|
||||
{% if show_pocket_banner %}
|
||||
{{ css_bundle('pocket-banner') }}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% macro twitter_link(content_id, text) -%}
|
||||
|
|
@ -52,12 +46,6 @@
|
|||
{% set principle_number_09 = ftl('manifesto-principle-9') %}
|
||||
{% set principle_number_10 = ftl('manifesto-principle-10') %}
|
||||
|
||||
{% block page_banner %}
|
||||
{% if show_pocket_banner %}
|
||||
{% include 'includes/banners/pocket.html' %}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<main role="main" itemscope itemtype="http://schema.org/Article">
|
||||
<article role="article" itemprop="articleBody">
|
||||
|
|
@ -167,8 +155,4 @@
|
|||
|
||||
{% block js %}
|
||||
{{ js_bundle('manifesto') }}
|
||||
|
||||
{% if show_pocket_banner %}
|
||||
{{ js_bundle('pocket-banner') }}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,6 @@
|
|||
|
||||
{% set show_fundraising_banner = switch('fundraising-banner-eoy2021') and donate_params and ftl_has_messages('banner-fundraising-title', 'banner-fundraising-body') %}
|
||||
{% set show_firefox_app_store_banner = switch('firefox-app-store-banner') %}
|
||||
{% set show_pocket_banner = switch('pocket-banner', ['en-US', 'en-CA', 'en-GB', 'de']) %}
|
||||
{% set show_vpn_promo_banner = switch('vpn-promo-banner', ['en-US', 'en-CA', 'en-GB', 'de']) %}
|
||||
|
||||
{% block page_css %}
|
||||
|
|
@ -24,8 +23,6 @@
|
|||
|
||||
{% if show_fundraising_banner %}
|
||||
{{ css_bundle('fundraising-banner') }}
|
||||
{% elif show_pocket_banner %}
|
||||
{{ css_bundle('pocket-banner') }}
|
||||
{% elif show_vpn_promo_banner %}
|
||||
{{ css_bundle('vpn-promo-banner') }}
|
||||
{% elif show_firefox_app_store_banner %}
|
||||
|
|
@ -40,8 +37,6 @@
|
|||
{% block page_banner %}
|
||||
{% if show_fundraising_banner %}
|
||||
{% include 'includes/banners/fundraiser.html' %}
|
||||
{% elif show_pocket_banner %}
|
||||
{% include 'includes/banners/pocket.html' %}
|
||||
{% elif show_vpn_promo_banner %}
|
||||
{% include 'includes/banners/vpn-promo.html' %}
|
||||
{% elif show_firefox_app_store_banner %}
|
||||
|
|
@ -122,8 +117,6 @@
|
|||
|
||||
{% if show_fundraising_banner %}
|
||||
{{ js_bundle('fundraising-banner') }}
|
||||
{% elif show_pocket_banner %}
|
||||
{{ js_bundle('pocket-banner') }}
|
||||
{% elif show_vpn_promo_banner %}
|
||||
{{ js_bundle('vpn-promo-banner') }}
|
||||
{% elif show_firefox_app_store_banner %}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,6 @@
|
|||
{% block page_title %}Internet für Menschen, nicht für Profit{% endblock %}
|
||||
{% block page_desc %}Mozilla ist die gemeinnützige Organisation hinter Firefox. Menschen sollten auch online die Kontrolle über ihr Leben haben. Dafür setzen wir uns ein.{% endblock %}
|
||||
|
||||
{% set show_pocket_banner = switch('pocket-banner') %}
|
||||
{% set show_firefox_app_store_banner = switch('firefox-app-store-banner') %}
|
||||
{% set show_fundraising_banner = switch('fundraising-banner-eoy2021') and donate_params and ftl_has_messages('banner-fundraising-title', 'banner-fundraising-body') %}
|
||||
{% set show_vpn_promo_banner = switch('vpn-promo-banner') %}
|
||||
|
|
@ -27,8 +26,6 @@
|
|||
|
||||
{% if show_fundraising_banner %}
|
||||
{{ css_bundle('fundraising-banner') }}
|
||||
{% elif show_pocket_banner %}
|
||||
{{ css_bundle('pocket-banner') }}
|
||||
{% elif show_vpn_promo_banner %}
|
||||
{{ css_bundle('vpn-promo-banner') }}
|
||||
{% elif show_firefox_app_store_banner %}
|
||||
|
|
@ -39,8 +36,6 @@
|
|||
{% block page_banner %}
|
||||
{% if show_fundraising_banner %}
|
||||
{% include 'includes/banners/fundraiser.html' %}
|
||||
{% elif show_pocket_banner %}
|
||||
{% include 'includes/banners/pocket.html' %}
|
||||
{% elif show_vpn_promo_banner %}
|
||||
{% include 'includes/banners/vpn-promo.html' %}
|
||||
{% elif show_firefox_app_store_banner %}
|
||||
|
|
@ -160,8 +155,6 @@
|
|||
|
||||
{% if show_fundraising_banner %}
|
||||
{{ js_bundle('fundraising-banner') }}
|
||||
{% elif show_pocket_banner %}
|
||||
{{ js_bundle('pocket-banner') }}
|
||||
{% elif show_vpn_promo_banner %}
|
||||
{{ js_bundle('vpn-promo-banner') }}
|
||||
{% elif show_firefox_app_store_banner %}
|
||||
|
|
|
|||
|
|
@ -1,130 +0,0 @@
|
|||
// This Source Code Form is subject to the terms of the Mozilla Public
|
||||
// License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
// file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
||||
|
||||
// stylelint-disable declaration-no-important
|
||||
|
||||
$font-path: '/media/fonts';
|
||||
$image-path: '/media/protocol/img';
|
||||
$brand-theme: 'firefox';
|
||||
|
||||
@import '~@mozilla-protocol/core/protocol/css/includes/lib';
|
||||
@import 'includes/base';
|
||||
|
||||
@font-face {
|
||||
font-family: Inter;
|
||||
font-display: swap;
|
||||
font-weight: 700;
|
||||
src:
|
||||
url('https://assets.getpocket.com/web-ui/assets/Inter-Bold.c9c89216b48bee4d8727bf39d948b125.woff'),
|
||||
url('https://assets.getpocket.com/web-ui/assets/Inter-Bold.fe38e3f307fcbac1a801c0c38dff56ef.woff2');
|
||||
}
|
||||
|
||||
// Pocket theme variables
|
||||
$color-text-primary: #1a1a1a;
|
||||
$font-text-primary: inter, 'Helvetica Neue', helvetica, arial, sans-serif;
|
||||
|
||||
// leave space for Close button
|
||||
$close-btn-space: calc(1rem + (2 * #{$spacing-lg}));
|
||||
|
||||
.c-banner {
|
||||
// banner base overrides
|
||||
background-color: #9871ef;
|
||||
text-align: center;
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
|
||||
&-title,
|
||||
&-content {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// protocol overrides
|
||||
a:link,
|
||||
a:visited {
|
||||
color: $color-text-primary;
|
||||
}
|
||||
|
||||
.mzp-c-button {
|
||||
background-color: $color-white;
|
||||
border-color: $color-white;
|
||||
color: $color-text-primary;
|
||||
font-family: $font-text-primary;
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
background-color: $color-white;
|
||||
border-color: $color-white;
|
||||
color: $color-text-primary;
|
||||
text-decoration: underline !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mzp-l-content {
|
||||
max-width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// end overrides
|
||||
|
||||
&-title {
|
||||
@include text-title-xs;
|
||||
box-sizing: border-box;
|
||||
color: $color-white;
|
||||
font-family: $font-text-primary;
|
||||
margin-bottom: 0;
|
||||
padding: $spacing-md $close-btn-space;
|
||||
}
|
||||
|
||||
&-content {
|
||||
padding-bottom: $spacing-md;
|
||||
}
|
||||
}
|
||||
|
||||
@supports (display: grid) {
|
||||
@media #{$mq-md} {
|
||||
// this is to match the pocket banner max width
|
||||
$max-width-column-third: 1000px * 0.33;
|
||||
|
||||
.c-banner {
|
||||
overflow-x: hidden;
|
||||
|
||||
&-main {
|
||||
display: grid;
|
||||
column-gap: $spacing-lg;
|
||||
align-items: center;
|
||||
grid-template-areas: '. . title cta .';
|
||||
grid-template-columns: 1fr minmax(0, $max-width-column-third) minmax(min-content, $max-width-column-third) minmax(max-content, $max-width-column-third) minmax($close-btn-space, 1fr);
|
||||
}
|
||||
|
||||
&-title {
|
||||
grid-area: title;
|
||||
@include bidi(((text-align, left, right),));
|
||||
position: relative;
|
||||
padding-right: unset;
|
||||
padding-left: unset;
|
||||
|
||||
&::before {
|
||||
$width: 50vw; // needs to be large enough to extend to the edge of the screen
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
@include bidi(((left, calc((#{$width} + #{$spacing-md}) * -1), calc(100% + #{$spacing-md})),));
|
||||
width: $width;
|
||||
display: block;
|
||||
background-image: url('/media/img/banners/pocket/best-of-2021.svg');
|
||||
background-repeat: repeat;
|
||||
@include bidi(((background-position, center right, center left),));
|
||||
}
|
||||
}
|
||||
|
||||
&-content {
|
||||
grid-area: cta;
|
||||
@include bidi(((text-align, right, left),));
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
<svg width="437" height="46" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path fill="#fff" d="M0 0h437v46H0z"/><path fill="#004D48" d="M0-107h145.643v254.748H0z"/><path fill="#396AFF" d="M145.645-107h145.643v254.748H145.645z"/><path fill="#F67D6D" d="M291.286-107h145.643v254.748H291.286z"/><path d="M14.695 41h28.923v-7.696H31.546l5.03-4.88c4.024-3.872 6.79-7.595 6.79-12.524 0-6.64-4.677-11.368-13.48-11.368-8.702 0-14.134 4.577-14.487 13.581h9.356c.453-4.275 2.063-5.835 4.628-5.835s3.823 1.61 3.823 4.024c0 3.018-2.364 6.087-5.936 9.91l-12.575 13.33V41Zm48.508.604c10.261 0 16.8-6.69 16.8-18.109v-1.408c0-11.67-7.142-17.555-16.599-17.555-9.507 0-16.6 6.388-16.6 17.756v1.51c0 11.317 6.339 17.806 16.399 17.806Zm.302-7.998c-4.427 0-6.389-3.17-6.389-9.86v-1.508c0-6.64 1.962-9.91 6.288-9.91 4.376 0 6.288 3.32 6.288 9.91v1.459c0 6.64-1.76 9.909-6.187 9.909ZM82.238 41h28.923v-7.696H99.089l5.03-4.88c4.024-3.872 6.79-7.595 6.79-12.524 0-6.64-4.678-11.368-13.48-11.368-8.702 0-14.135 4.577-14.487 13.581h9.356c.453-4.275 2.062-5.835 4.628-5.835 2.565 0 3.823 1.61 3.823 4.024 0 3.018-2.364 6.087-5.936 9.91l-12.575 13.33V41Zm38.749 0h10.312V5.035h-8.903l-8.25 5.784v8.602l6.841-4.225V41Z" fill="#F9BFD1"/><path d="M160.338 41h28.923v-7.696h-12.072l5.03-4.88c4.024-3.872 6.791-7.595 6.791-12.524 0-6.64-4.678-11.368-13.481-11.368-8.702 0-14.134 4.577-14.486 13.581h9.356c.452-4.275 2.062-5.835 4.627-5.835 2.566 0 3.823 1.61 3.823 4.024 0 3.018-2.364 6.087-5.935 9.91l-12.576 13.33V41Zm48.508.604c10.262 0 16.801-6.69 16.801-18.109v-1.408c0-11.67-7.143-17.555-16.6-17.555-9.506 0-16.599 6.388-16.599 17.756v1.51c0 11.317 6.338 17.806 16.398 17.806Zm.302-7.998c-4.426 0-6.388-3.17-6.388-9.86v-1.508c0-6.64 1.962-9.91 6.287-9.91 4.377 0 6.288 3.32 6.288 9.91v1.459c0 6.64-1.76 9.909-6.187 9.909ZM227.881 41h28.923v-7.696h-12.072l5.03-4.88c4.024-3.872 6.791-7.595 6.791-12.524 0-6.64-4.678-11.368-13.481-11.368-8.702 0-14.134 4.577-14.487 13.581h9.356c.453-4.275 2.063-5.835 4.628-5.835s3.823 1.61 3.823 4.024c0 3.018-2.364 6.087-5.936 9.91l-12.575 13.33V41Zm38.75 0h10.311V5.035h-8.903l-8.249 5.784v8.602l6.841-4.225V41Z" fill="#82ECB7"/><path d="M305.981 41h28.923v-7.696h-12.072l5.03-4.88c4.024-3.872 6.791-7.595 6.791-12.524 0-6.64-4.678-11.368-13.481-11.368-8.702 0-14.135 4.577-14.487 13.581h9.356c.453-4.275 2.063-5.835 4.628-5.835s3.823 1.61 3.823 4.024c0 3.018-2.364 6.087-5.936 9.91l-12.575 13.33V41Zm48.508.604c10.261 0 16.8-6.69 16.8-18.109v-1.408c0-11.67-7.142-17.555-16.599-17.555-9.507 0-16.599 6.388-16.599 17.756v1.51c0 11.317 6.338 17.806 16.398 17.806Zm.302-7.998c-4.427 0-6.389-3.17-6.389-9.86v-1.508c0-6.64 1.962-9.91 6.288-9.91 4.376 0 6.288 3.32 6.288 9.91v1.459c0 6.64-1.761 9.909-6.187 9.909ZM373.524 41h28.923v-7.696h-12.072l5.03-4.88c4.024-3.872 6.79-7.595 6.79-12.524 0-6.64-4.678-11.368-13.48-11.368-8.702 0-14.135 4.577-14.487 13.581h9.356c.453-4.275 2.062-5.835 4.628-5.835 2.565 0 3.823 1.61 3.823 4.024 0 3.018-2.365 6.087-5.936 9.91l-12.575 13.33V41Zm38.749 0h10.312V5.035h-8.903l-8.25 5.784v8.602l6.841-4.225V41Z" fill="#FFD25E"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h437v46H0z"/></clipPath></defs></svg>
|
||||
|
До Ширина: | Высота: | Размер: 3.1 KiB |
|
|
@ -1,15 +0,0 @@
|
|||
/*
|
||||
* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
||||
*/
|
||||
|
||||
(function () {
|
||||
'use strict';
|
||||
|
||||
function onLoad() {
|
||||
window.Mozilla.Banner.init('pocket-banner', true);
|
||||
}
|
||||
|
||||
window.Mozilla.run(onLoad);
|
||||
})();
|
||||
|
|
@ -250,12 +250,6 @@
|
|||
],
|
||||
"name": "fundraising-banner"
|
||||
},
|
||||
{
|
||||
"files": [
|
||||
"css/base/banners/pocket.scss"
|
||||
],
|
||||
"name": "pocket-banner"
|
||||
},
|
||||
{
|
||||
"files": [
|
||||
"css/base/banners/vpn-promo.scss"
|
||||
|
|
@ -1262,13 +1256,6 @@
|
|||
],
|
||||
"name": "fundraising-banner"
|
||||
},
|
||||
{
|
||||
"files": [
|
||||
"js/base/banners/mozilla-banner.js",
|
||||
"js/base/banners/pocket-banner-init.js"
|
||||
],
|
||||
"name": "pocket-banner"
|
||||
},
|
||||
{
|
||||
"files": [
|
||||
"js/base/banners/mozilla-banner.js",
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче