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.

Sign up for GitHub

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

Jump to bottom

update(docs): Update metadata callout style #38296

Merged
merged 1 commit into from
May 22, 2024
Merged

update(docs): Update metadata callout style #38296

merged 1 commit into from
May 22, 2024
+141 −69

Conversation

bnchrch
Copy link
Contributor

@bnchrch bnchrch commented May 16, 2024 •
edited

image.png

image.png

What

We have a new metadata component styling
https://www.figma.com/design/JX15SrsqQK53Gm3Ekg1Dq5/Connector-Quality-Indicators?node-id=78-144&t=IGbmxVgtqAISCxTu-0

How

  1. This adds that styling
  2. It also adds a few new generic components (chip, callout)
  3. Refactors HeaderDecoration to have a few smaller components

Blockers

  1. I went rogue with leaving the availability chips and need approval from @nora-airbyte

@vercel Vercel
Copy link

vercel bot commented May 16, 2024 •
edited

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
airbyte-docs ✅ Ready (Inspect) Visit Preview 💬 Add feedback May 22, 2024 7:19pm

@bnchrch bnchrch mentioned this pull request May 16, 2024
Merged
@bnchrch Graphite App
Copy link
Contributor Author

bnchrch commented May 16, 2024 •
edited

This stack of pull requests is managed by Graphite. Learn more about stacking.

Join @bnchrch and the rest of your teammates on Graphite Graphite

@bnchrch bnchrch marked this pull request as ready for review May 16, 2024 16:18
@bnchrch bnchrch force-pushed the 05-16-update_docs_update_metadata_callout_style branch from ac1d582 to 2c4c3c9 Compare May 16, 2024 16:20
@bnchrch bnchrch force-pushed the 05-16-bug_docs_fix_font_weight_500_omission_being_a_style_rule branch from 44c0a37 to e3ec635 Compare May 16, 2024 21:06
@bnchrch bnchrch force-pushed the 05-16-update_docs_update_metadata_callout_style branch from 2c4c3c9 to 0235267 Compare May 16, 2024 21:06
lmossman
lmossman requested changes May 16, 2024
View reviewed changes
Copy link
Contributor

@lmossman lmossman left a comment

Choose a reason for hiding this comment

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

Had some questions and suggestions, but this is looking good overall!

docusaurus/src/components/Callout.jsx Outdated Show resolved Hide resolved
docusaurus/src/components/Chip.jsx Outdated Show resolved Hide resolved
docusaurus/src/components/Callout.module.css Outdated Show resolved Hide resolved
docusaurus/src/components/Chip.module.css Outdated
line-height: 0.8rem;
text-transform: uppercase;
font-weight: var(--ifm-font-weight-semibold);
color: #252537
Copy link
Contributor

Choose a reason for hiding this comment

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

Did you explicitly make this not point to a color variable because you wanted it to be the same across light and dark mode?

If so, I'd recommend still setting this to a new color variable name and making it the same value across both, just to keep the consistency of having all of our color values in one file and in the same format

docusaurus/src/css/custom.css Outdated Show resolved Hide resolved
docusaurus/src/components/HeaderDecoration.jsx
Comment on lines +53 to +57
<MetadataStat label="Support Level">
<a href="/integrations/connector-support-levels/">
<Chip>{supportLevel}</Chip>
</a>
</MetadataStat>
Copy link
Contributor

Choose a reason for hiding this comment

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

nit: could we vertically center the support level chips so that they are vertically aligned with the Support Level label, similar to how the Availability chips are centered?
Screenshot 2024-05-16 at 2 27 10 PM

@octavia-squidington-iv octavia-squidington-iv requested a review from a team May 22, 2024 16:39
@bnchrch bnchrch force-pushed the 05-16-bug_docs_fix_font_weight_500_omission_being_a_style_rule branch from e3ec635 to a2a5b1a Compare May 22, 2024 17:28
@bnchrch bnchrch force-pushed the 05-16-update_docs_update_metadata_callout_style branch from 0235267 to 0313291 Compare May 22, 2024 17:28
@bnchrch bnchrch requested a review from lmossman May 22, 2024 17:43
@bnchrch
Copy link
Contributor Author

bnchrch commented May 22, 2024

@lmossman This is back up for review :)

lmossman
lmossman approved these changes May 22, 2024
View reviewed changes
Copy link
Contributor

@lmossman lmossman left a comment

Choose a reason for hiding this comment

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

Had one final suggestion, otherwise this LGTM!

docusaurus/src/components/HeaderDecoration.module.css
.metadataStatValue {
display: inline-flex;
align-items: center;
margin: 0;
Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
margin: 0;
margin: 0;
a {
display: inline-flex;
align-items: center;
}

This should fix the vertical alignment issue I mentioned here

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Oh shoot did that last change not fix it?

Looking again!

@bnchrch bnchrch force-pushed the 05-16-update_docs_update_metadata_callout_style branch from 0313291 to 04ba3b5 Compare May 22, 2024 19:11
@bnchrch bnchrch changed the base branch from 05-16-bug_docs_fix_font_weight_500_omission_being_a_style_rule to graphite-base/38296 May 22, 2024 19:12
@graphite-app graphite-app bot changed the base branch from graphite-base/38296 to master May 22, 2024 19:12
@bnchrch bnchrch force-pushed the 05-16-update_docs_update_metadata_callout_style branch from 04ba3b5 to f5f4f81 Compare May 22, 2024 19:12
@bnchrch bnchrch merged commit 36ccc98 into master May 22, 2024
25 checks passed
@bnchrch bnchrch deleted the 05-16-update_docs_update_metadata_callout_style branch May 22, 2024 19:20
@bnchrch Graphite App
Copy link
Contributor Author

bnchrch commented May 22, 2024

Merge activity

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

@lmossman lmossman lmossman approved these changes

@nora-airbyte nora-airbyte Awaiting requested review from nora-airbyte

@timroes timroes Awaiting requested review from timroes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
3 participants
@bnchrch @lmossman @nora-airbyte