diff --git a/blocksuite/affine/block-embed/src/embed-figma-block/embed-figma-block.ts b/blocksuite/affine/block-embed/src/embed-figma-block/embed-figma-block.ts
index b162ff6b4..91df6d9e3 100644
--- a/blocksuite/affine/block-embed/src/embed-figma-block/embed-figma-block.ts
+++ b/blocksuite/affine/block-embed/src/embed-figma-block/embed-figma-block.ts
@@ -4,7 +4,7 @@ import type {
EmbedFigmaStyles,
} from '@blocksuite/affine-model';
import { BlockSelection } from '@blocksuite/block-std';
-import { html } from 'lit';
+import { html, nothing } from 'lit';
import { state } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js';
import { styleMap } from 'lit/directives/style-map.js';
@@ -57,11 +57,10 @@ export class EmbedFigmaBlockComponent extends EmbedBlockComponent<
super.connectedCallback();
this._cardStyle = this.model.style;
- if (!this.model.description && !this.model.title) {
+ if (!this.model.title) {
this.doc.withoutTransact(() => {
this.doc.updateBlock(this.model, {
title: 'Figma',
- description: this.model.url,
});
});
}
@@ -97,7 +96,6 @@ export class EmbedFigmaBlockComponent extends EmbedBlockComponent<
override renderBlock() {
const { title, description, url } = this.model;
const titleText = title ?? 'Figma';
- const descriptionText = description ?? url;
return this.renderEmbed(
() => html`
@@ -140,9 +138,11 @@ export class EmbedFigmaBlockComponent extends EmbedBlockComponent<
-
- ${descriptionText}
-
+ ${description
+ ? html`
+ ${description}
+
`
+ : nothing}
www.figma.com
diff --git a/blocksuite/affine/block-embed/src/embed-figma-block/styles.ts b/blocksuite/affine/block-embed/src/embed-figma-block/styles.ts
index 2c8023bfa..c65af5ba4 100644
--- a/blocksuite/affine/block-embed/src/embed-figma-block/styles.ts
+++ b/blocksuite/affine/block-embed/src/embed-figma-block/styles.ts
@@ -2,6 +2,7 @@ import {
EMBED_CARD_HEIGHT,
EMBED_CARD_WIDTH,
} from '@blocksuite/affine-shared/consts';
+import { unsafeCSSVarV2 } from '@blocksuite/affine-shared/theme';
import { css, html } from 'lit';
export const styles = css`
@@ -161,7 +162,7 @@ export const styles = css`
white-space: normal;
overflow: hidden;
text-overflow: ellipsis;
- color: var(--affine-text-secondary-color);
+ color: ${unsafeCSSVarV2('icon/primary')};
font-family: var(--affine-font-family);
font-size: var(--affine-font-xs);
@@ -183,10 +184,10 @@ export const styles = css`
width: 12px;
height: 12px;
}
- .affine-embed-figma-content-url-icon .open-icon {
+ .affine-embed-figma-content-url-icon svg {
height: 12px;
width: 12px;
- fill: var(--affine-text-secondary-color);
+ fill: ${unsafeCSSVarV2('icon/primary')};
}
.affine-embed-figma-block.selected {
diff --git a/blocksuite/tests-legacy/snapshots/bookmark.spec.ts/embed-figma.json b/blocksuite/tests-legacy/snapshots/bookmark.spec.ts/embed-figma.json
index bd9bc5b3b..4363fa616 100644
--- a/blocksuite/tests-legacy/snapshots/bookmark.spec.ts/embed-figma.json
+++ b/blocksuite/tests-legacy/snapshots/bookmark.spec.ts/embed-figma.json
@@ -49,7 +49,7 @@
"url": "https://www.figma.com/design/JuXs6uOAICwf4I4tps0xKZ123",
"caption": null,
"title": "Figma",
- "description": "https://www.figma.com/design/JuXs6uOAICwf4I4tps0xKZ123"
+ "description": null
},
"children": []
}