mirror of
https://github.com/OrcaSlicer/OrcaSlicer.git
synced 2026-09-27 10:51:22 +00:00
Back to spacebar for speed dial shortcut. Integrated inline process settings editing. Optimized saerch results
This commit is contained in:
Lam Wei Lun
@@ -77,6 +77,32 @@ body {
|
||||
.fav-tile:hover .fav-unpin,
|
||||
.fav-tile.sel .fav-unpin { opacity: 1; }
|
||||
.fav-unpin:hover { background: rgba(127,127,127,.6); }
|
||||
/* Numbered quick-launch slot (Alt/Option+digit), top-left corner of the fav tile. */
|
||||
.fav-slot {
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
left: 1px;
|
||||
min-width: 11px;
|
||||
height: 11px;
|
||||
padding: 0 2px;
|
||||
border-radius: 3px;
|
||||
font-size: 8px;
|
||||
font-weight: 600;
|
||||
line-height: 11px;
|
||||
text-align: center;
|
||||
color: var(--muted, var(--orca-muted, #6b7280));
|
||||
background: rgba(127,127,127,.22);
|
||||
}
|
||||
/* Transient flash banner pinned to the top of the launcher (e.g. "favourites are full"). */
|
||||
.dial-flash {
|
||||
flex: 0 0 auto;
|
||||
padding: 4px 10px;
|
||||
font-size: 11px;
|
||||
color: var(--plugin-status-warn, #b45309);
|
||||
background: var(--plugin-status-warn-bg, rgba(255,193,7,.22));
|
||||
animation: dial-flash-fade 2.5s ease forwards;
|
||||
}
|
||||
@keyframes dial-flash-fade { 0% { opacity: 0; } 10% { opacity: 1; } 80% { opacity: 1; } 100% { opacity: 0; } }
|
||||
.ctx-menu {
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
@@ -173,6 +199,9 @@ body {
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
.dial-list.empty { overflow-y: hidden; }
|
||||
/* Bottom spacer for the windowed command list: fills the un-rendered tail so the scrollbar reflects
|
||||
the full match count, while only a near-viewport window of rows exists in the DOM. */
|
||||
.dial-spacer-bottom { flex: 0 0 auto; }
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -198,6 +227,17 @@ body {
|
||||
background: var(--speed-tile-bg, #f0f0f0);
|
||||
border: 1px solid var(--speed-tile-border, #d8d8d8);
|
||||
}
|
||||
/* A tile holding a pattern pictogram: drop the hue fill so the stroked SVG reads cleanly. */
|
||||
.tile.has-icon,
|
||||
.fav-tile.has-icon {
|
||||
background: none;
|
||||
border-color: transparent;
|
||||
}
|
||||
.tile-icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
display: block;
|
||||
}
|
||||
.row-left { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
|
||||
.row-eyebrow {
|
||||
font-size: 10px;
|
||||
@@ -254,3 +294,145 @@ kbd {
|
||||
color: var(--muted, var(--orca-muted, #6b7280));
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* ---- inline setting editor card (phase "setting") --------------------------- */
|
||||
.dial-list.setting { overflow-y: auto; }
|
||||
.dial-editor {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
padding: 8px;
|
||||
}
|
||||
.editor-title { font-size: 14px; font-weight: 600; line-height: 1.3; }
|
||||
.editor-title-row { display: flex; align-items: center; gap: 8px; }
|
||||
.editor-preview-icon {
|
||||
flex: 0 0 auto;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
.editor-preview-icon[hidden] { display: none; }
|
||||
.editor-tooltip { font-size: 11px; line-height: 1.4; color: var(--muted, var(--orca-muted, #6b7280)); }
|
||||
.editor-row { display: flex; align-items: center; gap: 8px; min-height: 32px; }
|
||||
.editor-label {
|
||||
flex: 0 0 auto;
|
||||
min-width: 64px;
|
||||
font-size: 12px;
|
||||
color: var(--muted, var(--orca-muted, #6b7280));
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.editor-unit { font-size: 12px; color: var(--muted, var(--orca-muted, #6b7280)); }
|
||||
.editor-row input[type="number"],
|
||||
.editor-row input[type="text"],
|
||||
.editor-row select,
|
||||
.editor-row input[type="color"] {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
height: 30px;
|
||||
padding: 0 8px;
|
||||
border: 1px solid var(--border, var(--orca-border, #ddd));
|
||||
border-radius: 6px;
|
||||
background: var(--panel, var(--orca-bg, #fff));
|
||||
color: var(--text, var(--orca-fg, #1b1c1e));
|
||||
font: inherit;
|
||||
}
|
||||
.editor-row input[type="color"] { padding: 2px 4px; cursor: pointer; }
|
||||
.editor-row input:focus { outline: none; border-color: var(--main-color, var(--orca-accent, #009688)); box-shadow: 0 0 0 2px rgba(0,150,136,.22); }
|
||||
/* custom dropdown (native <select> popups are flaky in the embedded webview) */
|
||||
.ed-dropdown { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
|
||||
.ed-dropdown-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
padding: 0 8px;
|
||||
border: 1px solid var(--border, var(--orca-border, #ddd));
|
||||
border-radius: 6px;
|
||||
background: var(--panel, var(--orca-bg, #fff));
|
||||
color: var(--text, var(--orca-fg, #1b1c1e));
|
||||
font: inherit;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
.ed-dropdown-toggle.open { border-color: var(--main-color, var(--orca-accent, #009688)); }
|
||||
.ed-dropdown-label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.ed-dropdown-caret { flex: 0 0 auto; font-size: 10px; color: var(--muted, var(--orca-muted, #6b7280)); transition: transform .12s; }
|
||||
.ed-dropdown-toggle.open .ed-dropdown-caret { transform: rotate(180deg); }
|
||||
.ed-dropdown-menu {
|
||||
/* Overlay popover, not in-flow: opening it must NOT grow the editor card or the popup window.
|
||||
position/left/top/width/max-height are set from JS on open (position:fixed escapes the
|
||||
scrollable card and launcher overflow, so the menu clips to the popup and scrolls itself).
|
||||
These are only the visual defaults. */
|
||||
position: absolute;
|
||||
z-index: 30;
|
||||
border: 1px solid var(--border, var(--orca-border, #ddd));
|
||||
border-radius: 6px;
|
||||
background: var(--panel, var(--orca-bg, #fff));
|
||||
box-shadow: 0 8px 24px rgba(0,0,0,.16);
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.ed-dropdown-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
padding: 6px 8px;
|
||||
border: 0;
|
||||
background: none;
|
||||
color: var(--text, var(--orca-fg, #1b1c1e));
|
||||
font: inherit;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
.ed-dropdown-option:hover { background: var(--row-hover, rgba(127,127,127,.16)); }
|
||||
.ed-dropdown-option.sel { font-weight: 600; color: var(--main-color, var(--orca-accent, #009688)); }
|
||||
.ed-option-label { flex: 1 1 auto; min-width: 0; }
|
||||
/* Pattern pictograms: filled with the option's icon, and (for values with none) absent. */
|
||||
.ed-option-icon,
|
||||
.ed-dropdown-icon {
|
||||
flex: 0 0 auto;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
.ed-dropdown-icon[hidden] { display: none; }
|
||||
/* toggle switch */
|
||||
.ed-switch { position: relative; flex: 0 0 auto; width: 36px; height: 20px; }
|
||||
.ed-switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
|
||||
.ed-slider {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: #c4c4c4;
|
||||
border-radius: 10px;
|
||||
transition: background .15s;
|
||||
}
|
||||
.ed-slider::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
left: 2px;
|
||||
top: 2px;
|
||||
background: #fff;
|
||||
border-radius: 50%;
|
||||
transition: transform .15s;
|
||||
}
|
||||
.ed-switch input:checked + .ed-slider { background: var(--main-color, var(--orca-accent, #009688)); }
|
||||
.ed-switch input:checked + .ed-slider::before { transform: translateX(16px); }
|
||||
.editor-readonly { padding: 4px 0; font-size: 12px; color: var(--muted, var(--orca-muted, #6b7280)); }
|
||||
.editor-actions { display: flex; gap: 8px; padding-top: 4px; }
|
||||
.ed-btn {
|
||||
padding: 6px 12px;
|
||||
border: 1px solid var(--border, var(--orca-border, #ddd));
|
||||
border-radius: 6px;
|
||||
background: var(--panel, var(--orca-bg, #fff));
|
||||
color: var(--text, var(--orca-fg, #1b1c1e));
|
||||
font: inherit;
|
||||
cursor: pointer;
|
||||
}
|
||||
.ed-btn:hover { background: var(--row-hover, rgba(127,127,127,.16)); }
|
||||
.ed-btn-primary { background: var(--main-color, var(--orca-accent, #009688)); border-color: var(--main-color, var(--orca-accent, #009688)); color: #fff; }
|
||||
.ed-btn-primary:hover { filter: brightness(1.05); }
|
||||
.editor-hint { font-size: 10px; text-align: center; color: var(--muted, var(--orca-muted, #6b7280)); }
|
||||
|
||||
Reference in New Issue
Block a user