-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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
🪟 🎨 Connector Builder light yaml editor theme #19100
Conversation
@@ -15,7 +14,7 @@ const queryClient = new QueryClient({ | |||
|
|||
const StoreProvider: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => ( | |||
<QueryClientProvider client={queryClient}> | |||
<ReactQueryDevtools initialIsOpen={false} position="bottom-right" /> | |||
{/* <ReactQueryDevtools initialIsOpen={false} position="bottom-right" /> */} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Specific reason we commented this out?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Oops, didn't mean to commit that. I had just commented it out while taking a screenshot to not detract from the color-focused demonstration :p
Will undo this
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Except the removal of the ReactQueryDeveloper mode looks fine for me. Once that's restored Code LGTM
* switch to light theme for yaml editor * adjust colors again * rename colors * fix config menu theme * use gradient again for background * undo change to comment out react query dev tools
What
Now that the Airbyte UI's theme has been updated to be a bit brighter, I felt that the Connector Builder yaml editor's dark theme no longer fit well with the rest of the Airbyte UI's colors.
This PR adds a new "airbyte-light" theme to our wrapped monaco editor and uses that in the connector builder, so that it matches better with Airbyte's new theme.
How
Defining a new monaco editor theme in code, exporting colors from the scss file.
Screenshot from BEFORE these changes:
Screenshot AFTER these changes:
🚨 User Impact 🚨
New look for embedded yaml editor in connector builder