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": [] }