fix(editor): Fix callout component border issue (no-changelog) (#11705)

Co-authored-by: Elias Meire <elias@meire.dev>
This commit is contained in:
Giulio Andreini 2024-11-14 14:25:17 +01:00 committed by GitHub
parent 1a783606b4
commit 61fac4f93f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 11 additions and 8 deletions

View file

@ -23,6 +23,7 @@ interface CalloutProps {
iconless?: boolean;
slim?: boolean;
roundCorners?: boolean;
onlyBottomBorder?: boolean;
}
defineOptions({ name: 'N8nCallout' });
@ -38,6 +39,7 @@ const classes = computed(() => [
$style[props.theme],
props.slim ? $style.slim : '',
props.roundCorners ? $style.round : '',
props.onlyBottomBorder ? $style.onlyBottomBorder : '',
]);
const getIcon = computed(
@ -95,6 +97,12 @@ const getIconSize = computed<IconSize>(() => {
border-radius: var(--border-radius-base);
}
.onlyBottomBorder {
border-top: 0;
border-left: 0;
border-right: 0;
}
.messageSection {
display: flex;
align-items: center;

View file

@ -39,6 +39,7 @@ async function onCloseClick() {
icon-size="medium"
:round-corners="false"
:data-test-id="`banners-${props.name}`"
:only-bottom-border="true"
>
<div :class="[$style.mainContent, !hasTrailingContent ? $style.keepSpace : '']">
<slot name="mainContent" />
@ -78,10 +79,4 @@ async function onCloseClick() {
align-items: center;
gap: var(--spacing-l);
}
:global(.n8n-callout) {
border-top: 0;
border-left: 0;
border-right: 0;
}
</style>

View file

@ -3,7 +3,7 @@
exports[`V1 Banner > should render banner 1`] = `
<div>
<div
class="n8n-callout callout warning callout v1container"
class="n8n-callout callout warning onlyBottomBorder callout v1container"
data-test-id="banners-V1"
role="alert"
>
@ -104,7 +104,7 @@ exports[`V1 Banner > should render banner 1`] = `
exports[`V1 Banner > should render banner with dismiss call if user is owner 1`] = `
<div>
<div
class="n8n-callout callout warning callout v1container"
class="n8n-callout callout warning onlyBottomBorder callout v1container"
data-test-id="banners-V1"
role="alert"
>