Jayden/AFFiNE-Mirror
0
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-09-06 08:50:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(editor): improve border color (#11077)

Browse Source 
close: BS-2781
This commit is contained in:
zzj3720
2025-03-21 11:22:54 +00:00
parent 9986b8b6bc
commit 5dc6fabdaf
19 changed files with 73 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
blocksuite/affine/blocks/block-database/src/block-icons.ts
+7 -3
View File
@@ -16,10 +16,14 @@ import type { BlockModel } from '@blocksuite/store';
import type { TemplateResult } from 'lit'; import type { TemplateResult } from 'lit';
export const getIcon = ( export const getIcon = (
model: BlockModel & { type?: string } model: BlockModel & {
props: {
type?: string;
};
}
): TemplateResult => { ): TemplateResult => {
if (model.flavour === 'affine:paragraph') { if (model.flavour === 'affine:paragraph') {
const type = model.type as ParagraphType; const type = model.props.type as ParagraphType;
return ( return (
{ {
text: TextIcon(), text: TextIcon(),
@@ -39,7 +43,7 @@ export const getIcon = (
bulleted: BulletedListIcon(), bulleted: BulletedListIcon(),
numbered: NumberedListIcon(), numbered: NumberedListIcon(),
todo: CheckBoxCheckLinearIcon(), todo: CheckBoxCheckLinearIcon(),
}[model.type ?? 'bulleted'] ?? BulletedListIcon() }[model.props.type ?? 'bulleted'] ?? BulletedListIcon()
); );
} }
return TextIcon(); return TextIcon();
blocksuite/affine/blocks/block-database/src/detail-panel/block-renderer.ts
+3 -2
View File
@@ -7,7 +7,8 @@ import type {
TableSingleView, TableSingleView,
} from '@blocksuite/data-view/view-presets'; } from '@blocksuite/data-view/view-presets';
import { WithDisposable } from '@blocksuite/global/lit'; import { WithDisposable } from '@blocksuite/global/lit';
import { css, html } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, html, unsafeCSS } from 'lit';
import { property } from 'lit/decorators.js'; import { property } from 'lit/decorators.js';
export class BlockRenderer export class BlockRenderer
@@ -22,7 +23,7 @@ export class BlockRenderer
flex-direction: column; flex-direction: column;
gap: 16px; gap: 16px;
margin-bottom: 12px; margin-bottom: 12px;
border-bottom: 1px solid var(--affine-border-color); border-bottom: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
font-size: var(--affine-font-base); font-size: var(--affine-font-base);
line-height: var(--affine-line-height); line-height: var(--affine-line-height);
} }
blocksuite/affine/blocks/block-database/src/detail-panel/note-renderer.ts
+5 -2
View File
@@ -14,7 +14,8 @@ import type { DetailSlotProps, SingleView } from '@blocksuite/data-view';
import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit'; import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
import type { BaseTextAttributes } from '@blocksuite/store'; import type { BaseTextAttributes } from '@blocksuite/store';
import { computed } from '@preact/signals-core'; import { computed } from '@preact/signals-core';
import { css, html } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, html, unsafeCSS } from 'lit';
import { property } from 'lit/decorators.js'; import { property } from 'lit/decorators.js';
import { isPureText } from '../utils/title-doc.js'; import { isPureText } from '../utils/title-doc.js';
@@ -92,7 +93,9 @@ export class NoteRenderer
protected override render(): unknown { protected override render(): unknown {
return html` return html`
<div <div
style="height: 1px;max-width: var(--affine-editor-width);background-color: var(--affine-border-color);margin: auto;margin-bottom: 16px" style="height: 1px;max-width: var(--affine-editor-width);background-color: ${unsafeCSS(
cssVarV2.layer.insideBorder.border
)};margin: auto;margin-bottom: 16px"
></div> ></div>
${this.renderNote()} ${this.renderNote()}
`; `;
blocksuite/affine/data-view/src/core/common/css-variable.ts
+4 -1
View File
@@ -1,3 +1,6 @@
import { cssVarV2 } from '@toeverything/theme/v2';
import { unsafeCSS } from 'lit';
export const dataViewCssVariable = () => { export const dataViewCssVariable = () => {
return ` return `
--data-view-cell-text-size:14px; --data-view-cell-text-size:14px;
@@ -41,7 +44,7 @@ export const dataViewCommonStyle = (selector: string) => `
fill: var(--affine-icon-color); fill: var(--affine-icon-color);
} }
.dv-border{ .dv-border{
border: 1px solid var(--affine-border-color); border: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
.dv-round-4{ .dv-round-4{
border-radius: 4px; border-radius: 4px;
blocksuite/affine/data-view/src/core/common/properties.ts
+3 -2
View File
@@ -7,7 +7,8 @@ import { ShadowlessElement } from '@blocksuite/block-std';
import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit'; import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
import { InvisibleIcon, ViewIcon } from '@blocksuite/icons/lit'; import { InvisibleIcon, ViewIcon } from '@blocksuite/icons/lit';
import { computed } from '@preact/signals-core'; import { computed } from '@preact/signals-core';
import { css, html } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, html, unsafeCSS } from 'lit';
import { property, query } from 'lit/decorators.js'; import { property, query } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js'; import { classMap } from 'lit/directives/class-map.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
@@ -33,7 +34,7 @@ export class DataViewPropertiesSettingView extends SignalWatcher(
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
border-bottom: 1px solid var(--affine-divider-color); border-bottom: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
.properties-group-title { .properties-group-title {
blocksuite/affine/data-view/src/core/view-manager/single-view.ts
-4
View File
@@ -323,10 +323,6 @@ export abstract class SingleViewBase<
} }
cellValueGet(rowId: string, propertyId: string): unknown { cellValueGet(rowId: string, propertyId: string): unknown {
const type = this.propertyTypeGet(propertyId);
if (!type) {
return;
}
return this.dataSource.cellValueGet(rowId, propertyId); return this.dataSource.cellValueGet(rowId, propertyId);
} }
blocksuite/affine/data-view/src/view-presets/kanban/mobile/card.ts
+4 -3
View File
@@ -3,7 +3,8 @@ import { unsafeCSSVarV2 } from '@blocksuite/affine-shared/theme';
import { ShadowlessElement } from '@blocksuite/block-std'; import { ShadowlessElement } from '@blocksuite/block-std';
import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit'; import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
import { CenterPeekIcon, MoreHorizontalIcon } from '@blocksuite/icons/lit'; import { CenterPeekIcon, MoreHorizontalIcon } from '@blocksuite/icons/lit';
import { css } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, unsafeCSS } from 'lit';
import { property, state } from 'lit/decorators.js'; import { property, state } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js'; import { classMap } from 'lit/directives/class-map.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
@@ -18,7 +19,7 @@ const styles = css`
display: flex; display: flex;
position: relative; position: relative;
flex-direction: column; flex-direction: column;
border: 0.5px solid var(--affine-border-color); border: 0.5px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
border-radius: 8px; border-radius: 8px;
background-color: var(--affine-background-kanban-card-color); background-color: var(--affine-background-kanban-card-color);
@@ -36,7 +37,7 @@ const styles = css`
} }
.mobile-card-header.has-divider { .mobile-card-header.has-divider {
border-bottom: 0.5px solid var(--affine-border-color); border-bottom: 0.5px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
.mobile-card-header-title { .mobile-card-header-title {
blocksuite/affine/data-view/src/view-presets/kanban/pc/card.ts
+4 -3
View File
@@ -2,7 +2,8 @@ import { popupTargetFromElement } from '@blocksuite/affine-components/context-me
import { ShadowlessElement } from '@blocksuite/block-std'; import { ShadowlessElement } from '@blocksuite/block-std';
import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit'; import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
import { CenterPeekIcon, MoreHorizontalIcon } from '@blocksuite/icons/lit'; import { CenterPeekIcon, MoreHorizontalIcon } from '@blocksuite/icons/lit';
import { css } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, unsafeCSS } from 'lit';
import { property, state } from 'lit/decorators.js'; import { property, state } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js'; import { classMap } from 'lit/directives/class-map.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
@@ -17,7 +18,7 @@ const styles = css`
display: flex; display: flex;
position: relative; position: relative;
flex-direction: column; flex-direction: column;
border: 1px solid var(--affine-border-color); border: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
border-radius: 8px; border-radius: 8px;
transition: background-color 100ms ease-in-out; transition: background-color 100ms ease-in-out;
@@ -40,7 +41,7 @@ const styles = css`
} }
.card-header.has-divider { .card-header.has-divider {
border-bottom: 0.5px solid var(--affine-border-color); border-bottom: 0.5px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
affine-data-view-kanban-card .card-header-title { affine-data-view-kanban-card .card-header-title {
blocksuite/affine/data-view/src/view-presets/table/mobile/group.ts
+3 -2
View File
@@ -6,7 +6,8 @@ import {
import { ShadowlessElement } from '@blocksuite/block-std'; import { ShadowlessElement } from '@blocksuite/block-std';
import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit'; import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
import { PlusIcon } from '@blocksuite/icons/lit'; import { PlusIcon } from '@blocksuite/icons/lit';
import { css, html } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, html, unsafeCSS } from 'lit';
import { property, query } from 'lit/decorators.js'; import { property, query } from 'lit/decorators.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
@@ -28,7 +29,7 @@ const styles = css`
cursor: pointer; cursor: pointer;
transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;
padding: 4px 8px; padding: 4px 8px;
border-bottom: 1px solid var(--affine-border-color); border-bottom: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
.data-view-table-group-add-row-button { .data-view-table-group-add-row-button {
blocksuite/affine/data-view/src/view-presets/table/mobile/row.ts
+3 -2
View File
@@ -3,7 +3,8 @@ import { unsafeCSSVarV2 } from '@blocksuite/affine-shared/theme';
import { ShadowlessElement } from '@blocksuite/block-std'; import { ShadowlessElement } from '@blocksuite/block-std';
import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit'; import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
import { CenterPeekIcon, MoreHorizontalIcon } from '@blocksuite/icons/lit'; import { CenterPeekIcon, MoreHorizontalIcon } from '@blocksuite/icons/lit';
import { css, nothing } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, nothing, unsafeCSS } from 'lit';
import { property } from 'lit/decorators.js'; import { property } from 'lit/decorators.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
@@ -21,7 +22,7 @@ export class MobileTableRow extends SignalWatcher(
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
border-bottom: 1px solid var(--affine-border-color); border-bottom: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
position: relative; position: relative;
min-height: 34px; min-height: 34px;
} }
blocksuite/affine/data-view/src/view-presets/table/mobile/table-view.ts
+3 -2
View File
@@ -6,7 +6,8 @@ import {
import type { InsertToPosition } from '@blocksuite/affine-shared/utils'; import type { InsertToPosition } from '@blocksuite/affine-shared/utils';
import { BlockSuiteError, ErrorCode } from '@blocksuite/global/exceptions'; import { BlockSuiteError, ErrorCode } from '@blocksuite/global/exceptions';
import { AddCursorIcon } from '@blocksuite/icons/lit'; import { AddCursorIcon } from '@blocksuite/icons/lit';
import { css } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, unsafeCSS } from 'lit';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
import { html } from 'lit/static-html.js'; import { html } from 'lit/static-html.js';
@@ -41,7 +42,7 @@ export class MobileDataViewTable extends DataViewBase<
.cell-divider { .cell-divider {
width: 1px; width: 1px;
height: 100%; height: 100%;
background-color: var(--affine-border-color); background-color: ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
`; `;
blocksuite/affine/data-view/src/view-presets/table/pc/group.ts
+3 -2
View File
@@ -7,7 +7,8 @@ import { ShadowlessElement } from '@blocksuite/block-std';
import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit'; import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
import { PlusIcon } from '@blocksuite/icons/lit'; import { PlusIcon } from '@blocksuite/icons/lit';
import { effect } from '@preact/signals-core'; import { effect } from '@preact/signals-core';
import { css, html } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, html, unsafeCSS } from 'lit';
import { property, query } from 'lit/decorators.js'; import { property, query } from 'lit/decorators.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
@@ -39,7 +40,7 @@ const styles = css`
cursor: pointer; cursor: pointer;
transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;
padding: 4px 8px; padding: 4px 8px;
border-bottom: 1px solid var(--affine-border-color); border-bottom: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
@media print { @media print {
blocksuite/affine/data-view/src/view-presets/table/pc/header/column-renderer.ts
+8 -3
View File
@@ -1,6 +1,7 @@
import { ShadowlessElement } from '@blocksuite/block-std'; import { ShadowlessElement } from '@blocksuite/block-std';
import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit'; import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
import { css } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, unsafeCSS } from 'lit';
import { property } from 'lit/decorators.js'; import { property } from 'lit/decorators.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
@@ -29,7 +30,9 @@ export class DataViewColumnPreview extends SignalWatcher(
const columnIndex = this.tableViewManager.propertyIndexGet(this.column.id); const columnIndex = this.tableViewManager.propertyIndexGet(this.column.id);
return html` return html`
<div <div
style="background-color: var(--affine-background-primary-color);border-top: 1px solid var(--affine-border-color);box-shadow: var(--affine-shadow-2);" style="background-color: var(--affine-background-primary-color);border-top: 1px solid ${unsafeCSS(
cssVarV2.layer.insideBorder.border
)};box-shadow: var(--affine-shadow-2);"
> >
<affine-database-header-column <affine-database-header-column
.tableViewManager="${this.tableViewManager}" .tableViewManager="${this.tableViewManager}"
@@ -43,7 +46,9 @@ export class DataViewColumnPreview extends SignalWatcher(
height: height + 'px', height: height + 'px',
}); });
return html`<div return html`<div
style="border-top: 1px solid var(--affine-border-color)" style="border-top: 1px solid ${unsafeCSS(
cssVarV2.layer.insideBorder.border
)}"
> >
<div style="${style}"> <div style="${style}">
<affine-database-cell-container <affine-database-cell-container
blocksuite/affine/data-view/src/view-presets/table/pc/header/number-format-bar.ts
+3 -2
View File
@@ -1,5 +1,6 @@
import { WithDisposable } from '@blocksuite/global/lit'; import { WithDisposable } from '@blocksuite/global/lit';
import { css, html, LitElement } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, html, LitElement, unsafeCSS } from 'lit';
import { property } from 'lit/decorators.js'; import { property } from 'lit/decorators.js';
import type { Property } from '../../../../core/view-manager/property.js'; import type { Property } from '../../../../core/view-manager/property.js';
@@ -83,7 +84,7 @@ export class DatabaseNumberFormatBar extends WithDisposable(LitElement) {
.divider { .divider {
width: 100%; width: 100%;
height: 1px; height: 1px;
background-color: var(--affine-border-color); background-color: ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
`; `;
blocksuite/affine/data-view/src/view-presets/table/pc/header/styles.ts
+6 -5
View File
@@ -1,5 +1,6 @@
import { unsafeCSSVarV2 } from '@blocksuite/affine-shared/theme'; import { unsafeCSSVarV2 } from '@blocksuite/affine-shared/theme';
import { baseTheme } from '@toeverything/theme'; import { baseTheme } from '@toeverything/theme';
import { cssVarV2 } from '@toeverything/theme/v2';
import { css, unsafeCSS } from 'lit'; import { css, unsafeCSS } from 'lit';
import { import {
@@ -19,8 +20,8 @@ export const styles = css`
position: relative; position: relative;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
border-bottom: 1px solid var(--affine-border-color); border-bottom: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
border-top: 1px solid var(--affine-border-color); border-top: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
box-sizing: border-box; box-sizing: border-box;
user-select: none; user-select: none;
background-color: var(--affine-background-primary-color); background-color: var(--affine-background-primary-color);
@@ -108,7 +109,7 @@ export const styles = css`
width: 16px; width: 16px;
height: 16px; height: 16px;
background: var(--affine-white); background: var(--affine-white);
border: 1px solid var(--affine-border-color); border: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
border-radius: 4px; border-radius: 4px;
opacity: 0; opacity: 0;
} }
@@ -125,7 +126,7 @@ export const styles = css`
.affine-database-column-text-save-icon:hover { .affine-database-column-text-save-icon:hover {
background: var(--affine-white); background: var(--affine-white);
border-color: var(--affine-border-color); border-color: ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
.affine-database-column-text-icon svg { .affine-database-column-text-icon svg {
@@ -195,7 +196,7 @@ export const styles = css`
} }
.affine-database-column-type-menu-icon { .affine-database-column-type-menu-icon {
border: 1px solid var(--affine-border-color); border: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
border-radius: 4px; border-radius: 4px;
padding: 5px; padding: 5px;
background-color: var(--affine-background-secondary-color); background-color: var(--affine-background-secondary-color);
blocksuite/affine/data-view/src/view-presets/table/pc/row/row.ts
+3 -2
View File
@@ -2,7 +2,8 @@ import { popupTargetFromElement } from '@blocksuite/affine-components/context-me
import { ShadowlessElement } from '@blocksuite/block-std'; import { ShadowlessElement } from '@blocksuite/block-std';
import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit'; import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
import { CenterPeekIcon, MoreHorizontalIcon } from '@blocksuite/icons/lit'; import { CenterPeekIcon, MoreHorizontalIcon } from '@blocksuite/icons/lit';
import { css, nothing } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, nothing, unsafeCSS } from 'lit';
import { property } from 'lit/decorators.js'; import { property } from 'lit/decorators.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
@@ -40,7 +41,7 @@ export class TableRow extends SignalWatcher(WithDisposable(ShadowlessElement)) {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
border-bottom: 1px solid var(--affine-border-color); border-bottom: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
position: relative; position: relative;
} }
blocksuite/affine/data-view/src/view-presets/table/pc/table-view.ts
+3 -2
View File
@@ -4,7 +4,8 @@ import {
popupTargetFromElement, popupTargetFromElement,
} from '@blocksuite/affine-components/context-menu'; } from '@blocksuite/affine-components/context-menu';
import { AddCursorIcon } from '@blocksuite/icons/lit'; import { AddCursorIcon } from '@blocksuite/icons/lit';
import { css } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, unsafeCSS } from 'lit';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
import { html } from 'lit/static-html.js'; import { html } from 'lit/static-html.js';
@@ -119,7 +120,7 @@ const styles = css`
.cell-divider { .cell-divider {
width: 1px; width: 1px;
height: 100%; height: 100%;
background-color: var(--affine-border-color); background-color: ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
.data-view-table-left-bar { .data-view-table-left-bar {
blocksuite/affine/data-view/src/widget-presets/quick-setting-bar/filter/group-panel-view.ts
+5 -4
View File
@@ -16,7 +16,8 @@ import {
PlusIcon, PlusIcon,
} from '@blocksuite/icons/lit'; } from '@blocksuite/icons/lit';
import { computed, type ReadonlySignal } from '@preact/signals-core'; import { computed, type ReadonlySignal } from '@preact/signals-core';
import { css, html, nothing, type TemplateResult } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { css, html, nothing, type TemplateResult, unsafeCSS } from 'lit';
import { property, state } from 'lit/decorators.js'; import { property, state } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js'; import { classMap } from 'lit/directives/class-map.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
@@ -162,17 +163,17 @@ export class FilterGroupView extends SignalWatcher(ShadowlessElement) {
} }
.filter-group-border { .filter-group-border {
border: 1px dashed var(--affine-border-color); border: 1px dashed ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
.filter-group-bg-1 { .filter-group-bg-1 {
background-color: var(--affine-background-secondary-color); background-color: var(--affine-background-secondary-color);
border: 1px solid var(--affine-border-color); border: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
.filter-group-bg-2 { .filter-group-bg-2 {
background-color: var(--affine-background-tertiary-color); background-color: var(--affine-background-tertiary-color);
border: 1px solid var(--affine-border-color); border: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
} }
.hover-style { .hover-style {
blocksuite/affine/data-view/src/widget-presets/tools/presets/table-add-row/new-record-preview.ts
+3 -2
View File
@@ -1,6 +1,7 @@
import { ShadowlessElement } from '@blocksuite/block-std'; import { ShadowlessElement } from '@blocksuite/block-std';
import { PlusIcon } from '@blocksuite/icons/lit'; import { PlusIcon } from '@blocksuite/icons/lit';
import { html } from 'lit'; import { cssVarV2 } from '@toeverything/theme/v2';
import { html, unsafeCSS } from 'lit';
export class NewRecordPreview extends ShadowlessElement { export class NewRecordPreview extends ShadowlessElement {
override render() { override render() {
@@ -15,7 +16,7 @@ export class NewRecordPreview extends ShadowlessElement {
left: 0; left: 0;
height: 32px; height: 32px;
width: 32px; width: 32px;
border: 1px solid var(--affine-border-color); border: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
border-radius: 50%; border-radius: 50%;
background: var(--affine-blue-100); background: var(--affine-blue-100);
box-shadow: box-shadow: