carbon-for-ibm-dotcom icon indicating copy to clipboard operation
carbon-for-ibm-dotcom copied to clipboard

[Masthead v2.0.0]: Epic for tracking updates for the new L0/Masthead v2.0.0 (Phase 1)

Open proeung opened this issue 2 years ago • 0 comments

This epic will contain a description of the overall scope, development instructions, and links to all of the issues required to complete the work.

Description

  • This is an epic for the Web Components development effort for infusing the Cloud Masthead design with the Global masthead/L0.
  • See the JIRA ticket for more info about this initiative - https://jsw.ibm.com/browse/AEMSITES-146

Scope

Unified L0/Global Masthead across ibm.com (AEM & Drupal) content ecosystem

  • Creating a unified L0/Global Masthead with a consistent look and feel pulling in design treatments and lessons learned from the Cloud Masthead.
  • This L0/Global Masthead will be deployed across pages on Drupal (v18 and v19), AEM, and existing EI pages.
  • Tentative timeline: ~ End of September

Solution for the long-term implementation of the L0/Masthead v2

01: Integration of the Cloud Masthead to Global Masthead using a feature branch

Based on the 08/16 meeting, we're moving forward with direction 01

  • Take all of the changes within the <dds-cloud-masthead-container> and merge/consolidate them to the global masthead <dds-masthead-container>. All of these changes will be implemented and isolated to feat/masthead-v2.
  • Related epic (https://github.com/carbon-design-system/carbon-for-ibm-dotcom/issues/8054)

Pros

  • A true iteration of the Global Masthead v2
  • We have the opportunity to address the technical debt that has been accumulated from last year's "Unified Cloud Masthead" project sooner.
  • We'll have a single L0 masthead component that could be included in the launch of the C4IBM v2 release.
  • Adopters that have already been using the <dds-masthead-container> component can switch to the new version by ingesting the new CDN build generated from the feature branch.
  • Simplifies and empowers development by avoiding the need to extend and/or recreate behavior from the Global Masthead into the Cloud Masthead.

Cons

  • Potential merge conflicts from changes from the main branch for any changes made to the <dds-masthead-container>.
  • Potentially adds an additional week of work to the existing timeline (see link).
    • Adjusting existing e2e tests, etc
    • Making sure features from Cloud Masthead are migrated/consolidated correctly.

Masthead v2 - feat/masthead-v2 | "/common/carbon-for-ibm-dotcom/version/2.0.0-alpha.1" Using a new alpha tag build job that allows us to publish a new CDN build whenever we needed without having to behold to the C4IBM release schedule.

<dds-masthead-container
  // Endpoint string for the Global L0/Masthead
  data-endpoint="/common/carbon-for-ibm-dotcom/translations/masthead-footer/v2"
></dds-masthead-container>

02: Build on top of the existing Cloud Masthead <dds-cloud-masthead-container> using a feature branch

  • Implement all of the changes from the Masthead v2 to <dds-cloud-masthead-container> or /components/masthead/cloud

Pros

  • Directly build on top of <dds-cloud-masthead-container> and have the changes available in a feature flag component.
  • This is the direction that we're currently taking at the moment.

Cons

  • <dds-cloud-masthead-container> will be implemented by adopters for the end of the Q3 launch and will need to come back and adjust the markup once the Masthead v2 has been officially merged and spun up.
  • Tech debt will still exist and will need to be addressed down the road.
<dds-cloud-masthead-container
  // Endpoint string for the Global L0/Masthead
  data-endpoint="/common/carbon-for-ibm-dotcom/translations/masthead-footer/v2"
></dds-cloud-masthead-container>

Working branch feat/masthead-v2

Design

Design Specs (Developer Hand-off): https://www.figma.com/file/35JfN0Sg4ltIIjM7jBDKMk/Navigation?node-id=1970%3A110712

xlg-1312px-l0 xlg-1312px-menu-states 1312px - MM Model 2 - Updated Type + Scroll Bars

proeung avatar Aug 05 '22 18:08 proeung