From 37d001c0e8aa7972f4c27aec2ec35a0e1e4266d6 Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Fri, 31 Jul 2020 09:21:32 +0200 Subject: [PATCH] Align icons on document type (#8531) --- .../less/components/umb-group-builder.less | 27 ++++++++++--------- 1 file changed, 15 insertions(+), 12 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less index 109f3b68f7..8bfe38f490 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less @@ -398,18 +398,21 @@ input.umb-group-builder__group-title-input:disabled:hover { padding: 0 4px; display: flex; border-radius: 3px; -} + align-items: center; -.umb-group-builder__property-tag:first-child { - margin-left: 0; -} + &:first-child { + margin-left: 0; + } -.umb-group-builder__property-tag.-white { - background-color: @white; + &.-white { + background-color: @white; + } } .umb-group-builder__property-tag-icon { margin-right: 3px; + display: flex; + align-items: center; } /* ---------- SORTABLE ---------- */ @@ -512,13 +515,10 @@ input.umb-group-builder__group-sort-value { display: flex; align-items: center; align-content: stretch; - min-height: 80px; - border: 1px solid @gray-9; color: @ui-action-discreet-type; border-radius: @baseBorderRadius; - } .editor-info { @@ -536,6 +536,9 @@ input.umb-group-builder__group-sort-value { } .editor-icon-wrapper { + display: flex; + justify-content: center; + align-items: center; width: 60px; height: 60px; text-align: center; @@ -547,12 +550,12 @@ input.umb-group-builder__group-sort-value { font-size: 32px; } } - + .editor-details { flex: 1 1 auto; margin-top: 10px; margin-bottom: 10px; - + .editor-name { display: block; font-weight: bold; @@ -569,9 +572,9 @@ input.umb-group-builder__group-sort-value { width: 48px; height: 48px; font-size: 18px; - min-height: 80px; color: @ui-action-discreet-type; + &:hover { color: @ui-action-discreet-type-hover; background-color: @ui-action-discreet-hover;