fix: agent header doesnt shrink properly, so chevrons are sometimes obscured
This commit is contained in:
@@ -33,7 +33,7 @@ const toggleDropdown = (e: MouseEvent) => {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<header class="flex items-center rounded-lg overflow-hidden">
|
<header class="flex items-center rounded-lg overflow-hidden flex-1 min-w-0">
|
||||||
<div :style="isHovered ? 'width: 32px;' : 'width: 0px;'"
|
<div :style="isHovered ? 'width: 32px;' : 'width: 0px;'"
|
||||||
:class="['flex flex-shrink-0 transform-origin-left-center items-center overflow-hidden transition-all duration-150 ease-[cubic-bezier(0.5,_1,_0.89,_1)]', isHovered ? 'opacity-100 scale-100' : 'opacity-0 scale-95']">
|
:class="['flex flex-shrink-0 transform-origin-left-center items-center overflow-hidden transition-all duration-150 ease-[cubic-bezier(0.5,_1,_0.89,_1)]', isHovered ? 'opacity-100 scale-100' : 'opacity-0 scale-95']">
|
||||||
<NuxtLink to="/"
|
<NuxtLink to="/"
|
||||||
@@ -43,7 +43,7 @@ const toggleDropdown = (e: MouseEvent) => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button
|
<button
|
||||||
class="max-w-full transition duration-200 pr-2 cursor-pointer hover:bg-[var(--color-hover)] focus-visible:bg-[var(--color-hover)] rounded-lg"
|
class="shrink-1 max-w-full min-w-0 w-full transition duration-200 pr-2 cursor-pointer hover:bg-[var(--color-hover)] focus-visible:bg-[var(--color-hover)] rounded-lg"
|
||||||
@click="toggleDropdown">
|
@click="toggleDropdown">
|
||||||
<div class="pointer-events-none flex items-center gap-1.5 max-w-full">
|
<div class="pointer-events-none flex items-center gap-1.5 max-w-full">
|
||||||
<div
|
<div
|
||||||
@@ -52,10 +52,10 @@ const toggleDropdown = (e: MouseEvent) => {
|
|||||||
<Icon v-else name="mynaui:check-hexagon" class="w-4 h-4 text-[var(--color-accent)]" />
|
<Icon v-else name="mynaui:check-hexagon" class="w-4 h-4 text-[var(--color-accent)]" />
|
||||||
</div>
|
</div>
|
||||||
<span
|
<span
|
||||||
class="text-sm font-medium text-ellipsis overflow-hidden text-[var(--text-primary)] whitespace-nowrap">
|
class="min-w-0 text-sm font-medium text-ellipsis overflow-hidden text-[var(--text-primary)] whitespace-nowrap">
|
||||||
{{ activeAgent?.name }}
|
{{ activeAgent?.name }}
|
||||||
</span>
|
</span>
|
||||||
<div class="w-4 h-4 text-[var(--text-secondary)]">
|
<div class="shrink-0 w-4 h-4 text-[var(--text-secondary)]">
|
||||||
<Icon
|
<Icon
|
||||||
class="text-4 transform-origin-center-left duration-150 ease-[cubic-bezier(0.5,_1,_0.89,_1)] transition-all"
|
class="text-4 transform-origin-center-left duration-150 ease-[cubic-bezier(0.5,_1,_0.89,_1)] transition-all"
|
||||||
name="mynaui:chevron-up-down" />
|
name="mynaui:chevron-up-down" />
|
||||||
|
|||||||
Reference in New Issue
Block a user