From a1cd4cec8a15e3c8ac826974a29b37e4e1e72e4c Mon Sep 17 00:00:00 2001 From: Garrett LeSage Date: Mon, 20 Jul 2020 17:21:39 +0200 Subject: [PATCH] lib/table: Fix alignment on expanded toggle icons --- pkg/lib/cockpit-components-table.scss | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/pkg/lib/cockpit-components-table.scss b/pkg/lib/cockpit-components-table.scss index 3730850afac9..f25020eab3c2 100644 --- a/pkg/lib/cockpit-components-table.scss +++ b/pkg/lib/cockpit-components-table.scss @@ -80,14 +80,12 @@ // As the width is smaller than the contents, and this is a table, // the cell will stay at the correct width. width: 1px; + } - > .pf-c-button { - padding-top: var(--pf-global--spacer--sm); - padding-bottom: var(--pf-global--spacer--sm); - vertical-align: top; - // Not every browser supports text-top, so define top (above) as a fallback - vertical-align: text-top; - } + .pf-c-button.pf-m-expanded .pf-c-table__toggle-icon { + // Similar to PF4, but with a translate to bump the expanded icon down 3 pixels, + // to better align the expanded form + transform: translateY(3px) rotate(var(--pf-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate)); } // Shrink buttons down a little