GenarrativeAI/Genarrative
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

拆分图片画布素材拖拽桥接

Browse Source 
新增素材拖拽桥接 hook，承接素材拖向画布或文件夹的全局 pointer 监听

恢复认证弹窗 portal 渲染，避免全屏画布遮住账号入口

优化画布背景设置面板，补回当前色、色域、色相、预设、HEX 和恢复默认

补充素材拖拽、认证弹窗和背景面板回归测试并更新文档与 TRACKING
This commit is contained in:
kdletters
2026-06-17 12:20:04 +08:00
parent 5d6be7fd66
commit cdc823611b
11 changed files with 544 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
src/index.css
View File

@@ -4469,12 +4469,12 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
bottom: calc(100% + 0.55rem);
z-index: 24;
display: grid;
width: min(16rem, calc(100vw - 1.5rem));
gap: 0.5rem;
width: min(17.5rem, calc(100vw - 1.5rem));
gap: 0.62rem;
border: 1px solid rgba(203, 213, 225, 0.72);
border-radius: 0.86rem;
background: rgba(255, 255, 255, 0.98);
padding: 0.72rem;
border-radius: 0.92rem;
background: #ffffff;
padding: 0.75rem;
color: #1f2937;
box-shadow: 0 18px 42px rgba(15, 23, 42, 0.15);
}
@@ -4489,6 +4489,29 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
font-weight: 880;
}
.image-canvas-editor__background-current-row {
display: flex;
align-items: center;
gap: 0.5rem;
min-height: 2rem;
border: 1px solid #e2e8f0;
border-radius: 0.6rem;
background: #f8fafc;
padding: 0.35rem 0.45rem;
color: #475569;
font-size: 0.74rem;
font-weight: 820;
}
.image-canvas-editor__background-current-preview {
width: 1.24rem;
height: 1.24rem;
flex: 0 0 auto;
border: 1px solid #cbd5e1;
border-radius: 0.36rem;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}
.image-canvas-editor__background-close {
display: inline-flex;
width: 1.65rem;
@@ -4514,9 +4537,10 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
.image-canvas-editor__background-spectrum {
position: relative;
display: block;
height: 8.2rem;
height: 7.6rem;
overflow: hidden;
border-radius: 0.5rem;
border: 1px solid #e2e8f0;
border-radius: 0.58rem;
background:
linear-gradient(to top, #000000, transparent),
linear-gradient(to right, #ffffff, transparent),
@@ -4575,38 +4599,32 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
}
.image-canvas-editor__background-presets {
display: flex;
gap: 0.62rem;
overflow-x: auto;
padding: 0.08rem 0.05rem 0.18rem;
scrollbar-width: none;
}
.image-canvas-editor__background-presets::-webkit-scrollbar {
display: none;
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.5rem;
padding: 0.02rem;
}
.image-canvas-editor__background-preset {
display: inline-flex;
width: 2rem;
height: 2rem;
flex: 0 0 auto;
width: 100%;
height: 2.15rem;
align-items: center;
justify-content: center;
border: 2px solid transparent;
border-radius: 999px;
background: transparent;
border: 1px solid #e2e8f0;
border-radius: 0.58rem;
background: #f8fafc;
padding: 0;
}
.image-canvas-editor__panel-dock .image-canvas-editor__background-preset {
width: 2rem;
height: 2rem;
width: 100%;
height: 2.15rem;
}
.image-canvas-editor__background-preset[aria-pressed='true'] {
border-color: #38bdf8;
background: #f8fafc;
background: #e0f2fe;
}
.image-canvas-editor__background-preset .image-canvas-editor__background-swatch {
@@ -4616,6 +4634,13 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
}
.image-canvas-editor__background-footer {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 0.5rem;
}
.image-canvas-editor__background-hex-field {
display: flex;
align-items: center;
@@ -4646,7 +4671,8 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
.image-canvas-editor__background-reset {
display: inline-flex;
justify-self: start;
height: 1.9rem;
white-space: nowrap;
align-items: center;
gap: 0.34rem;
border: 1px solid #d7dfe9;