-
Notifications
You must be signed in to change notification settings - Fork 16
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Update Assistant-related icons #210
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The new icons look good to me. 🚀
src/components/ai-input.tsx
Outdated
</div> | ||
) } | ||
<div className="flex items-end p-2"> | ||
<div className="flex items-end py-2"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The horizontal padding removal creates collision between the input and button focus styles, I feel space between the elements is beneficial. I wonder if we might retain the padding or address this in a different manner. WDYT?
Semi-related: I note the focus style color is different between these two elements.
![Overlapping input and button focus styles](https://private-user-images.githubusercontent.com/438664/336851723-9c4a3003-6c08-48ed-90db-0989adab2194.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIyODQ3NDUsIm5iZiI6MTcyMjI4NDQ0NSwicGF0aCI6Ii80Mzg2NjQvMzM2ODUxNzIzLTljNGEzMDAzLTZjMDgtNDhlZC05MGRiLTA5ODlhZGFiMjE5NC5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQwNzI5JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MDcyOVQyMDIwNDVaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT0zMjAwNWI0YjJiNDVjYTRlM2FkZDE4NGUxZGFhNWU0NGM2YmNhYTUwYmRkMzMxODJiNDIwYTMyNDQ4MDBiNWU0JlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZhY3Rvcl9pZD0wJmtleV9pZD0wJnJlcG9faWQ9MCJ9._jqa3oIztXLGoELDc9V0LxFpNDvM3AjcNshriEdNkCo)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good catch. I transferred the button spacing to the margin to preserve the unfocused layout styles, and updated the AIInput focus color to match the Button focus color (and the rest of Studio's input components). 👍
aiinput-border.mov
Co-authored-by: David Calhoun <github@davidcalhoun.me>
Improves Assistant-related icons to match designs.
Proposed Changes
<ReturnIcon />
and<MenuIcon />
in favor of@wordpress/icons
:keyboardReturn
andmoreVertical
.<AssistantIcon />
to regular function component (#)Testing Instructions
STUDIO_AI=true npm start
<AIInput />
componentAssistant
,keyboardReturn
, andmoreVertical
):Pre-merge Checklist