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.

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

fix(leadspace): wrong gradient display when in RLT mode #12180

Open
wants to merge 9 commits into
base: main
Choose a base branch
from

Conversation

bruno-amorim
Copy link
Contributor

@bruno-amorim bruno-amorim commented Jan 8, 2025

Related Ticket(s)

Closes # ADCMS-7399

Description

In the Leadspace component, when in RTL mode, the text would be displayed from the right to left but the gradient in the image would still be from the left to the right, causing the text to be unreadable in images with low contrast.

I also took the opportunity to fix the leadspace with video background - when in RTL, the video was not spanning the full width of its container.

@bruno-amorim bruno-amorim requested a review from a team as a code owner January 8, 2025 18:00
@bruno-amorim bruno-amorim requested review from marcelojcs and Valentin-Sorin-Nicolae and removed request for a team January 8, 2025 18:00
Copy link

netlify bot commented Jan 8, 2025

Deploy Preview for ibm-dotcom-web-components-react-wrap ready!

Name Link
🔨 Latest commit 5e62948
🔍 Latest deploy log https://app.netlify.com/sites/ibm-dotcom-web-components-react-wrap/deploys/6788525ef4319b00081937ca
😎 Deploy Preview https://deploy-preview-12180--ibm-dotcom-web-components-react-wrap.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link
Contributor

@marcelojcs marcelojcs left a comment

Choose a reason for hiding this comment

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

The code Changes look great and is passing all tests
Great job!!

@marcelojcs marcelojcs added the Ready to merge Label for the pull requests that are ready to merge label Jan 8, 2025
@Valentin-Sorin-Nicolae
Copy link
Contributor

The gradient is changing using 'rotate(90)' but the image stays the same. I think the image needs a flip also, right?

…-dotcom into fix/leadspace-gradient-issue-rtl
Copy link

netlify bot commented Jan 15, 2025

Deploy Preview for ibm-dotcom-web-components ready!

Name Link
🔨 Latest commit b26b362
🔍 Latest deploy log https://app.netlify.com/sites/ibm-dotcom-web-components/deploys/677fea46d034010008040e53
😎 Deploy Preview https://deploy-preview-12180--ibm-dotcom-web-components.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

…-dotcom into fix/leadspace-gradient-issue-rtl
…morim/carbon-for-ibm-dotcom into fix/leadspace-gradient-issue-rtl
Copy link

netlify bot commented Jan 15, 2025

Deploy Preview for incomparable-wisp-8d6771 ready!

Name Link
🔨 Latest commit 5e62948
🔍 Latest deploy log https://app.netlify.com/sites/incomparable-wisp-8d6771/deploys/6788525e9e112c000875083a
😎 Deploy Preview https://deploy-preview-12180--incomparable-wisp-8d6771.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@marcelojcs marcelojcs closed this Jan 15, 2025
@marcelojcs marcelojcs reopened this Jan 15, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Ready to merge Label for the pull requests that are ready to merge
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants