Skip to content

Commit

Permalink
Align icon size + placement in Patterns data view (#57548)
Browse files Browse the repository at this point in the history
* Update pattern icon size + placement

* scope new styles under the dataviews container

---------

Co-authored-by: ntsekouras <[email protected]>
  • Loading branch information
jameskoster and ntsekouras authored Jan 5, 2024
1 parent 49bd0fa commit 58c4c13
Show file tree
Hide file tree
Showing 2 changed files with 18 additions and 13 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -169,7 +169,7 @@ function Title( { item, categoryId } ) {
item.syncStatus === PATTERN_SYNC_TYPES.full ? symbol : undefined;
}
return (
<HStack alignment="center" justify="flex-start" spacing={ 3 }>
<HStack alignment="center" justify="flex-start" spacing={ 2 }>
{ itemIcon && ! isNonUserPattern && (
<Tooltip
placement="top"
Expand All @@ -183,6 +183,18 @@ function Title( { item, categoryId } ) {
/>
</Tooltip>
) }
{ item.type === PATTERN_TYPES.theme && (
<Tooltip
placement="top"
text={ __( 'This pattern cannot be edited.' ) }
>
<Icon
className="edit-site-patterns__pattern-lock-icon"
icon={ lockSmall }
size={ 24 }
/>
</Tooltip>
) }
<Flex as="span" gap={ 0 } justify="left">
{ item.type === PATTERN_TYPES.theme ? (
item.title
Expand All @@ -199,18 +211,6 @@ function Title( { item, categoryId } ) {
</Button>
</Heading>
) }
{ item.type === PATTERN_TYPES.theme && (
<Tooltip
placement="top"
text={ __( 'This pattern cannot be edited.' ) }
>
<Icon
className="edit-site-patterns__pattern-lock-icon"
icon={ lockSmall }
size={ 24 }
/>
</Tooltip>
) }
</Flex>
</HStack>
);
Expand Down
5 changes: 5 additions & 0 deletions packages/edit-site/src/components/page-patterns/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -237,6 +237,11 @@
}
}

.edit-site-patterns__pattern-icon {
fill: var(--wp-block-synced-color);
flex-shrink: 0;
}

.edit-site-patterns__pattern-lock-icon {
min-width: min-content;
}
Expand Down

0 comments on commit 58c4c13

Please sign in to comment.