-
Notifications
You must be signed in to change notification settings - Fork 414
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
Add char count and max char info near textarea of comments area #2944
Add char count and max char info near textarea of comments area #2944
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.
Just a couple comments. Great work!
src/ui/scss/component/_comments.scss
Outdated
|
||
.comment__char-count { | ||
align-self: flex-end; | ||
font-size: 12px; |
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.
Can you change this to font-size: var(--font-label);
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.
Will do
@@ -141,10 +146,15 @@ export class FormField extends React.PureComponent<Props> { | |||
</div> | |||
); | |||
} else if (type === 'textarea') { | |||
const hasCharCount = charCount !== undefined && charCount >= 0; | |||
const countInfo = hasCharCount && ( | |||
<span className="comment__char-count">{`${charCount || ''}/${textAreaMaxLength}`}</span> |
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.
Instead of an empty string, this should just be 0
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.
Oh sure, missed that one.
@danielcaldas for the PR! Can we show you some appreciation? Make sure to check out https://lbry.tech/contribute and sign up for the dev mailing list at the bottom! Also, see https://lbry.com/news/hacktoberfest-2019 for the latest Hacktoberfest details. |
PR Checklist
Please check all that apply to this PR using "x":
PR Type
What kind of change does this PR introduce?
#2859
What is the current behavior?
No information about character count. Also no limit on the textarea for comments.
What is the new behavior?
The new behavior is demonstrated in the below GIF.