fleet/frontend/components/forms/fields/AutoSizeInputField
Jacob Shandling cbd1a142b4
UI – Refactor edit query > name and description fields to allow reasonable control of pencil icons (#17086)
## –> #16663 
- Display text within `textarea` only when editing. Since the
problematic pencil icons are hidden in this state, it is okay that their
position varies depending on browser (see previous discussions).
- When not editing, text and icon are displayed in a `button` , removing
the dependence of their position on the variable per browser`textarea`
"col"s.
- Note that the wrapping behavior of these texts can affect how much
space is placed after it _within_ its span/textarea – the distance of
the icon from this element remains constant.


https://www.loom.com/share/105df09a447e42cc9e3a71668f5d1d2c?sid=244d0543-cc4b-43ed-83dd-22959cb08879


<img width="1284" alt="Screenshot 2024-02-27 at 2 15 12 PM"
src="https://github.com/fleetdm/fleet/assets/61553566/7b8f7fea-bc57-4699-9d61-d93b19e8d922">



- [x] Changes file added for user-visible changes in `changes/`
- [x] Manual QA for all new/changed functionality

---------

Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
2024-02-29 21:56:31 -08:00
..
_styles.scss UI – Refactor edit query > name and description fields to allow reasonable control of pencil icons (#17086) 2024-02-29 21:56:31 -08:00
AutoSizeInputField.stories.tsx UI – Refactor edit query > name and description fields to allow reasonable control of pencil icons (#17086) 2024-02-29 21:56:31 -08:00
AutoSizeInputField.tsx UI – Refactor edit query > name and description fields to allow reasonable control of pencil icons (#17086) 2024-02-29 21:56:31 -08:00
index.ts Refine and improve policy and query editing interface (#4004) 2022-02-04 15:30:27 -06:00