fix(editor): figma block ui issues (#10167)

This commit is contained in:
Flrande
2025-02-13 13:56:18 +00:00
parent 3ada4bee0d
commit 4e488a1ba1
2 changed files with 14 additions and 7 deletions

View File

@@ -132,7 +132,7 @@ export class EmbedYoutubeBlockComponent extends EmbedBlockComponent<
const { LoadingIcon, EmbedCardBannerIcon } = getEmbedCardIcons(theme);
const titleIcon = loading ? LoadingIcon : YoutubeIcon;
const titleText = loading ? 'Loading...' : title;
const descriptionText = loading ? '' : description;
const descriptionText = loading ? null : description;
const bannerImage =
!loading && image
? html`<object type="image/webp" data=${image} draggable="false">
@@ -216,9 +216,15 @@ export class EmbedYoutubeBlockComponent extends EmbedBlockComponent<
</div>
</div>
<div class="affine-embed-youtube-content-description">
${descriptionText}
</div>
${loading
? html`<div
class="affine-embed-youtube-content-description"
></div>`
: descriptionText
? html`<div class="affine-embed-youtube-content-description">
${descriptionText}
</div>`
: nothing}
<div class="affine-embed-youtube-content-url" @click=${this.open}>
<span>www.youtube.com</span>

View File

@@ -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`
@@ -194,7 +195,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);
@@ -216,10 +217,10 @@ export const styles = css`
width: 12px;
height: 12px;
}
.affine-embed-youtube-content-url-icon .open-icon {
.affine-embed-youtube-content-url-icon svg {
height: 12px;
width: 12px;
fill: var(--affine-text-secondary-color);
fill: ${unsafeCSSVarV2('icon/primary')};
}
.affine-embed-youtube-block.loading {