Skip to content

Summary Block Alignment - #730

Open
petheanraj-mitrah wants to merge 5 commits into
stagefrom
DEVSITE-2522
Open

Summary Block Alignment#730
petheanraj-mitrah wants to merge 5 commits into
stagefrom
DEVSITE-2522

Conversation

@petheanraj-mitrah

@petheanraj-mitrah petheanraj-mitrah commented Aug 12, 2026

Copy link
Copy Markdown
Collaborator

Description

Need to align the Summary Block content to the right. By default, it's aligned to the left, so I've added a new variant to support right alignment.

Jira

https://jira.corp.adobe.com/browse/DEVSITE-2522

Test URL

Before:

https://main--adp-devsite-stage--adobedocs.aem.page/test/petheanraj/summary-right

image

After:

https://devsite-2522--adp-devsite-stage--adobedocs.aem.page/test/petheanraj/summary-right

image

@aem-code-sync

aem-code-sync Bot commented Aug 12, 2026

Copy link
Copy Markdown

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch and validate page speed.
In case there are problems, just click a checkbox below to rerun the respective action.

  • Re-run all PSI checks
  • Re-run failed PSI checks
  • Re-sync branch
Commits

@aem-code-sync

aem-code-sync Bot commented Aug 12, 2026

Copy link
Copy Markdown
Page Scores Audits Google
📱 /test/petheanraj/summary-right PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
🖥️ /test/petheanraj/summary-right PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI

@github-actions

Copy link
Copy Markdown

❌ Test Results

Status: Some tests failed!

🔍 Click to view failed tests
📁 test/blocks/code/code.test.js:

❌ Code block > code > data-playground attributes from class
      AssertionError: expected null to equal 'code-session'
        at n.<anonymous> (test/blocks/code/code.test.js:29:63)


📁 test/blocks/columns/columns.test.js:

❌ Columns block > Columns > columns-container
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at n.<anonymous> (test/blocks/columns/columns.test.js:29:117)

❌ Columns block > Columns > buttons
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at test/blocks/columns/columns.test.js:100:86
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/columns/columns.test.js:95:50)


📁 test/blocks/embed/embed.test.js:

❌ Could not import your test module. Check the browser logs or open the browser in debug mode for more information.


📁 test/blocks/contributors/contributors.test.js:

❌ Contributors block > contributors > firstDiv
      AssertionError: expected null to exist
        at n.<anonymous> (test/blocks/contributors/contributors.test.js:32:28)

❌ Contributors block > contributors > remove divs without children
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at test/blocks/contributors/contributors.test.js:42:44
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/contributors/contributors.test.js:41:51)

❌ Contributors block > contributors > last update div
      AssertionError: expected '' to equal 'https://github.com/AdobeDocs/express-add-ons-docs/commits/main/src/pages/references/index.md'
      + expected - actual
      
      +https://github.com/AdobeDocs/express-add-ons-docs/commits/main/src/pages/references/index.md
      
      at n.<anonymous> (test/blocks/contributors/contributors.test.js:53:40)

❌ Contributors block > contributors > image list div
      AssertionError: expected null to exist
        at test/blocks/contributors/contributors.test.js:71:27
        at Array.forEach (<anonymous>)
        at n.<anonymous> (test/blocks/contributors/contributors.test.js:69:33)


📁 test/blocks/tab/tab-playground.test.js:

❌ Tab block playground metadata > extracts data-playground attributes via decoratePreformattedCode
      AssertionError: expected null to equal 'tab-session'
        at n.<anonymous> (test/blocks/tab/tab-playground.test.js:17:63)


📁 test/blocks/tab/tab.test.js:

❌ Tab block > Tab Button Structure > tab > button load structure
      AssertionError: expected 'tab-button active' to equal 'tab-button'
      + expected - actual
      
      -tab-button active
      +tab-button
      
      at n.<anonymous> (test/blocks/tab/tab.test.js:60:38)

❌ Tab block > Sub-tabs > sub-tab > attributes
      AssertionError: expected 'subTab1' to equal 'subTab3'
      + expected - actual
      
      -subTab1
      +subTab3
      
      at test/blocks/tab/tab.test.js:135:58
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/tab/tab.test.js:133:23)



Test Coverage Report

Overall Coverage Summary

Metric Percentage Coverage
Statements 57.3% 3923/6846
Branches 85.17% 563/661
Functions 52.4% 131/250
Lines 57.3% 3923/6846

Coverage by File/Directory

File Statements Branches Functions Lines
blocks/accordion 96.73% 100% 100% 96.73%
blocks/announcement 76.69% 60% 100% 76.69%
blocks/banner 94.28% 62.5% 100% 94.28%
blocks/cards 92.04% 90% 100% 92.04%
blocks/carousel 77.8% 82.35% 71.42% 77.8%
blocks/code 81.81% 60% 100% 81.81%
blocks/columns 62.59% 75% 100% 62.59%
blocks/contributors 84.23% 56% 100% 84.23%
blocks/edition 91.37% 57.14% 100% 91.37%
blocks/fragment 17.03% 100% 0% 17.03%
blocks/image-text 57.5% 55.55% 100% 57.5%
blocks/info 96.87% 100% 100% 96.87%
blocks/info-card 100% 100% 100% 100%
blocks/info-columns 75% 100% 100% 75%
blocks/list 59.09% 85.71% 100% 59.09%
blocks/mini-resource-card 98% 87.5% 100% 98%
blocks/product-card 78.57% 94.11% 100% 78.57%
blocks/profile-card 96.29% 100% 100% 96.29%
blocks/site-hero 93.93% 80% 100% 93.93%
blocks/summary 98.36% 88.88% 100% 98.36%
blocks/tab 93.25% 96.87% 100% 93.25%
blocks/table 100% 84.61% 100% 100%
blocks/text 50% 83.33% 50% 50%
blocks/title 84% 66.66% 100% 84%
components 43.52% 66.66% 53.84% 43.52%
scripts 49.17% 95.27% 43.08% 49.17%

Coverage report generated at 2026-08-12T11:54:21.036Z

@davids-ensemble davids-ensemble left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This won't work on mobile.
Change the JS so instead of left: 0 it puts right: 0 for your variant.

@petheanraj-mitrah petheanraj-mitrah changed the title Devsite 2522 Summary Block Alignment Aug 13, 2026
@github-actions

Copy link
Copy Markdown

❌ Test Results

Status: Some tests failed!

🔍 Click to view failed tests
📁 test/blocks/code/code.test.js:

❌ Code block > code > data-playground attributes from class
      AssertionError: expected null to equal 'code-session'
        at n.<anonymous> (test/blocks/code/code.test.js:29:63)


📁 test/blocks/columns/columns.test.js:

❌ Columns block > Columns > columns-container
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at n.<anonymous> (test/blocks/columns/columns.test.js:29:117)

❌ Columns block > Columns > buttons
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at test/blocks/columns/columns.test.js:100:86
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/columns/columns.test.js:95:50)


📁 test/blocks/embed/embed.test.js:

❌ Could not import your test module. Check the browser logs or open the browser in debug mode for more information.


📁 test/blocks/contributors/contributors.test.js:

❌ Contributors block > contributors > firstDiv
      AssertionError: expected null to exist
        at n.<anonymous> (test/blocks/contributors/contributors.test.js:32:28)

❌ Contributors block > contributors > remove divs without children
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at test/blocks/contributors/contributors.test.js:42:44
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/contributors/contributors.test.js:41:51)

❌ Contributors block > contributors > last update div
      AssertionError: expected '' to equal 'https://github.com/AdobeDocs/express-add-ons-docs/commits/main/src/pages/references/index.md'
      + expected - actual
      
      +https://github.com/AdobeDocs/express-add-ons-docs/commits/main/src/pages/references/index.md
      
      at n.<anonymous> (test/blocks/contributors/contributors.test.js:53:40)

❌ Contributors block > contributors > image list div
      AssertionError: expected null to exist
        at test/blocks/contributors/contributors.test.js:71:27
        at Array.forEach (<anonymous>)
        at n.<anonymous> (test/blocks/contributors/contributors.test.js:69:33)


📁 test/blocks/tab/tab-playground.test.js:

❌ Tab block playground metadata > extracts data-playground attributes via decoratePreformattedCode
      AssertionError: expected null to equal 'tab-session'
        at n.<anonymous> (test/blocks/tab/tab-playground.test.js:17:63)


📁 test/blocks/tab/tab.test.js:

❌ Tab block > Tab Button Structure > tab > button load structure
      AssertionError: expected 'tab-button active' to equal 'tab-button'
      + expected - actual
      
      -tab-button active
      +tab-button
      
      at n.<anonymous> (test/blocks/tab/tab.test.js:60:38)

❌ Tab block > Sub-tabs > sub-tab > attributes
      AssertionError: expected 'subTab1' to equal 'subTab3'
      + expected - actual
      
      -subTab1
      +subTab3
      
      at test/blocks/tab/tab.test.js:135:58
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/tab/tab.test.js:133:23)



Test Coverage Report

Overall Coverage Summary

Metric Percentage Coverage
Statements 56.91% 3905/6861
Branches 84.82% 559/659
Functions 52% 130/250
Lines 56.91% 3905/6861

Coverage by File/Directory

File Statements Branches Functions Lines
blocks/accordion 96.73% 100% 100% 96.73%
blocks/announcement 76.69% 60% 100% 76.69%
blocks/banner 94.28% 62.5% 100% 94.28%
blocks/cards 83.49% 81.81% 100% 83.49%
blocks/carousel 77.8% 82.35% 71.42% 77.8%
blocks/code 81.81% 60% 100% 81.81%
blocks/columns 62.59% 74.35% 100% 62.59%
blocks/contributors 84.23% 56% 100% 84.23%
blocks/edition 91.37% 57.14% 100% 91.37%
blocks/fragment 17.03% 100% 0% 17.03%
blocks/image-text 57.5% 55.55% 100% 57.5%
blocks/info 96.87% 100% 100% 96.87%
blocks/info-card 100% 100% 100% 100%
blocks/info-columns 75% 100% 100% 75%
blocks/list 59.09% 85.71% 100% 59.09%
blocks/mini-resource-card 98% 87.5% 100% 98%
blocks/product-card 78.57% 94.11% 100% 78.57%
blocks/profile-card 96.29% 100% 100% 96.29%
blocks/site-hero 93.93% 80% 100% 93.93%
blocks/summary 98.36% 88.88% 100% 98.36%
blocks/tab 93.25% 96.87% 100% 93.25%
blocks/table 100% 84.61% 100% 100%
blocks/text 50% 83.33% 50% 50%
blocks/title 84% 66.66% 100% 84%
components 43.52% 66.66% 53.84% 43.52%
scripts 48.61% 95.22% 42.55% 48.61%

Coverage report generated at 2026-08-13T05:43:45.280Z

@github-actions

Copy link
Copy Markdown

❌ Test Results

Status: Some tests failed!

🔍 Click to view failed tests
📁 test/blocks/code/code.test.js:

❌ Code block > code > data-playground attributes from class
      AssertionError: expected null to equal 'code-session'
        at n.<anonymous> (test/blocks/code/code.test.js:29:63)


📁 test/blocks/columns/columns.test.js:

❌ Columns block > Columns > columns-container
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at n.<anonymous> (test/blocks/columns/columns.test.js:29:117)

❌ Columns block > Columns > buttons
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at test/blocks/columns/columns.test.js:100:86
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/columns/columns.test.js:95:50)


📁 test/blocks/embed/embed.test.js:

❌ Could not import your test module. Check the browser logs or open the browser in debug mode for more information.


📁 test/blocks/contributors/contributors.test.js:

❌ Contributors block > contributors > firstDiv
      AssertionError: expected null to exist
        at n.<anonymous> (test/blocks/contributors/contributors.test.js:32:28)

❌ Contributors block > contributors > remove divs without children
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at test/blocks/contributors/contributors.test.js:42:44
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/contributors/contributors.test.js:41:51)

❌ Contributors block > contributors > last update div
      AssertionError: expected '' to equal 'https://github.com/AdobeDocs/express-add-ons-docs/commits/main/src/pages/references/index.md'
      + expected - actual
      
      +https://github.com/AdobeDocs/express-add-ons-docs/commits/main/src/pages/references/index.md
      
      at n.<anonymous> (test/blocks/contributors/contributors.test.js:53:40)

❌ Contributors block > contributors > image list div
      AssertionError: expected null to exist
        at test/blocks/contributors/contributors.test.js:71:27
        at Array.forEach (<anonymous>)
        at n.<anonymous> (test/blocks/contributors/contributors.test.js:69:33)


📁 test/blocks/tab/tab-playground.test.js:

❌ Tab block playground metadata > extracts data-playground attributes via decoratePreformattedCode
      AssertionError: expected null to equal 'tab-session'
        at n.<anonymous> (test/blocks/tab/tab-playground.test.js:17:63)


📁 test/blocks/tab/tab.test.js:

❌ Tab block > Tab Button Structure > tab > button load structure
      AssertionError: expected 'tab-button active' to equal 'tab-button'
      + expected - actual
      
      -tab-button active
      +tab-button
      
      at n.<anonymous> (test/blocks/tab/tab.test.js:60:38)

❌ Tab block > Sub-tabs > sub-tab > attributes
      AssertionError: expected 'subTab1' to equal 'subTab3'
      + expected - actual
      
      -subTab1
      +subTab3
      
      at test/blocks/tab/tab.test.js:135:58
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/tab/tab.test.js:133:23)



Test Coverage Report

Overall Coverage Summary

Metric Percentage Coverage
Statements 56.3% 4109/7298
Branches 85.26% 602/706
Functions 53.78% 142/264
Lines 56.3% 4109/7298

Coverage by File/Directory

File Statements Branches Functions Lines
blocks/accordion 96.73% 100% 100% 96.73%
blocks/announcement 76.69% 60% 100% 76.69%
blocks/banner 94.28% 62.5% 100% 94.28%
blocks/cards 83.49% 81.81% 100% 83.49%
blocks/carousel 77.8% 82.35% 71.42% 77.8%
blocks/code 81.81% 60% 100% 81.81%
blocks/columns 62.59% 75% 100% 62.59%
blocks/contributors 84.23% 56% 100% 84.23%
blocks/edition 91.37% 57.14% 100% 91.37%
blocks/fragment 40.65% 100% 50% 40.65%
blocks/image-text 57.5% 55.55% 100% 57.5%
blocks/info 96.87% 100% 100% 96.87%
blocks/info-card 100% 100% 100% 100%
blocks/info-columns 75% 100% 100% 75%
blocks/list 59.09% 85.71% 100% 59.09%
blocks/mini-resource-card 98% 87.5% 100% 98%
blocks/product-card 78.57% 94.11% 100% 78.57%
blocks/profile-card 96.29% 100% 100% 96.29%
blocks/side-nav 18.76% 42.85% 16.66% 18.76%
blocks/site-hero 93.93% 80% 100% 93.93%
blocks/summary 98.36% 88.88% 100% 98.36%
blocks/tab 93.25% 96.87% 100% 93.25%
blocks/table 100% 84.61% 100% 100%
blocks/text 50% 83.33% 50% 50%
blocks/title 84% 66.66% 100% 84%
components 43.52% 66.66% 53.84% 43.52%
scripts 50.55% 95.63% 46.8% 50.55%

Coverage report generated at 2026-08-13T05:44:49.407Z

@petheanraj-mitrah

Copy link
Copy Markdown
Collaborator Author

@davids-ensemble , Fixed mobile responsive issue
image

@davids-ensemble davids-ensemble left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't like !importants in CSS as they override specificity. That's why I said to modify the JS

@github-actions

Copy link
Copy Markdown

❌ Test Results

Status: Some tests failed!

🔍 Click to view failed tests
📁 test/blocks/code/code.test.js:

❌ Code block > code > data-playground attributes from class
      AssertionError: expected null to equal 'code-session'
        at n.<anonymous> (test/blocks/code/code.test.js:29:63)


📁 test/blocks/columns/columns.test.js:

❌ Columns block > Columns > columns-container
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at n.<anonymous> (test/blocks/columns/columns.test.js:29:117)

❌ Columns block > Columns > buttons
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at test/blocks/columns/columns.test.js:100:86
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/columns/columns.test.js:95:50)


📁 test/blocks/embed/embed.test.js:

❌ Could not import your test module. Check the browser logs or open the browser in debug mode for more information.


📁 test/blocks/contributors/contributors.test.js:

❌ Contributors block > contributors > firstDiv
      AssertionError: expected null to exist
        at n.<anonymous> (test/blocks/contributors/contributors.test.js:32:28)

❌ Contributors block > contributors > remove divs without children
      AssertionError: expected false to be true
      + expected - actual
      
      -false
      +true
      
      at test/blocks/contributors/contributors.test.js:42:44
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/contributors/contributors.test.js:41:51)

❌ Contributors block > contributors > last update div
      AssertionError: expected '' to equal 'https://github.com/AdobeDocs/express-add-ons-docs/commits/main/src/pages/references/index.md'
      + expected - actual
      
      +https://github.com/AdobeDocs/express-add-ons-docs/commits/main/src/pages/references/index.md
      
      at n.<anonymous> (test/blocks/contributors/contributors.test.js:53:40)

❌ Contributors block > contributors > image list div
      AssertionError: expected null to exist
        at test/blocks/contributors/contributors.test.js:71:27
        at Array.forEach (<anonymous>)
        at n.<anonymous> (test/blocks/contributors/contributors.test.js:69:33)


📁 test/blocks/tab/tab-playground.test.js:

❌ Tab block playground metadata > extracts data-playground attributes via decoratePreformattedCode
      AssertionError: expected null to equal 'tab-session'
        at n.<anonymous> (test/blocks/tab/tab-playground.test.js:17:63)


📁 test/blocks/tab/tab.test.js:

❌ Tab block > Tab Button Structure > tab > button load structure
      AssertionError: expected 'tab-button active' to equal 'tab-button'
      + expected - actual
      
      -tab-button active
      +tab-button
      
      at n.<anonymous> (test/blocks/tab/tab.test.js:60:38)

❌ Tab block > Sub-tabs > sub-tab > attributes
      AssertionError: expected 'subTab1' to equal 'subTab3'
      + expected - actual
      
      -subTab1
      +subTab3
      
      at test/blocks/tab/tab.test.js:135:58
      at NodeList.forEach (<anonymous>)
      at n.<anonymous> (test/blocks/tab/tab.test.js:133:23)



Test Coverage Report

Overall Coverage Summary

Metric Percentage Coverage
Statements 57.04% 3920/6872
Branches 84.61% 561/663
Functions 52.19% 131/251
Lines 57.04% 3920/6872

Coverage by File/Directory

File Statements Branches Functions Lines
blocks/accordion 96.73% 100% 100% 96.73%
blocks/announcement 76.69% 60% 100% 76.69%
blocks/banner 94.28% 62.5% 100% 94.28%
blocks/cards 83.49% 81.81% 100% 83.49%
blocks/carousel 77.8% 82.35% 71.42% 77.8%
blocks/code 81.81% 60% 100% 81.81%
blocks/columns 62.59% 74.35% 100% 62.59%
blocks/contributors 84.23% 56% 100% 84.23%
blocks/edition 91.37% 57.14% 100% 91.37%
blocks/fragment 17.03% 100% 0% 17.03%
blocks/image-text 57.5% 55.55% 100% 57.5%
blocks/info 96.87% 100% 100% 96.87%
blocks/info-card 100% 100% 100% 100%
blocks/info-columns 75% 100% 100% 75%
blocks/list 59.09% 85.71% 100% 59.09%
blocks/mini-resource-card 98% 87.5% 100% 98%
blocks/product-card 78.57% 94.11% 100% 78.57%
blocks/profile-card 96.29% 100% 100% 96.29%
blocks/site-hero 93.93% 80% 100% 93.93%
blocks/summary 95.83% 75% 100% 95.83%
blocks/tab 93.25% 96.87% 100% 93.25%
blocks/table 100% 84.61% 100% 100%
blocks/text 50% 83.33% 50% 50%
blocks/title 84% 66.66% 100% 84%
components 43.52% 66.66% 53.84% 43.52%
scripts 48.76% 95.23% 42.55% 48.76%

Coverage report generated at 2026-08-17T09:18:35.683Z

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants