mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-13 12:55:00 +00:00
fix(core): copy more button style (#10196)
[AF-2228](https://linear.app/affine-design/issue/AF-2228/ui-bug-retry-和-copy-的按钮颜色不一致)
This commit is contained in:
@@ -7,14 +7,15 @@ import {
|
||||
createButtonPopper,
|
||||
NotificationProvider,
|
||||
Tooltip,
|
||||
unsafeCSSVarV2,
|
||||
} from '@blocksuite/affine/blocks';
|
||||
import { noop, WithDisposable } from '@blocksuite/affine/global/utils';
|
||||
import { CopyIcon, MoreHorizontalIcon, ResetIcon } from '@blocksuite/icons/lit';
|
||||
import { css, html, LitElement, nothing, type PropertyValues } from 'lit';
|
||||
import { property, query, state } from 'lit/decorators.js';
|
||||
import { repeat } from 'lit/directives/repeat.js';
|
||||
|
||||
import { type ChatAction } from '../../_common/chat-actions-handle';
|
||||
import { CopyIcon, MoreIcon, RetryIcon } from '../../_common/icons';
|
||||
import { copyText } from '../../utils/editor-actions';
|
||||
|
||||
noop(Tooltip);
|
||||
@@ -39,8 +40,15 @@ export class ChatCopyMore extends WithDisposable(LitElement) {
|
||||
background-color: var(--affine-hover-color);
|
||||
}
|
||||
|
||||
svg {
|
||||
color: var(--affine-icon-color);
|
||||
.button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 2px;
|
||||
|
||||
svg {
|
||||
color: ${unsafeCSSVarV2('icon/primary')};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -89,7 +97,7 @@ export class ChatCopyMore extends WithDisposable(LitElement) {
|
||||
@state()
|
||||
private accessor _showMoreMenu = false;
|
||||
|
||||
@query('.more-button')
|
||||
@query('.button.more')
|
||||
private accessor _moreButton!: HTMLDivElement;
|
||||
|
||||
@query('.more-menu')
|
||||
@@ -167,6 +175,7 @@ export class ChatCopyMore extends WithDisposable(LitElement) {
|
||||
<div class="copy-more">
|
||||
${content
|
||||
? html`<div
|
||||
class="button copy"
|
||||
@click=${async () => {
|
||||
const success = await copyText(host, content);
|
||||
if (success) {
|
||||
@@ -175,23 +184,24 @@ export class ChatCopyMore extends WithDisposable(LitElement) {
|
||||
}}
|
||||
data-testid="action-copy-button"
|
||||
>
|
||||
${CopyIcon}
|
||||
${CopyIcon({ width: '20px', height: '20px' })}
|
||||
<affine-tooltip>Copy</affine-tooltip>
|
||||
</div>`
|
||||
: nothing}
|
||||
${isLast
|
||||
? html`<div
|
||||
class="button retry"
|
||||
@click=${() => this.retry()}
|
||||
data-testid="action-retry-button"
|
||||
>
|
||||
${RetryIcon}
|
||||
${ResetIcon({ width: '20px', height: '20px' })}
|
||||
<affine-tooltip>Retry</affine-tooltip>
|
||||
</div>`
|
||||
: nothing}
|
||||
${isLast
|
||||
? nothing
|
||||
: html`<div class="more-button" @click=${this._toggle}>
|
||||
${MoreIcon}
|
||||
: html`<div class="button more" @click=${this._toggle}>
|
||||
${MoreHorizontalIcon({ width: '20px', height: '20px' })}
|
||||
</div> `}
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user