Skip to content
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

Indicate if input value is invalid #5422

Merged
merged 5 commits into from Oct 4, 2019

Conversation

u1-liquid
Copy link
Contributor

@u1-liquid u1-liquid commented Sep 11, 2019

Summary

Related #5375 (resolve?)

  • 今のui-inputは値のValidation状態を分かりづらい(Mouseホバーで出るtooltipでやっとわかる)
  • ui-inputの値のValidationがfalseになってもv自体がエラーになるわけでもないので普通にnull扱いされる(これは仕様?)

→ ユーザーにValidationがfailだということを知らせる必要がありそう

recording

(実はthis.$refs.input.validationMessage を常に見えるtooltipとかで見せたかったがどうすればいいのかよくわかんなかったのでこれ)

@acid-chicken
Copy link
Member

(実はthis.$refs.input.validationMessage を常に見えるtooltipとかで見せたかったがどうすればいいのかよくわかんなかったのでこれ)

パスワード強度を表示するやつを流用するのではダメですか? B47B3C93-A65F-41B3-A794-4221B468E7FC

@u1-liquid
Copy link
Contributor Author

パスワード強度を表示するやつを流用するのではダメですか?

あちこちで使われてる共用コンポーネントなのであれだとpoll-editorなどのレイアウトが崩れるのを確認したのでなるべく既存のレイアウトに影響の無い方法にしたかったんですね

@mei23
Copy link
Contributor

mei23 commented Sep 12, 2019

アイコン変わってるの気づかなかったので
ブラウザ標準みたいに色変えるくらいじゃないとダメかも
image

@mei23
Copy link
Contributor

mei23 commented Sep 13, 2019

ふちどりはinput:invalidで出来るけどいまいちスペースがなかった

@syuilo
Copy link
Member

syuilo commented Sep 13, 2019

image
こんな感じかな

@mei23
Copy link
Contributor

mei23 commented Sep 13, 2019

こんなのとか
image
u1-liquid/misskey@indicate-input-invalid...mei23:mei-90914-invalid

@u1-liquid
Copy link
Contributor Author

両方にしちゃってもいいかもしれませんね()

@mei23
Copy link
Contributor

mei23 commented Sep 14, 2019

デフォルトテーマのフォーカス状態がこんな感じなので、下線だけだとわからない気がしたり
image

@u1-liquid
Copy link
Contributor Author

image
こうなりましたけど

image
これの解決策募集中:innocent:

@mei23
Copy link
Contributor

mei23 commented Sep 15, 2019

> .title
	white-space nowrap
	width 133%
	overflow hidden
	text-overflow ellipsis

image

@u1-liquid
Copy link
Contributor Author

image

@mei23 mei23 self-requested a review September 28, 2019 20:52
@u1-liquid
Copy link
Contributor Author

@syuilo やっぱり下の線も色変えた方が良いかな?

@syuilo
Copy link
Member

syuilo commented Oct 4, 2019

これで良さそう

@syuilo syuilo merged commit a81d578 into misskey-dev:develop Oct 4, 2019
@syuilo
Copy link
Member

syuilo commented Oct 4, 2019

ありがとうございます 🙏🙏🙏

@u1-liquid u1-liquid deleted the indicate-input-invalid branch October 4, 2019 05:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants