search

mi6 / ic-ui-kit

Intelligence Community UI Kit (based on StencilJS)
MIT License
25 stars 27 forks source link

Margins on icon buttons #2178

Open GCHQ-Developer-847 opened 3 months ago

GCHQ-Developer-847 commented 3 months ago

Summary of the bug

Icon buttons have a 1px margin at the top and bottom which isn't needed. It means the space they take up technically isn't square and may cause slight alignment issues.

🪜 How to reproduce

  1. Inspect the ic-button element on an icon button, e.g. on the website.
  2. See that its height is 2px more than its width.

📸 Screenshots or code

🧐 Expected behaviour

There shouldn't be an extra margin. The whole icon button should be square.

Additional info

The icon button is used in a few different components, so it will require updates to quite a few visual test screenshots. It's also important to check in these components that this change doesn't cause their measurements / layouts to no longer match their Figma designs.

When completing this ticket please also complete the work done in https://github.com/mi6/ic-ui-kit/pull/2376 to ensure the search icon appears on safari

GCHQ-Developer-741 commented 2 weeks ago

On hold whilst https://github.com/orgs/mi6/projects/2/views/1?filterQuery=-is%3Apr+884&pane=issue&itemId=33108966&issue=mi6%7Cic-ui-kit%7C884 is being completed