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鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

馃獰 馃悰 Fix auto detect schema change backdrop color CSS #21246

Merged
merged 1 commit into from
Jan 11, 2023

Conversation

edmundito
Copy link
Contributor

What

Fixes a CSS rule that prevents rendering the background that covers the replication settings when schema changes have been detected.

Caused by #19344

How

rgba(var(--color-name), 50%) is not supported, so the color must be extracted into the RGB values first.

@edmundito edmundito self-assigned this Jan 11, 2023
@octavia-squidington-iv octavia-squidington-iv added the area/frontend Related to the Airbyte webapp label Jan 11, 2023
Copy link
Contributor

@krishnaglick krishnaglick left a comment

Choose a reason for hiding this comment

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

LGTM, did not test locally

@@ -16,7 +16,7 @@
@extend %cover;

position: absolute;
background: linear-gradient(180deg, rgba(colors.$grey-50, 0.5) 0%, colors.$white 92.54%);
background: linear-gradient(180deg, rgba(248, 248, 250, 50% /* grey-50 50% */) 0%, colors.$white 92.54%);
Copy link
Contributor

Choose a reason for hiding this comment

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

Fun bug

Copy link
Contributor

Choose a reason for hiding this comment

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

Yeah using rgba() with color variables will no longer work. My suggestion is to treat opaque variants of theme colors as their own variables (see e.g. the overlay background color here) or, if they're really one-off colors, to define them inline like here.

In this case I'm not sure which is more appropriate, probably best to define it inline like you did. But basically I would decouple it from grey-50, since it's a different color.

@edmundito edmundito enabled auto-merge (squash) January 11, 2023 14:42
@edmundito edmundito merged commit 2769f88 into master Jan 11, 2023
@edmundito edmundito deleted the edmundito/fix-auto-detect-schema-bg branch January 11, 2023 14:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area/frontend Related to the Airbyte webapp
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants