| @@ -25,16 +25,17 @@ | ||
| 25 | 25 | width: { duration: 0.3, ease: 'easeInOut' }, |
| 26 | 26 | opacity: { duration: 0.1, ease: 'easeInOut' }, |
| 27 | 27 | }} |
| 28 | 28 | className={classNames( |
| 29 | - 'items-center justify-center gap-0.5 h-full border-0 leading-extra-tight text-white md:inline-flex whitespace-nowrap hover:opacity-80', | |
| 29 | + 'items-center justify-center gap-1 border-0 leading-extra-tight text-white md:inline-flex whitespace-nowrap', | |
| 30 | 30 | { 'opacity-60': open && !isSidebarDocked }, |
| 31 | 31 | // Open, docked sidebar (keeps the spacing) |
| 32 | - { 'mr-1 rtl:ml-1 rtl:mr-0': open && isSidebarDocked }, | |
| 32 | + { 'h-full mr-1 rtl:ml-1 rtl:mr-0': open && isSidebarDocked }, | |
| 33 | 33 | { |
| 34 | 34 | // Styles for when docked sidebar is open |
| 35 | 35 | // Useful to put things here you don't want to animate out |
| 36 | - 'py-0.5 px-1.5 bg-design-main text-design-text': | |
| 36 | + // Pill sizing matches the simple toolbar's .ext-tb-ai-agent | |
| 37 | + 'my-1 ml-1 mr-2 rtl:ml-2 rtl:mr-1 h-6 rounded px-[10px] bg-[#3858e9] hover:bg-[#2145e6]': | |
| 37 | 38 | !isSidebarDocked || (isSidebarDocked && !open), |
| 38 | 39 | }, |
| 39 | 40 | )} |
| 40 | 41 | onClick={() => toggleOpen()} |
| @@ -40,10 +41,8 @@ | ||
| 40 | 41 | onClick={() => toggleOpen()} |
| 41 | 42 | aria-label={__('Open Agent', 'extendify-local')} |
| 42 | 43 | > |
| 43 | 44 | <Icon className="shrink-0" icon={magic} width={20} height={20} /> |
| 44 | - <span className="px-1 leading-none"> | |
| 45 | - {__('AI Agent', 'extendify-local')} | |
| 46 | - </span> | |
| 45 | + <span className="leading-none">{__('AI Agent', 'extendify-local')}</span> | |
| 47 | 46 | </motion.button> |
| 48 | 47 | ); |
| 49 | 48 | }; |
