style(toolbox): add 3-row grid height and enhance popover prominence
This commit is contained in:
+1
-1
@@ -86,7 +86,7 @@ DOM or live LiteGraph state.
|
||||
- `sidebar_actions.js` owns the sidebar bottom action hover-reveal short labels (100ms), singleton dynamic DOM tooltip bubbles (`#anomalous-sidebar-tooltip-bubble`, 600ms), click/pointerdown instant text/tooltip suppression guards, `isBottomModalOpen` tooltip occlusion guards, and anti-flicker pointer stability.
|
||||
- `tool_registry.js` centralizes metadata, SVG icons (enlarged 20px crisp vector outlines with 2px stroke, #cbd5e1 contrast), and stable IDs for the 9 catalog tools (including Prompt Notes / 提示词笔记) and 2 fixed anchors (Toolbox and Settings).
|
||||
- `shortcut_layout.js` provides tool layout utilities and fallbacks. The bottom shortcut bar maintains the clean fixed 4-tool setup (`scan`, `doctor`, `assistant`, `materials`) plus two anchors (`toolbox`, `settings`) housed in prominent 36px buttons with full click/active text suppression and `.is-active` toggled styling.
|
||||
- `ui_sidebar.js`'s Toolbox modal strictly filters out all tools already present on the bottom bar, presenting a sleek 216px auto-height utility catalog with compact, frameless 40px tiles, downward anchor caret pointing to the toolbox trigger button, 0.18s smooth spring pop-in animation, clean click action execution, and zero obstructive text or beta footers.
|
||||
- `ui_sidebar.js`'s Toolbox modal strictly filters out all tools already present on the bottom bar, presenting a sleek 216px 3-row utility catalog with compact, frameless 44px tiles (providing an elevated silhouette with breathing room for catalog discovery), downward anchor caret pointing to the toolbox trigger button, 0.18s smooth spring pop-in animation, clean click action execution, and zero obstructive text or beta footers.
|
||||
- `ui_grid.js` and model-detail modules own model presentation; `ui_gallery.js`
|
||||
and `ui_gallery_detail.js` own generated-image browsing and inspection.
|
||||
- `ui_recipes.js` / `ui_recipe_detail.js`, `ui_notebooks.js`, and `ui_materials.js`
|
||||
|
||||
@@ -2083,13 +2083,17 @@ export function createDOM() {
|
||||
titleBox.style.alignItems = 'center';
|
||||
titleBox.style.gap = '5px';
|
||||
|
||||
const titleIcon = document.createElement('span');
|
||||
titleIcon.textContent = '🧰';
|
||||
titleIcon.style.fontSize = '11px';
|
||||
|
||||
const titleText = document.createElement('span');
|
||||
titleText.textContent = t('toolboxTitle');
|
||||
titleText.style.fontWeight = '600';
|
||||
titleText.style.fontSize = '10.5px';
|
||||
titleText.style.fontSize = '11px';
|
||||
titleText.style.color = '#fff';
|
||||
|
||||
titleBox.appendChild(titleText);
|
||||
titleBox.append(titleIcon, titleText);
|
||||
|
||||
const closeModalBtn = document.createElement('div');
|
||||
closeModalBtn.innerHTML = '×';
|
||||
|
||||
+4
-2
@@ -1053,10 +1053,10 @@ html:not(.anomalous-floating-entry-enabled) [data-setting-id="Anomalous.ModelBro
|
||||
background: rgba(22, 22, 26, 0.98);
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
border-radius: 9px;
|
||||
padding: 7px 7px 6px;
|
||||
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.85), 0 0 0 1px rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0 18px 44px rgba(0, 0, 0, 0.9), 0 0 0 1px rgba(255, 255, 255, 0.08);
|
||||
z-index: 999999 !important;
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
@@ -1101,6 +1101,8 @@ html:not(.anomalous-floating-entry-enabled) [data-setting-id="Anomalous.ModelBro
|
||||
.anomalous-toolbox-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-rows: repeat(3, 44px);
|
||||
grid-auto-rows: 44px;
|
||||
gap: 4px;
|
||||
margin: 3px 0 1px;
|
||||
align-content: start;
|
||||
|
||||
Reference in New Issue
Block a user