Skip to content

Commit

Permalink
[Release] Stage to Main (#2697)
Browse files Browse the repository at this point in the history
  • Loading branch information
@milo-pr-merge
milo-pr-merge[bot] authored Aug 7, 2024
2 parents 498b7c8 + 6418e29 commit 5401829
Show file tree
Hide file tree
Showing 14 changed files with 234 additions and 103 deletions.
38 changes: 19 additions & 19 deletions libs/blocks/editorial-card/editorial-card.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@
min-width: initial;
}

.editorial-card.has-footer {
.editorial-card.equal-height {
height: 100%;
}

Expand All @@ -79,27 +79,29 @@
}

.editorial-card .foreground,
.editorial-card .footer {
.editorial-card .card-footer {
padding: var(--spacing-xs);
}

.editorial-card .extra-row {
padding: 0 var(--spacing-xs);
}

.editorial-card .footer {
.editorial-card .card-footer {
padding-top: 0;
margin-top: auto;
}

.editorial-card .footer > div {
.editorial-card .card-footer > div {
display: flex;
flex-direction: column;
text-align: end;
justify-content: end;
row-gap: var(--spacing-xxs);
}

.editorial-card .card-footer.empty { padding: 0; }

.editorial-card.no-bg.no-border .foreground {
padding: var(--spacing-s) 0;
}
Expand All @@ -109,7 +111,7 @@
}

.editorial-card.no-bg.no-border .static,
.editorial-card.no-bg.no-border .footer {
.editorial-card.no-bg.no-border .card-footer {
padding-inline: 0;
}

Expand All @@ -127,8 +129,8 @@
line-height: 0;
}

.editorial-card.footer-align-left .footer > div { text-align: start; }
.editorial-card.footer-align-center .footer > div { text-align: center; }
.editorial-card.footer-align-left .card-footer > div { text-align: start; }
.editorial-card.footer-align-center .card-footer > div { text-align: center; }

.editorial-card.no-bg.no-border .foreground > div {
row-gap: var(--spacing-xs);
Expand All @@ -154,11 +156,11 @@
}

.editorial-card .action-area,
.editorial-card .footer > .action-area {
.editorial-card .card-footer > .action-area {
display: flex;
align-items: center;
justify-content: right;
gap: var(--spacing-xxs);
gap: var(--spacing-xs) var(--spacing-s);
flex-flow: wrap;
flex-direction: row;
}
Expand All @@ -171,16 +173,13 @@
justify-content: center;
}

.editorial-card.right .action-area {
justify-content: right;
}

.editorial-card hr {
background-color: currentcolor;
border: none;
height: 1px;
width: 100%;
margin: var(--spacing-xs) 0;
margin: var(--spacing-xxs) 0;
}

.editorial-card .background {
Expand All @@ -204,6 +203,11 @@
position: relative;
}

.editorial-card:is(.media-square, .media-wide, .media-standard, .media-tall) .media-area .milo-video {
height: auto;
padding: 0;
}

/* Aspect Ratio */
.editorial-card.media-square .media-area img,
.editorial-card.media-square .media-area video {
Expand All @@ -224,7 +228,8 @@
}

.editorial-card.media-tall .media-area img,
.editorial-card.media-tall .media-area video {
.editorial-card.media-tall .media-area video,
.editorial-card.media-tall .media-area .milo-video {
aspect-ratio: var(--aspect-ratio-tall);
max-height: unset;
}
Expand All @@ -241,10 +246,5 @@
justify-items: center;
}

.editorial-card.right {
text-align: end;
justify-items: end;
}

.editorial-card.footer-align-left .action-area { justify-content: start; }
.editorial-card.footer-align-center .action-area { justify-content: center; }
7 changes: 4 additions & 3 deletions libs/blocks/editorial-card/editorial-card.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,8 @@ const decorateForeground = async (el, rows) => {
row.classList.add('foreground');
await decorateLockupFromContent(row);
} else if (i === (rows.length - 1)) {
row.classList.add('footer');
row.classList.add('card-footer');
if (!row.textContent.trim()) row.classList.add('empty');
} else {
row.classList.add('extra-row');
}
Expand Down Expand Up @@ -86,12 +87,12 @@ const init = async (el) => {
if (![...el.classList].some((c) => c.endsWith('-lockup'))) el.classList.add('m-lockup');
let rows = el.querySelectorAll(':scope > div');
const [head, middle, ...tail] = rows;
if (rows.length === 4) el.classList.add('has-footer');
if (rows.length === 4) el.classList.add('equal-height');
if (rows.length >= 1) {
const count = rows.length >= 3 ? 'three-plus' : rows.length;
switch (count) {
case 'three-plus':
// 3+ rows (0:bg, 1:media, 2:copy, ...3:static, last:footer)
// 3+ rows (0:bg, 1:media, 2:copy, ...3:static, last:card-footer)
decorateBgRow(el, head);
rows = tail;
await decorateForeground(el, rows);
Expand Down
17 changes: 16 additions & 1 deletion libs/blocks/merch/merch.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -302,11 +302,26 @@ async function openFragmentModal(path, getModal) {
return modal;
}

export function appendTabName(url) {
const metaPreselectPlan = document.querySelector('meta[name="preselect-plan"]');
if (!metaPreselectPlan?.content) return url;
let urlWithPlan;
try {
urlWithPlan = new URL(url);
} catch (err) {
window.lana?.log(`Invalid URL ${url} : ${err}`);
return url;
}
urlWithPlan.searchParams.set('plan', metaPreselectPlan.content);
return urlWithPlan.href;
}

async function openExternalModal(url, getModal) {
await loadStyle(`${getConfig().base}/blocks/iframe/iframe.css`);
const root = createTag('div', { class: 'milo-iframe' });
const urlWithTabName = appendTabName(url);
createTag('iframe', {
src: url,
src: urlWithTabName,
frameborder: '0',
marginwidth: '0',
marginheight: '0',
Expand Down
70 changes: 34 additions & 36 deletions libs/deps/mas/merch-card-all.js
View file

Large diffs are not rendered by default.

34 changes: 16 additions & 18 deletions libs/deps/mas/merch-card.js
View file

Large diffs are not rendered by default.

26 changes: 12 additions & 14 deletions libs/features/mas/web-components/src/merch-card.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -379,14 +379,18 @@ export class MerchCard extends LitElement {
`}`;
}

get promoBottom() {
return this.classList.contains('promo-bottom');
}

renderSegment() {
return html` ${this.badge}
<div class="body">
<slot name="heading-xs"></slot>
<slot name="body-xxs"></slot>
<slot name="promo-text"></slot>
<slot name="callout-content"></slot>
${!this.promoBottom ? html`<slot name="promo-text"></slot><slot name="callout-content"></slot>` : ''}
<slot name="body-xs"></slot>
${this.promoBottom ? html`<slot name="promo-text"></slot><slot name="callout-content"></slot>` : ''}
</div>
<hr />
${this.secureLabelFooter}`;
Expand All @@ -399,19 +403,15 @@ export class MerchCard extends LitElement {
<slot name="heading-xs"></slot>
<slot name="heading-m"></slot>
<slot name="body-xxs"></slot>
<slot name="promo-text"></slot>
<slot name="callout-content"></slot>
${!this.promoBottom ? html`<slot name="promo-text"></slot><slot name="callout-content"></slot> ` : ''}
<slot name="body-xs"></slot>
${this.promoBottom ? html`<slot name="promo-text"></slot><slot name="callout-content"></slot> ` : ''}
${this.stockCheckbox}
</div>
<slot name="quantity-select"></slot>
${this.secureLabelFooter}`;
}

get promoBottom() {
return this.classList.contains('promo-bottom');
}

renderCatalog() {
return html` <div class="body">
<div class="top-section">
Expand Down Expand Up @@ -453,8 +453,7 @@ export class MerchCard extends LitElement {
<slot name="icons"></slot>
<slot name="heading-xs"></slot>
<slot name="body-xxs"></slot>
<slot name="promo-text"></slot>
<slot name="body-xs"></slot>
${this.promoBottom ? html`<slot name="body-xs"></slot><slot name="promo-text"></slot>` : html`<slot name="promo-text"></slot><slot name="body-xs"></slot>`}
</div>
${this.evergreen
? html`
Expand Down Expand Up @@ -489,9 +488,9 @@ export class MerchCard extends LitElement {
<slot name="icons"></slot>
<slot name="heading-xs"></slot>
<slot name="body-xxs"></slot>
<slot name="promo-text"></slot>
<slot name="callout-content"></slot>
${!this.promoBottom ? html`<slot name="promo-text"></slot><slot name="callout-content"></slot>` : ''}
<slot name="body-xs"></slot>
${this.promoBottom ? html`<slot name="promo-text"></slot><slot name="callout-content"></slot>` : ''}
</div>
${this.secureLabelFooter}`;
}
Expand Down Expand Up @@ -540,8 +539,7 @@ export class MerchCard extends LitElement {
<slot name="icons"></slot> ${this.badge}
<slot name="heading-xs"></slot>
<slot name="heading-m"></slot>
<slot name="promo-text"></slot>
<slot name="body-xs"></slot>
${this.promoBottom ? html`<slot name="body-xs"></slot><slot name="promo-text"></slot>` : html`<slot name="promo-text"></slot><slot name="body-xs"></slot>`}
<footer><slot name="footer"></slot></footer>
${this.defaultSlot}
</div>`;
Expand Down
3 changes: 2 additions & 1 deletion libs/martech/martech.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,8 @@ function sendTargetResponseAnalytics(failure, responseStart, timeout, message) {
const timeoutTime = roundToQuarter(timeout);
let val = `target response time ${responseTime}:timed out ${failure}:timeout ${timeoutTime}`;
if (message) val += `:${message}`;
window.alloy('sendEvent', {
// eslint-disable-next-line no-underscore-dangle
window._satellite?.track?.('event', {
documentUnloading: true,
xdm: {
eventType: 'web.webinteraction.linkClicks',
Expand Down
4 changes: 0 additions & 4 deletions libs/styles/styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -874,10 +874,6 @@ a.static:hover {
.con-block.xl-spacing-static-bottom-tablet { padding-bottom: var(--spacing-xl-static); }
.con-block.xxl-spacing-static-bottom-tablet { padding-bottom: var(--spacing-xxl-static); }
.con-block.xxxl-spacing-static-bottom-tablet { padding-bottom: var(--spacing-xxxl-static); }

/* margin */
.con-block.margin-top-tablet { margin-top: var(--spacing-s); }
.con-block.margin-bottom-tablet { margin-bottom: var(--spacing-s); }
}

/* tablet large up */
Expand Down
19 changes: 16 additions & 3 deletions libs/utils/utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -865,8 +865,9 @@ export async function loadMartech({
return true;
}

const query = PAGE_URL.searchParams.get('martech');
if (query === 'off' || getMetadata('martech') === 'off') {
if (PAGE_URL.searchParams.get('martech') === 'off'
|| PAGE_URL.searchParams.get('marketingtech') === 'off'
|| getMetadata('martech') === 'off') {
return false;
}

Expand Down Expand Up @@ -1111,6 +1112,16 @@ async function documentPostSectionLoading(config) {
document.body.appendChild(createTag('div', { id: 'page-load-ok-milo', style: 'display: none;' }));
}

export function partition(arr, fn) {
return arr.reduce(
(acc, val, i, ar) => {
acc[fn(val, i, ar) ? 0 : 1].push(val);
return acc;
},
[[], []],
);
}

async function processSection(section, config, isDoc) {
const inlineFrags = [...section.el.querySelectorAll('a[href*="#_inline"]')];
if (inlineFrags.length) {
Expand All @@ -1124,8 +1135,10 @@ async function processSection(section, config, isDoc) {
}

if (section.preloadLinks.length) {
const preloads = section.preloadLinks.map((block) => loadBlock(block));
const [modals, nonModals] = partition(section.preloadLinks, (block) => block.classList.contains('modal'));
const preloads = nonModals.map((block) => loadBlock(block));
await Promise.all(preloads);
modals.forEach((block) => loadBlock(block));
}

const loaded = section.blocks.map((block) => loadBlock(block));
Expand Down
2 changes: 1 addition & 1 deletion test/blocks/editorial-card/editorial-card.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ describe('editorial-card', () => {
});

it('w/ 4 rows has a footer', () => {
const footer = editorialCards[3].querySelector('.footer');
const footer = editorialCards[3].querySelector('.card-footer');
expect(footer).to.exist;
});

Expand Down
4 changes: 2 additions & 2 deletions test/blocks/editorial-card/mocks/body.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,7 @@ <h3 id="open-key-variant-per-breakpoint-media-has-footer-row">Open key-variant,
</div>
</div>
</div>
<h2>extra static row</h2>
<h2>Empty footer row and extra static row</h2>
<div class="editorial-card click">
<div>
<div></div>
Expand All @@ -141,7 +141,7 @@ <h3>Healine</h3>
</div>
</div>
<div>
<div data-align="justify"><strong><a href="http://adobe.com/learn" target="_blank">Learn More</a></strong> <em><a href="">Watch the Video</a></em> <a href="">another link</a></div>
<div></div>
</div>
</div>
</div>
Expand Down
Loading

0 comments on commit 5401829

Please sign in to comment.