xiaoqu/dsh-worktable
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

style: cols picker as 5 white minus lines in taller capsule

Browse Source
This commit is contained in:
Aisland
2026-09-01 02:38:54 +08:00
parent 87a430c00b
commit 025c98d5da
3 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
01_content/lib/client.js
+7 -7
View File
@@ -8178,10 +8178,10 @@ var css = xterm_default + "\n" + [
".dsh-wt_dropItem{width:100%;padding:6px 9px;border:none;border-radius:7px;background:transparent;color:var(--wt-text2);font:inherit;font-size:12px;line-height:17px;cursor:pointer;display:flex;align-items:center;gap:7px;text-align:left}",
".dsh-wt_dropItem:hover{background:var(--wt-chip);color:var(--wt-text)}",
".dsh-wt_dropItemOn{background:var(--wt-chip);color:var(--wt-text);font-weight:600}",
".dsh-wt_vbar{position:relative;width:26px;height:112px;margin:6px auto;border-radius:999px;background:rgba(255,255,255,.08)}",
".dsh-wt_vbarFill{position:absolute;left:0;right:0;top:0;border-radius:999px;background:linear-gradient(180deg,#4f8ef7,#3b82f6);pointer-events:none}",
".dsh-wt_vbarDot{position:absolute;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;padding:0;border:none;border-radius:50%;background:#4f8ef7;cursor:pointer;z-index:2}",
".dsh-wt_vbarDot:hover{background:#9cc6ff}",
".dsh-wt_vbar{position:relative;width:26px;height:130px;margin:6px auto;border-radius:999px;background:rgba(255,255,255,.08)}",
".dsh-wt_vbarFill{position:absolute;left:3px;right:3px;top:0;border-radius:999px;background:linear-gradient(180deg,#4f8ef7,#3b82f6);pointer-events:none}",
".dsh-wt_vbarLine{position:absolute;left:50%;transform:translate(-50%,-50%);width:13px;height:3px;padding:0;border:none;border-radius:2px;background:rgba(255,255,255,.95);cursor:pointer;z-index:2}",
".dsh-wt_vbarLine:hover{background:#fff}",
".dsh-wt_vbarKnob{position:absolute;left:50%;transform:translate(-50%,-50%);width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid rgba(79,142,247,.8);box-shadow:0 1px 4px rgba(0,0,0,.4);z-index:3;pointer-events:none}",
// 工作中的卡片流光：光带加长羽化 + 光层超出卡片（移动时不露整齐边缘），每 ~3.2s 从左上斜扫到右下
".dsh-wt_consoleSweep{position:absolute;inset:-30%;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.01) 0%,rgba(255,255,255,.045) 30%,rgba(255,255,255,.13) 50%,rgba(255,255,255,.045) 70%,rgba(255,255,255,.01) 100%);opacity:0;animation:consoleSweep 3.2s ease-in-out infinite}",
@@ -17505,9 +17505,9 @@ function ConsolePane() {
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "10.8", y: "3", width: "3.2", height: "10", rx: "1.2", fill: "currentColor" })
] }) }),
openMenu === "cols" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-wt_drop dsh-wt_dropCols", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-wt_vbar", children: [
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dsh-wt_vbarFill", style: { height: (cols - 1) / 4 * 100 + "%" } }),
[1, 2, 3, 4, 5].map((v) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", className: "dsh-wt_vbarDot", style: { top: (v - 1) / 4 * 100 + "%" }, "aria-label": String(v), title: String(v), onClick: () => onCols(v) }, v)),
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dsh-wt_vbarKnob", style: { top: (cols - 1) / 4 * 100 + "%" } })
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dsh-wt_vbarFill", style: { height: 8 + (cols - 1) * 21 + "%" } }),
[1, 2, 3, 4, 5].map((v) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", className: "dsh-wt_vbarLine", style: { top: 8 + (v - 1) * 21 + "%" }, "aria-label": String(v), title: String(v), onClick: () => onCols(v) }, v)),
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dsh-wt_vbarKnob", style: { top: 8 + (cols - 1) * 21 + "%" } })
] }) })
] })
] }),
01_content/src/client/split.tsx
+3 -3
View File
@@ -1190,11 +1190,11 @@ function ConsolePane() {
{openMenu === 'cols' && (
<div className="dsh-wt_drop dsh-wt_dropCols">
<div className="dsh-wt_vbar">
<span className="dsh-wt_vbarFill" style={{ height: ((cols - 1) / 4 * 100) + '%' }} />
<span className="dsh-wt_vbarFill" style={{ height: (8 + (cols - 1) * 21) + '%' }} />
{[1, 2, 3, 4, 5].map((v) => (
<button key={v} type="button" className="dsh-wt_vbarDot" style={{ top: ((v - 1) / 4 * 100) + '%' }} aria-label={String(v)} title={String(v)} onClick={() => onCols(v)}></button>
<button key={v} type="button" className="dsh-wt_vbarLine" style={{ top: (8 + (v - 1) * 21) + '%' }} aria-label={String(v)} title={String(v)} onClick={() => onCols(v)}></button>
))}
<span className="dsh-wt_vbarKnob" style={{ top: ((cols - 1) / 4 * 100) + '%' }} />
<span className="dsh-wt_vbarKnob" style={{ top: (8 + (cols - 1) * 21) + '%' }} />
</div>
</div>
)}
01_content/src/client/styles.ts
+4 -4
View File
@@ -426,10 +426,10 @@ export const css = xtermCss + '\n' + [
'.dsh-wt_dropItem{width:100%;padding:6px 9px;border:none;border-radius:7px;background:transparent;color:var(--wt-text2);font:inherit;font-size:12px;line-height:17px;cursor:pointer;display:flex;align-items:center;gap:7px;text-align:left}',
'.dsh-wt_dropItem:hover{background:var(--wt-chip);color:var(--wt-text)}',
'.dsh-wt_dropItemOn{background:var(--wt-chip);color:var(--wt-text);font-weight:600}',
'.dsh-wt_vbar{position:relative;width:26px;height:112px;margin:6px auto;border-radius:999px;background:rgba(255,255,255,.08)}',
'.dsh-wt_vbarFill{position:absolute;left:0;right:0;top:0;border-radius:999px;background:linear-gradient(180deg,#4f8ef7,#3b82f6);pointer-events:none}',
'.dsh-wt_vbarDot{position:absolute;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;padding:0;border:none;border-radius:50%;background:#4f8ef7;cursor:pointer;z-index:2}',
'.dsh-wt_vbarDot:hover{background:#9cc6ff}',
'.dsh-wt_vbar{position:relative;width:26px;height:130px;margin:6px auto;border-radius:999px;background:rgba(255,255,255,.08)}',
'.dsh-wt_vbarFill{position:absolute;left:3px;right:3px;top:0;border-radius:999px;background:linear-gradient(180deg,#4f8ef7,#3b82f6);pointer-events:none}',
'.dsh-wt_vbarLine{position:absolute;left:50%;transform:translate(-50%,-50%);width:13px;height:3px;padding:0;border:none;border-radius:2px;background:rgba(255,255,255,.95);cursor:pointer;z-index:2}',
'.dsh-wt_vbarLine:hover{background:#fff}',
'.dsh-wt_vbarKnob{position:absolute;left:50%;transform:translate(-50%,-50%);width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid rgba(79,142,247,.8);box-shadow:0 1px 4px rgba(0,0,0,.4);z-index:3;pointer-events:none}',
// 工作中的卡片流光：光带加长羽化 + 光层超出卡片（移动时不露整齐边缘），每 ~3.2s 从左上斜扫到右下
'.dsh-wt_consoleSweep{position:absolute;inset:-30%;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.01) 0%,rgba(255,255,255,.045) 30%,rgba(255,255,255,.13) 50%,rgba(255,255,255,.045) 70%,rgba(255,255,255,.01) 100%);opacity:0;animation:consoleSweep 3.2s ease-in-out infinite}',