✔️ Deploy Preview for patternfly-elements ready!

🔨 Explore the source changes: ef36e95

🔍 Inspect the deploy log: https://app.netlify.com/sites/patternfly-elements/deploys/61031c17c7518500077b9f67

😎 Browse the preview: https://deploy-preview-1726--patternfly-elements.netlify.app

@castastrophe Final feedback.

Website reviewed in Chrome 92.0.4515.107

Accordion

• Seems to be a very thin white line at the top when I hover over the panels below the first one (first one is fine)
• For the text, I changed the weight to 500 and the text is where I want it to be/aligns with the kit
• Something I'd like to discuss with another dev is pfe-icon about available icons and how to customize them if you wanted to create a separate issue for that (or I can)

Disclosure

• The two Disclosure examples on the website have different heights/padding, let's shoot for the same height, padding, and the caret vertically-aligned to the text and vertically-aligned to the center of the component
• Seems there's a slight delay before the caret rotates (like 0.5 seconds), the caret rotating and the panel expand animation should happen at the same time
• NEW tag should be to the right of the text, let's try 24px of padding

Everything else looks great!

@coreyvickery

For the text, I changed the weight to 500 and the text is where I want it to be/aligns with the kit

We are not using variable fonts yet in production so even though you will see a difference on your system when you adjust the weight (because you likely have the font installed on your OS), users only have access to a set number of weights which are the following:

  // These font weights are specific to the Red Hat font families from Google Fonts:
  font-weight--light:        300,
  font-weight--normal:       400,
  font-weight--semi-bold:    600,
  font-weight--bold:         700,

Let me know if you prefer normal or semi-bold. Thanks!

@coreyvickery:

• Thin white line at the top fixed
• The caret vertically-aligned to the text and vertically-aligned to the center of the component
• Fixed delay before the caret rotates
• NEW tag should be to the right of the text, let's try 24px of padding

Something I'd like to discuss with another dev is pfe-icon about available icons and how to customize them if you wanted to create a separate issue for that (or I can)

Please do create an issue and assign it to Potter for discussion!

The two Disclosure examples on the website have different heights/padding, let's shoot for the same height, padding, and the caret vertically-aligned to the text and vertically-aligned to the center of the component

I just want to note that the accent region is a slot so we don't have a lot of control over what goes in there or what styles they use. If someone puts an element in there that is larger than 1em, we're going to see some variance (that's what you're seeing with the disclosure that has the pfe-badge element in it). I've tidied up alignment a bit to try to make this less obvious. Let me know if that works.

@castastrophe

Let me know if you prefer normal or semi-bold. Thanks!

semi-bold please.

I've tidied up alignment a bit to try to make this less obvious. Let me know if that works.

It does, thanks.