openvibers/openvibe.live Commits
A folded deploy card is one line at any chat width: the time range truncates with an ellipsis instead of wrapping and pushing the chevron onto a third line (35px per card on the deployed page, was 72).
Changes
@@@ -3953,7 +3953,8 @@ function _deployCss() {const st = document.createElement('style'); st.id = 'chat-deploy-css';st.textContent = `.chat-msg.system.chat-deploy,.chat-msg.system.chat-deploy *{font-style:normal}.chat-deploy{margin:6px 0;padding:7px 10px;border-radius:12px;border:1px solid color-mix(in srgb,var(--accent,#3b82f6) 28%,transparent);background:color-mix(in srgb,var(--accent,#3b82f6) 6%,transparent);color:var(--text-secondary,#a8b3c4);font-size:.84rem;line-height:1.45;container-type:inline-size}--.chat-deploy-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;width:100%;margin:0;padding:0;border:0;background:none;font:inherit;text-align:left;cursor:pointer;color:var(--text-primary,#e6edf7)}.chat-deploy-h::after{content:'▾';margin-left:auto;align-self:center;font-size:.7rem;color:var(--text-muted,#7d8aa0);transition:transform .2s}.chat-deploy:not(.is-collapsed) .chat-deploy-h::after{transform:rotate(180deg)}.chat-deploy-h:focus-visible{outline:2px solid var(--accent,#3b82f6);outline-offset:3px;border-radius:6px}++.chat-deploy-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;width:100%;margin:0;padding:0;border:0;background:none;font:inherit;text-align:left;cursor:pointer;color:var(--text-primary,#e6edf7)}.chat-deploy.is-collapsed .chat-deploy-h{flex-wrap:nowrap;align-items:center}.chat-deploy.is-collapsed .chat-deploy-h b{flex:none;white-space:nowrap}.chat-deploy.is-collapsed .chat-deploy-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}++.chat-deploy-h::after{content:'▾';flex:none;margin-left:auto;align-self:center;font-size:.7rem;color:var(--text-muted,#7d8aa0);transition:transform .2s}.chat-deploy:not(.is-collapsed) .chat-deploy-h::after{transform:rotate(180deg)}.chat-deploy-h:focus-visible{outline:2px solid var(--accent,#3b82f6);outline-offset:3px;border-radius:6px}.chat-deploy.is-collapsed ul,.chat-deploy.is-collapsed .chat-deploy-more,.chat-deploy.is-collapsed .chat-deploy-f a{display:none}.chat-deploy.is-collapsed .chat-deploy-f{margin-top:6px;padding-top:0;border-top:0}.chat-deploy.is-collapsed .chat-deploy-f:not(:has(.chat-deploy-reload)){display:none}.chat-deploy-h b{font-weight:700}.chat-deploy-t{font-size:.76rem;color:var(--text-muted,#7d8aa0)}.chat-deploy ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}.chat-deploy li{display:grid;grid-template-columns:4.6em minmax(0,1fr);gap:8px;align-items:baseline}.chat-deploy li.is-hidden{display:none}.chat-deploy.is-open li.is-hidden{display:grid}
@@ -3953,7 +3953,8 @@ function _deployCss() {
@@ -3953,7 +3953,8 @@ function _deployCss() {
const st = document.createElement('style'); st.id = 'chat-deploy-css';
const st = document.createElement('style'); st.id = 'chat-deploy-css';
st.textContent = `.chat-msg.system.chat-deploy,.chat-msg.system.chat-deploy *{font-style:normal}
st.textContent = `.chat-msg.system.chat-deploy,.chat-msg.system.chat-deploy *{font-style:normal}
.chat-deploy{margin:6px 0;padding:7px 10px;border-radius:12px;border:1px solid color-mix(in srgb,var(--accent,#3b82f6) 28%,transparent);background:color-mix(in srgb,var(--accent,#3b82f6) 6%,transparent);color:var(--text-secondary,#a8b3c4);font-size:.84rem;line-height:1.45;container-type:inline-size}
.chat-deploy{margin:6px 0;padding:7px 10px;border-radius:12px;border:1px solid color-mix(in srgb,var(--accent,#3b82f6) 28%,transparent);background:color-mix(in srgb,var(--accent,#3b82f6) 6%,transparent);color:var(--text-secondary,#a8b3c4);font-size:.84rem;line-height:1.45;container-type:inline-size}
-.chat-deploy-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;width:100%;margin:0;padding:0;border:0;background:none;font:inherit;text-align:left;cursor:pointer;color:var(--text-primary,#e6edf7)}.chat-deploy-h::after{content:'▾';margin-left:auto;align-self:center;font-size:.7rem;color:var(--text-muted,#7d8aa0);transition:transform .2s}.chat-deploy:not(.is-collapsed) .chat-deploy-h::after{transform:rotate(180deg)}.chat-deploy-h:focus-visible{outline:2px solid var(--accent,#3b82f6);outline-offset:3px;border-radius:6px}
+.chat-deploy-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;width:100%;margin:0;padding:0;border:0;background:none;font:inherit;text-align:left;cursor:pointer;color:var(--text-primary,#e6edf7)}.chat-deploy.is-collapsed .chat-deploy-h{flex-wrap:nowrap;align-items:center}.chat-deploy.is-collapsed .chat-deploy-h b{flex:none;white-space:nowrap}.chat-deploy.is-collapsed .chat-deploy-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.chat-deploy-h::after{content:'▾';flex:none;margin-left:auto;align-self:center;font-size:.7rem;color:var(--text-muted,#7d8aa0);transition:transform .2s}.chat-deploy:not(.is-collapsed) .chat-deploy-h::after{transform:rotate(180deg)}.chat-deploy-h:focus-visible{outline:2px solid var(--accent,#3b82f6);outline-offset:3px;border-radius:6px}
.chat-deploy.is-collapsed ul,.chat-deploy.is-collapsed .chat-deploy-more,.chat-deploy.is-collapsed .chat-deploy-f a{display:none}.chat-deploy.is-collapsed .chat-deploy-f{margin-top:6px;padding-top:0;border-top:0}.chat-deploy.is-collapsed .chat-deploy-f:not(:has(.chat-deploy-reload)){display:none}.chat-deploy-h b{font-weight:700}.chat-deploy-t{font-size:.76rem;color:var(--text-muted,#7d8aa0)}
.chat-deploy.is-collapsed ul,.chat-deploy.is-collapsed .chat-deploy-more,.chat-deploy.is-collapsed .chat-deploy-f a{display:none}.chat-deploy.is-collapsed .chat-deploy-f{margin-top:6px;padding-top:0;border-top:0}.chat-deploy.is-collapsed .chat-deploy-f:not(:has(.chat-deploy-reload)){display:none}.chat-deploy-h b{font-weight:700}.chat-deploy-t{font-size:.76rem;color:var(--text-muted,#7d8aa0)}
.chat-deploy ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}
.chat-deploy ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}
.chat-deploy li{display:grid;grid-template-columns:4.6em minmax(0,1fr);gap:8px;align-items:baseline}.chat-deploy li.is-hidden{display:none}.chat-deploy.is-open li.is-hidden{display:grid}
.chat-deploy li{display:grid;grid-template-columns:4.6em minmax(0,1fr);gap:8px;align-items:baseline}.chat-deploy li.is-hidden{display:none}.chat-deploy.is-open li.is-hidden{display:grid}