From 00f2dc5d8dd99fe70823d7f0fe78d8a88413563d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Stefan=20L=C3=B6rwald?= <10850250+stefanloerwald@users.noreply.github.com> Date: Fri, 7 Aug 2020 19:00:54 +0200 Subject: [PATCH] Fix part of #659 There are still issues here, but I think it's probably in JS: when focus is lost on the textfield, the `mat-floating-label--float-above` is removed, irrespective of existance of text or placeholder. Needs some more investigation. What's fixed here is the situation where overlap occurs when the value is not just whitespace or when the placeholder is not just whitespace and should be visible. --- .../MatTextField/BaseMatInputTextComponent.cs | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/src/MatBlazor/Components/MatTextField/BaseMatInputTextComponent.cs b/src/MatBlazor/Components/MatTextField/BaseMatInputTextComponent.cs index 2b09bd15..a0c9417f 100644 --- a/src/MatBlazor/Components/MatTextField/BaseMatInputTextComponent.cs +++ b/src/MatBlazor/Components/MatTextField/BaseMatInputTextComponent.cs @@ -146,11 +146,17 @@ protected BaseMatInputTextComponent() () => this.FullWidth && this.Icon != null && this.IconTrailing) .If("mdc-text-field--textarea", () => this.TextArea); + bool TextOrPlaceHolderVisible() + { + return !string.IsNullOrEmpty(CurrentValueAsString) + || (!string.IsNullOrWhiteSpace(PlaceHolder) && FullWidth); + } + LabelClassMapper .Add("mdc-floating-label") .If("mat-floating-label--float-above-outlined", - () => Outlined && !string.IsNullOrEmpty(CurrentValueAsString)) - .If("mdc-floating-label--float-above", () => !string.IsNullOrEmpty(CurrentValueAsString)); + () => Outlined && TextOrPlaceHolderVisible()) + .If("mdc-floating-label--float-above", () => TextOrPlaceHolderVisible()); InputClassMapper .Get(() => this.InputClass) @@ -162,4 +168,4 @@ protected BaseMatInputTextComponent() CallAfterRender(async () => { await JsInvokeAsync("matBlazor.matTextField.init", Ref); }); } } -} \ No newline at end of file +}