mirror of
https://github.com/pewdiepie-archdaemon/odysseus.git
synced 2026-06-15 17:25:26 -04:00
Settings: clamp logo SVGs to 18px chip + endpoint dropdown gets logo
Provider SVGs in providers.js declare only viewBox (no width/height), so when injected into the 18×18 logo chips they fell back to the browser default of 300×150 and blew out the row. - CSS: SVGs inside settings logo chips (`span[id$="-logo"]`, the 18px wrappers in fallback rows) now stretch to 100%/100% of their container. - Added matching `-logo` chip next to the Endpoint dropdowns in Default Chat Model and Utility Model cards. - New `_syncEndpointLogo` helper mirrors the selected endpoint option's text label through providerLogo() (the select value is a UUID and wouldn't match anything otherwise), and `_fillEndpointSelect` calls it on each render.
This commit is contained in:
@@ -1397,6 +1397,7 @@
|
||||
<div class="settings-col">
|
||||
<div class="settings-row">
|
||||
<label class="settings-label">Endpoint</label>
|
||||
<span class="adm-model-logo" id="set-defaultEpSelect-logo" style="display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;opacity:0.9;color:var(--fg);"></span>
|
||||
<select id="set-defaultEpSelect" class="settings-select"></select>
|
||||
</div>
|
||||
<div class="settings-row">
|
||||
@@ -1420,6 +1421,7 @@
|
||||
<div class="settings-col">
|
||||
<div class="settings-row">
|
||||
<label class="settings-label">Endpoint</label>
|
||||
<span class="adm-model-logo" id="set-utilityEpSelect-logo" style="display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;opacity:0.9;color:var(--fg);"></span>
|
||||
<select id="set-utilityEpSelect" class="settings-select"><option value="">—</option></select>
|
||||
</div>
|
||||
<div class="settings-row">
|
||||
|
||||
@@ -239,6 +239,7 @@ function _fillEndpointSelect(selectEl, endpoints, selected, keepBlank) {
|
||||
} else if (blankText !== null) {
|
||||
selectEl.value = '';
|
||||
}
|
||||
_syncEndpointLogo(selectEl);
|
||||
}
|
||||
|
||||
// Mirror the selected model's provider logo into a sibling <span id="<selectId>-logo">.
|
||||
@@ -256,6 +257,25 @@ function _syncModelLogo(selectEl) {
|
||||
}
|
||||
}
|
||||
|
||||
// Same idea but for endpoint dropdowns where the <option value="…">
|
||||
// is an opaque endpoint UUID — fall back to the option's text label
|
||||
// so providerLogo() can pattern-match (Anthropic, OpenAI, Ollama, …).
|
||||
function _syncEndpointLogo(selectEl) {
|
||||
if (!selectEl) return;
|
||||
const logoEl = document.getElementById(selectEl.id + '-logo');
|
||||
if (!logoEl) return;
|
||||
const apply = () => {
|
||||
const opt = selectEl.options[selectEl.selectedIndex];
|
||||
const label = (opt && opt.textContent) || selectEl.value || '';
|
||||
logoEl.innerHTML = providerLogo(label) || '';
|
||||
};
|
||||
apply();
|
||||
if (!selectEl.dataset.epLogoSync) {
|
||||
selectEl.dataset.epLogoSync = '1';
|
||||
selectEl.addEventListener('change', apply);
|
||||
}
|
||||
}
|
||||
|
||||
function _fillModelSelect(selectEl, models, selected, keepBlank) {
|
||||
if (!selectEl) return;
|
||||
const previous = selected !== undefined ? selected : selectEl.value;
|
||||
|
||||
@@ -14379,6 +14379,17 @@ body:has(.doc-version-panel:not(.hidden)) .hamburger-btn {
|
||||
flex-shrink: 0; color: var(--fg); opacity: 0.85;
|
||||
}
|
||||
.adm-provider-logo svg { width: 14px; height: 14px; }
|
||||
/* Constrain logo SVGs in settings dropdown chips. Many provider
|
||||
icons in providers.js declare only viewBox (no width/height),
|
||||
so without this rule the browser falls back to 300x150 and
|
||||
blows up the row. */
|
||||
.settings-fallback-row > span[style*="width:18px"] svg:not([width]),
|
||||
.settings-row > span[style*="width:18px"] svg:not([width]),
|
||||
span[id$="-logo"] svg:not([width]) {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
.adm-provider-logo:empty {
|
||||
background: color-mix(in srgb, var(--fg) 12%, transparent);
|
||||
border-radius: 50%;
|
||||
|
||||
Reference in New Issue
Block a user