| commit | 50b3a3e17494625cf5a574ccb3b09b1f20668fa9 | [log] [tgz] |
|---|---|---|
| author | Alex Rudenko <[email protected]> | Wed Sep 29 11:01:46 2021 |
| committer | Devtools-frontend LUCI CQ <devtools-frontend-scoped@luci-project-accounts.iam.gserviceaccount.com> | Wed Sep 29 11:58:19 2021 |
| tree | daf6680685065c88edf73b4eccdfef0bf749b77c | |
| parent | 76bad75276d0ec058328c8a0059a97e3882f9395 [diff] [blame] |
Button: support icon only buttons This CL fixes padding for icon only buttons and horizontal centering along with the width for the button so that the parent can be resized. Screenshot: https://i.imgur.com/Kfij3c0.png Bug: none Change-Id: I86137cbbf33d4b389f87dc66f9a903edc785ec48 Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3192852 Commit-Queue: Alex Rudenko <[email protected]> Reviewed-by: Jack Franklin <[email protected]>
diff --git a/front_end/ui/components/buttons/button.css b/front_end/ui/components/buttons/button.css index ac08556..fe627b1 100644 --- a/front_end/ui/components/buttons/button.css +++ b/front_end/ui/components/buttons/button.css
@@ -24,6 +24,8 @@ height: 25px; line-height: 14px; padding: 5px 12px; + justify-content: center; + width: 100%; } button:focus-visible { @@ -69,10 +71,14 @@ border: 1px solid var(--color-background); } -button.with-icon { +button.text-with-icon { padding: 0 12px 0 4px; } +button.only-icon { + padding: 0; +} + button devtools-icon { width: 19px; height: 19px;
