Cavemanon/piratepoet
8
Fork 0
Code Pull Requests Actions Releases 16 Activity

Update template selector styles

Browse Source 
MAILPOET-5949
This commit is contained in:
Oluwaseun Olorunsola
2024-12-05 23:00:49 +01:00
committed by Oluwaseun Olorunsola
parent a80a6bf5c5
commit f79c0cec55
2 changed files with 28 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
packages/js/email-editor/src/components/template-select/index.scss
View File

@@ -11,3 +11,26 @@
.block-editor-block-patterns-list__list-item { .block-editor-block-patterns-list__list-item {
overflow: hidden; overflow: hidden;
} }
.email-editor-recent-templates-info {
background-color: #F0F6FC;
margin-bottom: 1.5rem;
padding: 0.5rem;
path { fill: #007CBA; }
}
.email-editor-pattern__list-item {
border: 1px solid #DDD;
border-radius: 4px;
.block-editor-block-preview__container:after {
outline: unset !important;
outline-offset: unset !important;
}
.block-editor-block-patterns-list__item-title {
font-size: unset !important;
padding-left: 1rem;
}
}

11
packages/js/email-editor/src/components/template-select/template-list.tsx
View File

@@ -3,7 +3,6 @@ import { useMemo, memo } from '@wordpress/element';
import { BlockPreview } from '@wordpress/block-editor'; import { BlockPreview } from '@wordpress/block-editor';
import { import {
__experimentalHStack as HStack, // eslint-disable-line __experimentalHStack as HStack, // eslint-disable-line
Notice,
} from '@wordpress/components'; } from '@wordpress/components';
import { Icon, info, blockDefault } from '@wordpress/icons'; import { Icon, info, blockDefault } from '@wordpress/icons';
import { __ } from '@wordpress/i18n'; import { __ } from '@wordpress/i18n';
@@ -47,7 +46,7 @@ function TemplateListBox( {
{ templates.map( ( template ) => ( { templates.map( ( template ) => (
<div <div
key={ `${ template.slug }_${ template.id }` } key={ `${ template.slug }_${ template.id }` }
className="block-editor-block-patterns-list__list-item" className="block-editor-block-patterns-list__list-item email-editor-pattern__list-item"
> >
<div <div
className="block-editor-block-patterns-list__item" className="block-editor-block-patterns-list__item"
@@ -81,9 +80,9 @@ function TemplateListBox( {
/> />
<HStack className="block-editor-patterns__pattern-details"> <HStack className="block-editor-patterns__pattern-details">
<div className="block-editor-block-patterns-list__item-title"> <h4 className="block-editor-block-patterns-list__item-title">
{ template.template.title.rendered } { template.template.title.rendered }
</div> </h4>
</HStack> </HStack>
</Async> </Async>
</div> </div>
@@ -115,7 +114,7 @@ export function TemplateList( {
return ( return (
<div className="block-editor-block-patterns-explorer__list"> <div className="block-editor-block-patterns-explorer__list">
{ selectedCategory === 'recent' && ( { selectedCategory === 'recent' && (
<Notice isDismissible={ false }> <div className="email-editor-recent-templates-info">
<HStack spacing={ 1 } expanded={ false } justify="start"> <HStack spacing={ 1 } expanded={ false } justify="start">
<Icon icon={ info } /> <Icon icon={ info } />
<p> <p>
@@ -125,7 +124,7 @@ export function TemplateList( {
) } ) }
</p> </p>
</HStack> </HStack>
</Notice> </div>
) } ) }
<MemorizedTemplateListBox <MemorizedTemplateListBox