mirror of
https://github.com/n8n-io/n8n.git
synced 2024-12-28 22:19:41 -08:00
fix(editor): Fix callout component border issue (no-changelog) (#11705)
Co-authored-by: Elias Meire <elias@meire.dev>
This commit is contained in:
parent
1a783606b4
commit
61fac4f93f
|
@ -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;
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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"
|
||||
>
|
||||
|
|
Loading…
Reference in a new issue