From e73bd8bedbcfc1f7b8e3f38e751beea19e9326da Mon Sep 17 00:00:00 2001 From: Miroslav Mitev Date: Thu, 6 Feb 2025 17:01:53 +0200 Subject: [PATCH] Fix sites dataview header not aligned --- .../sites-dataviews/dataview-style.scss | 22 ++++++++++++------- 1 file changed, 14 insertions(+), 8 deletions(-) diff --git a/client/sites/components/sites-dataviews/dataview-style.scss b/client/sites/components/sites-dataviews/dataview-style.scss index deb689ae6e37..eab010a1335a 100644 --- a/client/sites/components/sites-dataviews/dataview-style.scss +++ b/client/sites/components/sites-dataviews/dataview-style.scss @@ -3,14 +3,20 @@ @import "@wordpress/dataviews/build-style/style.css"; .sites-dataviews { - table.dataviews-view-table .dataviews-view-table__row td { - // dataviews-override: We combine the icon and site title fields to form the horizontal "site" field. - // Without this rule the combined field receives justify-content: space-between but we want the icon to be aligned with the text. - // TODO: This can be removed when https://github.com/WordPress/gutenberg/pull/67226 / Gutenberg 19.8 lands in calypso. - // See https://github.com/Automattic/wp-calypso/pull/96657#discussion_r1853690792 - .components-h-stack { - &:has(.sites-dataviews__site) { - justify-content: flex-start; + table.dataviews-view-table .dataviews-view-table__row { + th { + vertical-align: middle; + } + + td { + // dataviews-override: We combine the icon and site title fields to form the horizontal "site" field. + // Without this rule the combined field receives justify-content: space-between but we want the icon to be aligned with the text. + // TODO: This can be removed when https://github.com/WordPress/gutenberg/pull/67226 / Gutenberg 19.8 lands in calypso. + // See https://github.com/Automattic/wp-calypso/pull/96657#discussion_r1853690792 + .components-h-stack { + &:has(.sites-dataviews__site) { + justify-content: flex-start; + } } } }