fixed the gap between note/title placeholder #7171
Conversation
Welcome!
Hello there, congrats on your first PR! We're excited to have you contributing to this project. |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
There was a problem hiding this comment.
PR Summary
This PR addresses a gap issue between the note/title placeholder on mobile devices by modifying the TextAreaInput component's styling.
- Added media query in
TextAreaInput.tsxfor screens max-width 768px, setting absolute positioning forStyledTextAreaContainer - Potential concern: Absolute positioning may cause layout issues in different contexts or screen sizes
- Consider testing the changes across various mobile devices and screen orientations
- Evaluate if the fixed positioning (-40px left, 10px top) is suitable for all use cases
- Slight modification to import order in
TextAreaInput.tsx, which may affect code readability
1 file(s) reviewed, 2 comment(s)
Edit PR Review Bot Settings
| @media (max-width: 768px) { | ||
| position: absolute; | ||
| left: -40px; | ||
| top: 10px; | ||
| } |
There was a problem hiding this comment.
style: Absolute positioning may cause layout issues in different contexts. Consider a more flexible approach.
| import styled from '@emotion/styled'; | ||
| import { ChangeEvent, useEffect, useRef, useState } from 'react'; | ||
| import TextareaAutosize from 'react-textarea-autosize'; |
There was a problem hiding this comment.
style: Import order changed. Ensure this follows the project's import ordering conventions.
|
Why so many package.json and yarn.lock changes? |
added a media query to fix the gap