Skip to content

Conversation

@thisisdano
Copy link
Contributor

@thisisdano thisisdano commented Mar 15, 2021

Alert icon position

The icon position in site alert regressed when we implemented color icon in alerts. This updates the padding and margin in the various site alert variants.

This also reverts the icon alignment to top and reduces its size to be more like the previous icon size.

Before:
Screen Shot 2021-03-15 at 3 45 19 PM

After:
Screen Shot 2021-03-15 at 3 45 01 PM

Sortable table button hover

Fixed the hover state on the sortable indicator to fill the icon with the header text color, not the sorted header text color

Input prefix and suffix

  • Set an explicit white background for inputs on non-white backgrounds
  • Give more padding around prefix or suffix to accommodate dynamically colored backgrounds
  • Note: Input suffix and prefix doesn't support dynamic background colors, like the background color set by autofill values in webkit
  • Added --error and ``--[size]variants toinput-group` just as we have them for `input`

Example of dynamic color background (autofill in chrome) and prefix:
Screen Shot 2021-03-16 at 2 22 21 PM

Banner

Fixed an alignment issue with the Here's how you know button. Note the button has moved down slightly to the text baseline.

Before:
Screen Shot 2021-03-16 at 2 25 41 PM

After:
Screen Shot 2021-03-16 at 2 25 51 PM

@thisisdano thisisdano requested a review from mejiaj March 15, 2021 22:46
@thisisdano thisisdano marked this pull request as draft March 15, 2021 23:24
@thisisdano thisisdano changed the title Fix icon position in site alert 2.11.0 bugfixes Mar 15, 2021
@mejiaj
Copy link
Contributor

mejiaj commented Mar 16, 2021

Emergency icon disappears on IE11

image

@thisisdano
Copy link
Contributor Author

I do see the icon in IE11, not sure what's up...

Screen Shot 2021-03-16 at 9 14 54 AM

@mejiaj
Copy link
Contributor

mejiaj commented Mar 16, 2021

Checked again and am seeing it in IE11. Sorry about that.

- Remove overflow (error state won't show otherwise)
- Add margin for even space when input has a background
- Rewrite input custom sizes
- Display input-group as inline flex/width: auto to fit to custom input sizes
@thisisdano thisisdano marked this pull request as ready for review March 16, 2021 21:33
@thisisdano thisisdano merged commit efb746c into uswds-2.11.0 Mar 16, 2021
@thisisdano thisisdano deleted the dw-fix-site-alert branch March 16, 2021 22:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants